(cache) 【はてなブログ】トップページ（表紙）に記事一覧を表示させる方法【Javascriptで転送（リダイレクト）】

【はてなブログ】トップページ（表紙）に記事一覧を表示させる方法【Javascriptで転送（リダイレクト）】

はてなブログには「続きを読む」機能があるが……

こんにちは！　たまに毒を吐くです。

はてなブログをやっていらっしゃる方は、記事に「続きを読む」を挿入して、トップページに何件かの記事を表示させていることが多いかと思います。

記事作成画面で「続きを読む」を挿入すると、

トップページでは下図のような記事の表示になります。

「続きを読む」にした場合のトップページ

トップページに表示する記事数は、管理画面の設定→詳細設定→「トップページの記事数」で指定出来ます。

トップページの記事数

ただ、記事の1つ1つにSNSボタンとはてなのAdsense、はてブコメントがくっついてくるので、なんだかゴチャゴチャした印象になります。

SNSボタンやはてブコメントは非表示に出来ますが（管理画面→デザイン→スパナみたいなマーク→記事→ソーシャルパーツ）、そうすると個別記事にも表示されなくなってしまいます。

「記事一覧」ページの見た目の方がスッキリしている

ところで、はてなブログには「記事一覧」というページがあることをご存知でしょうか。

トップページURLに「archive」をつけると、そのブログの記事一覧が表示されます。
（このブログの場合だと「http://dokuwohaku.hateblo.jp/archive」）

下図は「記事一覧」の見た目です

記事一覧

こちらの方が、「続きを読む」にしたトップページより、スッキリして見やすくないでしょうか。

「記事一覧」のアイキャッチ画像や記事の説明文は、

記事作成画面の「編集オプション」をクリックし、

編集オプション

「アイキャッチ画像」と「記事の概要」で入力したものになります（「アイキャッチ画像」はアイキャッチ画像にしたいものをクリックすればOK）。

「アイキャッチ画像」と「記事の概要」

私は、「続きを読む」にしたトップページより、「記事一覧」の見た目の方がいいなァと思ったのと、また、Adsenseの問題があったので（後述します）、トップページに記事一覧を表示させてみることにしました。

はてなブログトップページに記事一覧を表示させる方法

管理画面→設定→詳細設定に、「headに要素を追加」という項目があるので、

headに要素を追加

そこに以下のコードを記入します（「http://dokuwohaku.hateblo.jp/」をご自分のブログのURLに差し替えてください。3箇所あります）。

<script type="text/javascript">
  if( location.href == 'http://dokuwohaku.hateblo.jp/'){
  location.href='http://dokuwohaku.hateblo.jp/archive';
}
</script>
<noscript>
<p><a href="http://dokuwohaku.hateblo.jp/archive">広汎性発達障害の女が毒を吐くブログ</a></p>
</noscript>

「もしも現在地がトップページだったら、記事一覧に転送（リダイレクト）します」というJavascriptです。

URLを変更すれば、はてなブログに限らずお使い頂けます。

（ちなみに、location.hrefでなく、location.replaceにしたら、最新記事が表示されました）