はてなブログのトップページは、その方がユーザーにとって読みやすいだろうというはてなの思想があったからだと思いますが、記事一覧ページではなく1つ1つの記事が全文表示される仕組みになっていました。
個人的には、トップページからはいろいろな記事に遷移して、遷移した先でそれぞれの記事をじっくり読むという形式の方が好きです。
はてなブログを始めてからずっと何とかならないかなと思っていたところ、昨日はてなからリリースが出され、これを公式の方法として実現することができるようになりました（はてなブログPro限定ですが）。
一方これを実現したときに、従来サイドバーにモジュールとして表示していた「最新記事」がトップページにあると、記事一覧と内容が重複してしまうので、こちらを非表示にしました。
トップページを記事一覧表示にする方法
はてなブログを利用しているブロガーも、トップページが記事の全文表示であるよりも記事の一覧表示のほうがよいという考えの方が多いようで、サイトのトップページにアクセスすると自動的に記事一覧ページ（URLの末尾に/archiveをつけたページです。このブログですと http://www.yellowpadblog.com/archive になります）にリダイレクトさせる設定にしているブログも見かけていました。
しかしこの方法はSEO的には疑問があるところですし、はてな側でトップページを従来の記事の全文表示か記事一覧の表示かを選べるようにしてくれないかな、と思っていたところ、昨日このようなリリースがはてなから出されました。
ブログのトップページを「一覧形式」で表示できるようにしました（はてなブログPro） - はてなブログ開発ブログ
はてなブログProを使っているユーザー限定ですが、はてなブログのトップページを記事一覧ページにすることができるようになっています。
上記のエントリには切り替えの方法が丁寧に書いてあり、簡単に切り替えることができます。このブログでも、早速この表示形式に切り替えました。
今まで望んでいた表示形式であり、満足しています。
そこで気になったのが、サイドバーにモジュールとして表示させていた「最新記事」です。
トップページにアクセスしてくださったユーザーに対して、
- メインのコンテンツカラムにて今回の更新のように記事一覧を表示
- サイドバーカラムでも最新記事を表示
としていると重複した内容を見せてしまうことになりますので、
最新記事をトップページからは消すが、記事ページには表示する
というように設定しました。
最新記事をトップページからは非表示、記事ページには表示にする方法
サイドバーのモジュールである最新記事のクラスは .hatena-module-recent-entries 、トップページのクラスは .page-index となっています。
そのため、デザインCSSにてこのクラスを非表示にする設定をすれば、トップページから最新記事を消すことができます。
はてなブログの管理画面
↓
デザイン
↓
カスタマイズ
↓
デザインCSS
というように進んでいき、このデザインCSSに
.page-index .hatena-module-recent-entries {
display: none;
}
と記入すればOKです。
はてなブログの構成やそのidやclassがなかなか見つからなかったのですが、
はてなブログのidとclassのツリーと図解を作ってみた - cBlog
こちらのページに詳しく解説されていましたので助かりました。ありがとうございます。
最後に
はてなブログPro限定の機能とはなりますが、今までいろいろな方法（アーカイブページに飛ばすなど）でトップページに記事一覧を見せていたサイトが多くある中で、はてなもこの機能を開発したのだと思います。
このブログでも導入し、またついでに各記事の下部に関連記事が表示されるように設定しました。このカスタマイズは
はてなブログで記事下に関連記事を出すカンタンな方法 - ボクココ
こちらの記事を参考に、というかこの方法をそのまま使わせていただきましたが、こちらもとても簡単に行うことができました。
はてなブログProはいろいろなカスタマイズができますし、独自ドメインを取れたりキーワードリンクを無くしたり広告を非表示にできるなどのメリットがありますため、おすすめです。
ブログカスタマイズはいろいろな方がいろいろな方法を提供してくださっていますので、参考にさせていただきつつこのブログもより見やすいものにしていきたいと思っています。
最後までお読みいただき、ありがとうございました。
今後もいろいろなエントリを書いていきますので、ぜひお気軽にTwitterのフォローや読者登録をお願いします。