ブラックリストのキリンです

延滞、自己破産、債務整理でブラックになった人を応援するブログ

 メニュー

はてなブログのトップを「記事一覧」にするカスタマイズ方法まとめ!

f:id:oshaberiitboy:20180615033714p:plain

 

【2018.06.15追記】

 

※ここで紹介している方法は「はてなブログ無料版」にて有効な方法です。有料のはてなブログProを利用の場合は以下の手順を参考にしてください。

 

ダッシュボード > 設定 > 詳細設定 > トップページの表示形式(PC版) > 一覧形式

 

これで全文形式から一覧形式への変更ができます。レスポンシブデザイン適用ならスマホも一覧形式で表示OK。はてなProは素晴らしいね!

 

追記終わり!では、本文をどうぞ!

 

...今回は、はてなブログのトップを「記事一覧」で表示する方法について書いていきます。

 

はてなブログでずっと感じていたのは、とにかくトップページが見づらいということ。

 

今までの当ブログのトップ画面は下のような構成でした。

 

f:id:oshaberiitboy:20170822030653j:plain

 

一番上に最新記事の内容が長々と表示されるので、次の記事を見るためにはかなりスクロールしなきゃダメでした。

 

別にその表示でもいいんじゃないの?

人それぞれだけど、「記事一覧」だとタイトルだけ表示されるから手軽なんだよね

 

 一応「続きを見る」ボタンで記事は省略できてました。でも、私としてはヒトデさんのブログの様にトップページの様にもっとコンパクトにしたかった。

 

 

いまは形式が変わってますが、以前は「最新記事がタイトルのみ表示されてる」トップページでした。めちゃめちゃスッキリしてて見やすかったんです。

 

そこで無料版はてなブログでも「記事一覧」でトップを表示できないか調べてみました!

 

 

 

 はてなブログ無料版でもトップを「記事一覧」にカスタマイズできる!

 

ありがたいことに、トップを記事一覧で表示することはできます。 

 

こちらの記事を参考にしました。

 

 

以下はその詳細の方法です!

 

①:「設定」→「詳細設定」の順に選択

 

f:id:oshaberiitboy:20170822033103j:plain

 

 

管理画面の自分のIDを選択すると縦長のバーが出てくるので、その中から「設定」を選びましょう。

 

設定画面の3つ並んでいる項目から、真ん中の「詳細設定」を選択します。

 

②:「検索エンジン最適化」の「headに要素を追加」に指定コードを打つ。

 

f:id:oshaberiitboy:20170822033529j:plain

 

「検索エンジン最適化」は、詳細設定のやや下の方です。

 

入力するのは、以下のコードです。

 

<script type="text/javascript">

if( location.href == 'http://oshaberiitboy.hatenablog.com/'){
location.href='http://oshaberiitboy.hatenablog.com/archive';
}
</script>
<noscript>
<p><a href="http://oshaberiitboy.hatenablog.com/archive">ブログタイトル</a></p>
</noscript>

 

注意点として、

 

赤字 → 自分のはてなブログのURLに変更

青字 → 自分のはてなブログのタイトルに変更

 

コチラに変更をお願いします。

 

コードのURLのすぐ次にある「/」は、消さないでくださいね。

 

③:コード入力後、一番下の「変更する」を選択

 

コードを入力したら、最後に「変更する」を押しましょう!

 

ここまで上手くいけば...

 

f:id:oshaberiitboy:20170822034835j:plain

  

わお!記事一覧形式になりました!

 

「続きを読む」で区切ってたときより見やすくなったね

 

自分でも、ページを見るときのストレスが減ったと思います!

 

おわりに:はてなブログProにすれば記事一覧にカンタンに変更できる

 

というわけで、はてなブログ無料版でトップを記事一覧にする方法を書きました。

 

...でも、こんな手間をかけなくても、はてなブログProだったらすぐに変更ができるんですよねえ。

 

今はProにして独自ドメインを取得しないと、グーグルアドセンスの審査に通らないと言われてます。

 

ずっと無料でいい!...とか、アドセンス以外で収益を用意する!...という人でなければ、お金はかかるけどProにしたほうが良いんじゃないかなあと思います。

 

 

本日は、以上です!