みやもとメモ

「Notion」「資格」「ブログカスタマイズ」「Microsoft To Do」「Chrome拡張機能」などについて書いていきます。

目次
目次

【はてなブログ-カスタマイズ】「続きを読む」機能で疑似的に一覧形式にする

この記事をシェアする

はてなブログを始めた当初、トップページの全文形式の表示に不便を感じていました。

ですがどうやら、はてなブログの無料版だと一覧形式には変更できないようでした。
なので全文形式しか選択肢がありません。

何とかならないものかと色々と調べたところ、どうやら続きを読む機能というのがあるようでした。
これによって疑似的に一覧形式にできました。

はてなブログProの方なら一覧形式に変更できるので、この件に関して悩む必要もないです。
ですが私はなんとか無料版で頑張りたいので試行錯誤してみました。

ということで今回は「続きを読む」機能についてアレコレ書いてみます。

困りごとの詳細

記事の冒頭でも触れましたが、まずは困りごとの詳細を書いてみます。

個人的に一覧形式が好み

ブログのトップページは個人的に一覧形式が好みです。
初めて訪問するブログであれば「どんなブログなのかなー」というのをまず知りたいわけで。
なので一覧形式で表示して、直近の記事がどんなものか分かりやすいトップページにしたいのです。

無料版は一覧形式に変更できない

記事の冒頭でも触れましたが、はてなブログの無料版だと一覧形式に変更できないです。
全文形式しか選択肢がないです。

無料版は一覧形式に変更できない

全文形式はけっこう不便

全文形式だとトップページから直近の記事数件を参照するのがどうしても不便です。
めちゃくちゃスクロールしないといけない。。
なので結局「最新記事」のリンクを探してクリックして、そこから一覧形式で参照する。みたいな手間が発生します。

ただ正直、ブログによっては最新記事を探すのも手間なんですよね…ブログによってデザインもバラバラですし。
なのでトップページでなんとか工夫したいなと。

「続きを読む」の設定でどう変わるか

ということで「続きを読む」の設定をするわけなのですが、まずは手っ取り早く変更後の画像を貼ります。

「続きを読む」設定後

こうなります。
記事の途中に「続きを読む」が差し込まれます。

「続きを読む」を設定しない場合は、トップページに記事の最後まで表示されます。

「続きを読む」設定のメリット

一覧性が向上する

少しのスクロールで直近の記事がざっくり分かるので、初めて訪問する方に対しても「どんなブログなのかなー」というのが分かりやすく伝わります。

「最新記事」を探す手間が省ける

全文形式のブログでよくやっている「最新記事」のリンクを探してクリックして、そこから一覧形式で参照する。みたいな手間がなくなります。

とはいえ「最新記事」のページの方が更に一覧性が優れているなと感じます。
なので更にこだわりを追求するなら結局は「はてなブログPro」になってしまいそうです。

ページの読み込みが早くなる

「続きを読む」を設定することによって一度に読み込むデータ量が減ります。
結果としてページの読み込みが早くなります。

全文形式で10件表示とかだと、ページの読み込みにけっこう時間がかかります。(自分のブログの記事1つ1つがけっこう長いのも影響してますが。)

「続きを読む」の設定手順

一応、設定手順を載せておきます。

記事1つ1つに設定する必要がありますが、自分の場合は幸い記事数がまだ少なかったのでサクッと設定できました。

また、大体の記事に目次を設定していたこともあり、基本的に目次の直前に「続きを読む」を設定すればOKでした。

STEP
記事編集ページで「続きを読む」を設定したいところをクリック
STEP
「続きを読む」をクリック
(おそらくどの編集モードでも設定可能なはず)
STEP
「続きを読む」が設定される
STEP
「更新する」ボタンをクリック
STEP
トップページを確認する
「続きを読む」が差し込まれているはずです。

「続きを読む」は記事ページでなく、トップページに適用されます。
なのでトップページで変更内容を確認する必要があります。

ついでに記事数も調整する

トップページの記事数は無料版でも変更できます。
「1」~「15」の範囲で変更できるみたいです。
自分は「10」に設定しています。

「続きを読む」の設定によって疑似的な一覧形式になったところで、どのくらいが適切かなーと検討しながら設定するのが良いかなと。

トップページの記事数を変更できる

おわりに

ということで「続きを読む」機能についてアレコレ書いてみました。

正直、はてなブログProにしてしまえば更に利便性が向上できますし、カスタマイズの自由度も増えそうです。

ですが、はてなブログの無料版の範囲でも色々と試行錯誤できますし、結果として疑似的な一覧形式に出来たので良かったです。

関連記事

はてなブログ関連の機能は他にも記事を書いています。
気になる記事があればぜひ。

TOPへ戻る HOMEへ