2008年11月19日
2006年10月14日
月別に記事のタイトル一覧を表示させる（FC2）
07/03/30 19:00追記
のんびり前進じたばた生活のまゆびさんが一覧表示の際に、日付が記事リンクの前に出るようにして見やすく改良してくれましたので、yozoも同様に変更いたしました。 まゆびさん、ありがとうございます♪m(_ _)mまゆびさんの記事はコチラ→月別の記事一覧を表示!! のんびり前進じたばた生活
右サイドバーの月別アーカイブをクリックすれば、選択した月の記事タイトルを一覧表示できるようにしました。FC2ブログ ユーザーフォーラムで検索して、ヒントを得て、同じくテンプレート中で使える変数一覧を参考にしました。 このFC2ブログ ユーザーフォーラムのことはお友達のROOM-Mのmioさんから薦めていただきました。とても勉強になってます。ありがとーございまっす♪m(_ _)m
※注意：このカスタマイズはFC2ブログの独自タグを使ったものですから、FC2ブログの方だけにしか使用できません。
月別に記事のタイトル一覧を表示させる（FC2のみ）
- FC2ブログにログインして、管理者ページの左サイドの「環境設定」の項目[テンプレートの設定]をクリックします。
- 「現在設定されているスタイル」の表の「編集」の欄の[ 修正 ]をクリックします。
- 「テンプレートの編集」にある、「HTMLの編集[テンプレート名]を編集しています。」の欄の中でクリックします。（この中であればカーソルはどこでも構いません。）
- [Ctrl]＋[F]([Ctrl]キーを押しながら[F]キーを押す意味です。)で、検索ダイアログが開きますから、これに<!--topentry-->と入力して、検索してください。
- 必ずバックアップしましょう！
いつも書いてますが、編集する前に、必ずHTMLのコードをコピーして、「html_bk.txt」(例)のようにバックアップファイルを作成しておきましょう。間違って失敗しても、「html_bk.txt」の内容をコピペすれば、元に戻すことができますよ♪ - <!--topentry-->のすぐ上のあたりの記事部分の始まりに、下のコードを追加してください。<!-- 月別ページでの一覧開始 -->※yozoの場合は、<!-- 中央カラム開始 -->のすぐ上に追加しましたが、テンプレートによっては、<!-- エントリー -->のすぐ上だったり、またコメントがなく、<div class="blogbody">のすぐ上に追加する場合もあります。
<!--date_area-->
〜省略〜
<!-- /月別ページでの一覧終了 -->
<!--not_date_area-->〜途中省略〜
<!-- 月別ページでの一覧開始 -->
<!--date_area-->
<div class="entry-content">
<div class="entry-body">
<div class="date_area">
<span style="color:#ff3300; font-size:15px;"><%now_year>年<%now_month>月の全記事一覧</span>
<ul>
<!--topentry-->
<li>
<%topentry_month>/<%topentry_day>
<a href="<%topentry_link>#CommentHeader" title="<%topentry_title>へ"><%topentry_title></a>
</li>
<!--/topentry-->
</ul>
<a href="<%prev_month_link>" title="<%now_year>年<%prev_month>月の全記事一覧へ" class="n p<%prev_year><%prev_month>">≪<%now_year>年<%prev_month>月の全記事一覧へ</a>
<%now_year>年<%now_month> 月の全記事一覧
<a href="<%next_month_link>" title="<%now_year>年<%next_month>月の全記事一覧へ" class="n p<%next_year><%next_month>"><%now_year>年<%next_month>月の全記事一覧へ≫</a>
<p class="content-nav">
<!--prevpage--><a href="<%prevpage_url>" title="前のページへ" id="nav_previous" name="nav_previous">≪New </a><!--/prevpage-->
<a href="<%url>" title="メインへ" id="nav_main" name="nav_main">メイン</a>
<!--nextpage--><a href="<%nextpage_url>" title="次のページへ" id="nav_next" name="nav_next"> Old≫</a><!--/nextpage-->
</p>
</div></div></div>
<!--/date_area-->
<!-- /月別ページでの一覧終了 -->
<!--not_date_area-->
<!-- 中央カラム開始 -->
<div id="content">
<div class="blog">
<!--topentry-->〜以下省略〜
<div class="entry-content">
<div class="entry-body">
〜
</div></div>
の部分は、ご使用されているテンプレートのHTMLファイル内で<%topentry_body>を検索して、それを囲む部分にあわせてください。
ここのブログの場合は上のようになっていましたので、〜途中省略〜
<div class="entry-content">
<div class="entry-body"><%topentry_body>
〜以下省略〜
<div class="entry-content">
<div class="entry-body">
〜
</div></div>としました。 - <!--中央カラム終了-->を検索して、そのすぐ下に
<!--/not_date_area-->を追加してください。〜途中省略〜
<!--/edit_area-->
</div><!-- /blog -->
</div><!-- /content -->
<!-- 中央カラム終了 -->
<!--/not_date_area-->〜以下省略〜
- 「スタイルシートの編集[テンプレート名]を編集しています。」の欄の一番下に次のコード追加して、タイトル一覧の体裁を整えます。ここは自由に設定してください。
- 必ずバックアップしましょう！
いつも書いてますが、編集する前に、必ずCSSのコードをコピーして、「css_bk.txt」(例)のようにバックアップファイルを作成しておきましょう。間違って失敗しても、「css_bk.txt」の内容をコピペすれば、元に戻すことができますよ♪/* 月別一覧表示部分*/
.date_area {
margin: 20px 230px 10px 30px;
padding: 15px;
color: #444444;
font-size: 11px;
line-height: 140%;
background: #ffeebf;
border: 1px solid #666666;
} - [更新]をクリックして動作を確認しましょう。
- yozoからのお願い
また、言うまでもないことですが、この記事を参考にされるのでしたら、「テンプレート改造」は自己責任で行ってください。そして、改造前には必ずバックアップを取っておくようにしてくださいね♪
この記事を参考にされた場合は、結果や感想を、CommentやTrackbackしていただけたら、うれしいです。もちろん、「これではおかしいのでは？」とか「こうしたほうが良い。」というご指摘やご指導もありがたく頂戴したいと思っています。よろしくご協力ください。 m(_ _)m
↓ ぽちっと応援お願いします♪ m(_ _)m
≪New カテゴリの記事一覧を表示させる（FC2のみ） | Top | BlogPetうさもの初くちぐせdeツッコミ＠後姿ラブリー同盟 Old≫
トラックバックURL
トラックバック
≫ 月別＆カテゴリーページを記事一覧表示 from HAPPY TALK ?
月別のページとカテゴリーページに記事のタイトル一覧表示にしました。MovableTypeだとカテゴリー用、月別用とテンプレートがあって、サイドバーにそれぞれに対応した記事タイトルの表示が出来たけど、FC2は1つのテン [Read More]
トラックバック
≫ 月別の記事一覧を表示!! from のんびり前進じたばた生活
「ブログを見てくださる方が、見やすいようにしたい!!」と思いながらなかなか出来ておりませんでした。また少しずつ頑張っていこうと思います♪自分自身が過去記事を探しにくいというのもありますし。(笑)まずは [Read More]
コメント
早速試してみたら・・・。本当だぁー♪
月別でタイトルが表示されてるねー♪
これはとっても便利な機能かも!!!!うんうん。
これがあればあれ・・・。どこだっけとかって探す必要もなくなっちゃうし、いいねーー!!!!
ウンウン。とっても便利。
これも覚えておこう!!!!
使ってみたいわ!!!
もちろん応援クリックしちゃう!!!
Posted by enu at 2006.10.15 10:01 | edit
コメント
おぉぉ、また便利になりましたねー。
これは読み手にとって嬉しいですね。
テンプレートにもよるのですが、過去の記事の紹介をするときに
記事タイトルをクリックをしてもパーマリンクがわからないものが
たまにあるので（自分の知識不足で探せないんです＾＾；）
そういう時にメチャ便利です(･ω･)(._.)(･ω･)(._.)ｳﾝｳﾝ♪
記事が多くなって来た時の検索にも一役買いそうですし
とても素敵です〜〜〜(*´ω`*)ﾎﾟｯ
早速ブックマーク・・・（笑
いつも勉強になります、ありがとうございます〜〜(｡･ω･｡)ゞピッ♪
Posted by モンビッケ at 2006.10.15 11:20 | edit
コメント
＞早速試してみたら・・・。本当だぁー♪月別でタイトルが表示されてるねー♪
えへへ・・・なかなかかっこいいでしょ♪お友達にはあまり役に立たないかも知れませんが、yozo本人の管理にはとても役に立ちますよ。enuちゃんなら、カテゴリーのタイトル一覧の方がいいですよね。（って実はもうやってたりして・・・また紹介するつもりです。 (^○^) ）
＞ウンウン。とっても便利。これも覚えておこう!!!!使ってみたいわ!!!
ありがとーございまっす♪とっても励みになります♪ v(=∩_∩=) ﾌﾞｲﾌﾞｲ!!
Posted by enuちゃんへ at 2006.10.15 11:51 | edit
コメント
＞おぉぉ、また便利になりましたねー。これは読み手にとって嬉しいですね。
そうでしょ♪読み手のみなさんにも便利だし、管理人のyozo本人がめっちゃ便利なんですよ。記事タイトルと並べていると、バランスも保てますからね。(*ﾟ▽ﾟ)*｡_｡)*ﾟ▽ﾟ)*｡_｡)ｳﾝｳﾝ
＞記事タイトルをクリックをしてもパーマリンクがわからないものがたまにある
そうですよね♪タイトルだったり、日付だったり、「固定リンク」だったりしますもんね。ちょっと話がそれますが、はっきりリンクしやすくしておく配慮も必要ですよね。yozoが使用している小粋空間様のテンプレートはわかりやすくなっていますね。使えば使うほど勉強になってるんですよ。(^○^)
＞早速ブックマーク・・・（笑いつも勉強になります、ありがとうございます〜〜(｡･ω･｡)ゞピッ♪
こちらこそ、いつも大変励みになっていますよ。お互い勉強しなきゃですよね♪('-'*)ｴﾍ
Posted by モンビッケさんへ at 2006.10.15 12:23 | edit
コメント
なになに。。。あっほんとだー。
とっても便利な機能ですねーぇ！！
yozo殿のブログは過去記事をまた読みたい時が結構あるので
これはお役立ちです☆
なるほど月別だけじゃなくカテゴリ別とかにすると
ほんとに色々と幅広く使えるんですねぇ。
Posted by babar at 2006.10.15 16:58 | edit
コメント
＞なになに。。。あっほんとだー。とっても便利な機能ですねーぇ！！
＞yozo殿のブログは過去記事をまた読みたい時が結構あるのでこれはお役立ちです☆
そうでしょ♪とっても便利だと思いますよ。実はyozo自身に一番便利なんです。過去記事のチェックや、コンテンツの偏り具合がわかって、「そろそろこのカテゴリーの内容を記事を書いたほうがいいな」って調節しやすくなりますからね。エキブロのときは普通にできていましたからね。(^○^)
＞なるほど月別だけじゃなくカテゴリ別とかにすると、ほんとに色々と幅広く使えるんですねぇ。
あらら・・・この後すぐに、カテゴリー一覧表示の記事をUPしますよ♪こちらが本当に訪問してくださったみなさんに役立つ機能だと思いますよ♪先回りされちゃってるようですね♪(ﾟｰﾟ;Aｱｾｱｾ
Posted by babarさんへ at 2006.10.15 19:08 | edit
コメント
これは本当に記事を探しやすいですよね。
月ごとに全部の記事が一覧に出ますしすごいなぁ。
以前のテンプレにはつけていたのですが、
今のテンプレにはつけてなかったです。
本当に分かりやすい記事で私でも挑戦できそうです。
またお世話になりましたら、コメントかトラバ入れさせていただきます。
いつも分かりやすい記事をありがとうございます。(o*。_。)oペコッ
Posted by まゆび at 2006.10.15 22:50 | edit
コメント
＞これは本当に記事を探しやすいですよね。月ごとに全部の記事が一覧に出ますしすごいなぁ。
そうなんですよ♪訪れてくれるみなさんにも役に立つし、何よりもyozo自身が自分の記事の管理がしやすくなります。これもエキブロではデフォの機能なので、FC2になくて不便でしたよ。(*^-^)
＞以前のテンプレにはつけていたのですが、今のテンプレにはつけてなかったです。
そのようですね。XHTML準拠もしてますから、問題なく設置できると思いますよ。表示部分のclassは思いっきり楽しくカスタマイズするのもおもしろいかもしれませんね。(^○^)
いつでも時間のあるときにお試しあれ＼(*⌒0⌒)ｂがんばっ♪
Posted by まゆびさんへ at 2006.10.16 11:19 | edit
コメント
何度もこの方法を自分のブログに使いたいとトライしてるのですが、なかなか出来ません。
順序４ の<!--topentry-->を探すまでは出来るのですが、それ以降が進みません。
と言うのも、、<!-- 中央カラム開始 -->、<!-- エントリー -->、<div class="blogbody">などの上に貼り付けたとのことなのですが、私のテンプレートにはこれらのコードが無く、ここでつまづいてしまってます。
私の使用してますテンプレートはＦＣ２公式テンプレートなのです。
なんとかこの方法を導入したいのですが、素人の私は諦めるしかにのでしょうか・・・
残念です。
お返事いただけるとうれしいです。
Posted by ＫＫ at 2007.06.08 11:07 | edit
コメント
恐れ入りますが、ここのブログでは、URLを入力していただけない質問は遠慮していただいています。詳しくは下の記事の追記部分の「質問に関する注意」をご覧ください。
http://yozoblog2.blog63.fc2.com/blog-entry-497.html
＞<!--topentry-->を探すまでは出来るのですが、それ以降が進みません。
<!--topentry-->のすぐ上のあたりの<ｄｉｖ class="★☆★">の上に追加してみてください。もしやってみたけどダメだったということなら、yozoにもどうしようもありません。（こればかりは公式テンプレートでも、テンプレート作者によって表現が違っていますので。）本来なら、お答えは控えさせていただくところですが、念のため申し添えておきます。
Posted by ＫＫさんへ at 2007.06.09 10:03 | edit
コメント
こちらの記事を参考にさせていただき、とても見やすくまとめる事が出来ました。
どうもありがとうございました。
Posted by ぼづ at 2007.06.16 01:41 | edit
コメント
月別タイトル一覧がうまく表示できましたか♪ｵﾒﾃﾞﾄｰｺﾞｻﾞｲﾏｯｽ♪(*⌒ｰ⌒)o∠★:ﾟ*PAN!
お役に立ててとてもうれしいです。今後ともよろしくお願いします。m(_ _)m
Posted by ほづさんへ at 2007.06.16 11:55 | edit