【無料版はてなブログ】トップページのカスタマイズ。簡単コピペ！
今回はトップページについてです！
サイトのトップページはいわば『顔』です！
無料版はてなブログのその『顔』となるトップページは、最新記事が最上位にあって、ページ下部に進んでいくと今までの記事の全文がただひたすらズラーッと並んで全てが表示されていて、とにかく見辛くてなりません( ；´Д｀)
はてなブログの有料版ですとトップページに記事を簡単にアーカイブ表示できるようなんですが、無料版はてなブログでもスッキリ見やすいトップページに変更、設定する方法がありますので、今回はそれを紹介したいと思います。
トップページを一覧で表示するには
無料版のはてなブログのトップページに記事の一覧を表示する方法は2通りあります。
①無料版のはてなブログにもとから搭載された『続きを読む』機能を使う。
②『Javascript』を使う。
このふた通りの方法があります。
『続きを読む』機能を使う
この『続きを読む』を挿入することで、全文表示されている記事を省略して表示できます。
それぞれの記事を省略することで、下に表示されている過去の記事も確認しやすくするということです。
『続きを読む』機能に関してはもともと無料版はてなブログにも標準装備なので設定やコピペなども何もせず、記事を書きながらワンクリックでできます。
『続きを読む』の使い方
とにかく簡単。記事の境界にカーソルを合わせて
これだけです。
簡単です！
『続きを読む』のメリット
先述にもある通り、簡単に誰でも今すぐにでもできます！
標準装備で、何も設定を変える必要もないので不具合なども一切ないと思われます。
『続きを読む』のデメリット
記事を制作中に機能を使うということになりますので、以前に書いた記事は全文表示になります。これまで作った全ての記事に適用するとなるとなかなかの手間かもしれません。
それと、当たり前ですが記事の区切りを自分で決めることになるので、どこで区切るかわたしならちょっと迷います（笑）
それよりなにより一番のデメリットは ”目次” 以降に『続きを読む』を使うと目次が機能しなくなるということです´д` ;
『続きを読む』以降の文章がリンクしなくなるので、記事一覧としての見た目は良いんですけど、なんとなくスッキリしません。
『Javascript』を使ってアーカイブ形式に表示する
はてなブログ無料版には『Java script』を埋め込んでカスタマイズする方法がたくさんあります。
今回参考にさせていただきましたのはこの２記事です。ありがとうございました。
↑↑の記事に詳しく書いてありますが、要は、トップページを開いたときに自分のブログのアーカイブページに飛ばす設定をします。
アーカイブ形式のメリット
一度設定しておくと、全ての記事に反映される。
これが一番です！
アーカイブ形式のデメリット
ネット上ではgoogleの評価が下がるらしいと言われているみたいですが、それだけの理由で評価が下がるとは考えにくいですし、基準もよくわからないので私は気にしないことにしました(笑)
長い目で見ても読んでいただく方々が読みやすいサイトの方がいいと思うので！
『Javascript』のソースコード
こちらのコードを元にして貼り付けます。
<!-- トップページ記事一覧設定 -->
<script type="text/javascript">
if( location.href == 'https://◯◯◯/'){
location.href='https://◯◯◯/archive';
}
</script>
<noscript>
<p><a href="https://◯◯◯/archive">koromorog 〜ころもろぐ〜</a></p>
</noscript>
赤文字の部分はご自身のブログのURLに置き換えてください。
注意点としては３行目以降のURLの後ろにある『archive』を消さないように！
青文字の部分はご自身のブログタイトルに。
貼り付ける場所
下にスクロールしていって
貼り付けたらまた下に移動
『変更する』を忘れずにクリック！
ここまで間違いがなければトップページを読み込んでみると一覧表示になっているはずです。
さいごに
今回のカスタマイズはトップページをすっきり見やすくするのには必須ではないでしょうか？
過去の記事が埋もれて行ってしまうのは仕方がないとは思いますが、せっかく書いた記事なので出来るだけ目に止まって欲しいです！
