「はてなブログPro」記事の読了時間の目安を表示

これから「はてなブログPro」を始めようと考えている人、既に始められている人にも、よろしかったらご参考にしてみてください。

記事の読了時間の目安を表示

週刊はてなブログから「コピペでOK！はてなブログで記事の読了時間の目安を表示させてみた！ 」の記事を利用させて頂き、記事の読了時間の目安の表示しました。
利用しました「JavaScriptのコード」は以下になります。

<script type="text/javascript">
addEventListener('DOMContentLoaded', function() {
var wpm = 800;
var length = $('.entry-content').text().trim().replace(/[\n\r]/g,'').length;
var message = '<p style="font-size: 80%; color: #999999; text-align: right;">この記事は約'+ Math.ceil(length/wpm) +'分で読めます。</p>';
$('.entry-content').prepend(message);
}, false);

上記コードにあるwpmは、1分間に読むことができる文字数を表し、ここでは800文字に設定されています。
私は老眼なので、800文字より少ない方が無難かな...

ブログへの設定方法は、「ダッシュボード」＞「デザイン」＞「カスタマイズ」を選択し、「記事」メニューを展開して、下の方へスクロールしていき「記事上下のカスタマイズ」を表示させます。
「記事上」のテキストエリアに、さきほどコピーしたJavaScriptのコードを貼り付けてください。貼り付けが終わったら保存します。

ブログ「すずろく」のすずしんさんありがとうございました。

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

次回もよろしくです。