Change Forward

「かわる」をアシストする

【プログラミング不要】1分ではてなブログに読了時間を表示させる方法

 

【プログラミング不要】1分ではてなブログに読了時間を表示させる方法

 

【プログラミング不要】1分ではてなブログに読了時間を表示させる方法


※クリックで拡大できます。

 

ブログのカスタマイズを検討するとき、そのうちの1つに読了時間の表示があるかと思います。

 

記事を読むためにかかる時間をあらかじめ提示することで、ページを読もうとしている方に安心して読んでもらうことができます。

 

今回はCSSを使わずに読了時間を表示する方法をご紹介したいと思います。

 

【この記事を読むメリット 】

  • 読了時間の表示ができるようになる
  • 他のブログと差が付けられる

 

1分で読了時間は表示できます。

 

それでは今回のコンテンツです。

 

   

読了時間はプログラミングいらず

 

ブログのカスタマイズはHTMLとCSSを編集する方法がメジャーですが、普段PCをあまり使わない方や、プログラミングをしたことがない方にはなかなか敷居が高いものかと思います。

 

今回の方法はとてもシンプルで、はてなブログの標準機能を使うだけで表示ができるようになりますので、画像通り進めることで必ず読了時間が表示できます。

 

ぜひ試してみてください。

 

カテゴリーを編集する

プログラミングをしない代わりに使用する機能は「カテゴリー」です。

 

本来、ブログ記事のジャンルを分けるために使う機能ですが、ここに読了時間を追加することで表示が可能になります。

 

まずは記事の編集画面に進みます。

画面右側の「カテゴリー」アイコンをクリックします。

 

【プログラミング不要】1分ではてなブログに読了時間を表示させる方法

 

これまで登録したことのあるカテゴリーが一覧で表示されます。

記事のカテゴリーを選択した後に「読了時間:○分」と記入し、Enterキーを押します。

 

【プログラミング不要】1分ではてなブログに読了時間を表示させる方法

 

 

【プログラミング不要】1分ではてなブログに読了時間を表示させる方法

 

そのまま記事の公開をすれば、カテゴリが表示される場所に「読了時間:○分」のアイコンが表示されます。

 

ポイントは、記事本来のカテゴリを先に設定することです。

 

はてなブログでは、カテゴリー別の記事一覧を表示する際は先頭に登録されたものでジャンル分けされる仕様になっているようです。

 

そのため、本来のカテゴリーを先に登録し、後から読了時間のカテゴリーを入力してください。

 

あっという間にできる!

 

 

注意すること

サイドバーなどでカテゴリーを表示している場合、読了時間のカテゴリーが表示されて見づらくなってしまうことがあります。

 

【プログラミング不要】1分ではてなブログに読了時間を表示させる方法
 

この場合は、サイドバーの設定を変更しましょう。

 

サイドバーの設定を変更する

ダッシュボードからデザインをクリック。

 

【プログラミング不要】1分ではてなブログに読了時間を表示させる方法

 

カスタマイズアイコンをクリックし、サイドバーをクリック。

 

【プログラミング不要】1分ではてなブログに読了時間を表示させる方法

 

「並び替え順」をカスタムに、表示件数を○件まで表示に設定。

 

【プログラミング不要】1分ではてなブログに読了時間を表示させる方法

 

表示したいカテゴリー数分を表示するように数字を入力し、カテゴリーの並べ替えをします。クリックしたままマウスを動かすことで、上下に動かすことができます。

 

【プログラミング不要】1分ではてなブログに読了時間を表示させる方法

 

設定が終わったら適用ボタンをクリックし、変更を保存するボタンをクリックして設定完了です。

 

これで必要なカテゴリーだけを一覧表示させながら、読了時間を表示することができます。

 

プログラミングなしでもここまでできる!

 

 

機能追加にプログラミングは不要

プログラミングができるに越したことはありませんが、標準機能を正しく使うだけでもいろいろなことができます。

 

オリジナルの使い道を考えてみてはいかがでしょうか。

 

ご覧くださりありがとうございました。

 

このブログははてなブログで運営しています。
スター・ブックマーク・読者登録いただけると励みになります。
 

 

2019.7.21 公開