投稿記事の読む時間の目安を表示する方法
概要
他のブログの記事を見ていると、投稿記事の更新日付などが表示されている部分やタイトル付近に、この記事は〇〇分で読めますなど表示しているブログがあります
WordPressでは、そのようなプラグインもあるみたいですが、本ブログではテンプレートに直接コードを書く方法で実施します
読む時間の目安を表示する方法
「single.php」に読む時間の目安を表示するPHPコードを挿入して、そのコードを呼び出して表示します。具体的に追加するコードを以下となります
読む時間の目安を表示するPHPコード
<?php
$mycontent = $post->post_content;
$word = mb_strlen(strip_tags($mycontent));
$m = floor($word / 600)+1;
$time = ($m == 0 ? '' : $m) ;
?>
この記事は約<b><?php echo $time; ?></b>分で読むことができます。
コードは比較的にシンプルで、読む時間は600文字を1分で読めるように設定しています。「$m = floor($word / 600)+1;」の箇所を編集すれば、1分あたり文字数を変更できます
実際に、「single.php」に追加する手順を紹介します
1.管理画面より「外観」→「テーマの編集」を選択し、「編集するテーマを選択」より現在使用しているテーマを選択します
2.個別投稿のsingle.phpを選択します。本ブログではsingle.phpですが、使用しているテーマによっては違う場合がありますので注意してください
3.表示する箇所を探します。私の場合は更新日付の横に表示しますので以下のコード(php if ($mtime = get_mtime('Y/m/d’)) echo〜)の下に追加する予定です
コードを追加する前のテンプレートの一部(追加するコードの位置)
<div class="blogbox">
<p><span class="kdate"><i class="fa fa-calendar"></i>
<time class="entry-date" datetime="<?php the_time('c') ;?>">
<?php the_time('Y/m/d') ;?>
</time>
<?php if ($mtime = get_mtime('Y/m/d')) echo ' <i class="fa fa-repeat"></i> ' , $mtime; ?>
/* ------------------------
ここにコード追加して表示するようにします
------------------------
*/
<!? ?>
</span> </p>
</div>
4.実際に追加したら、以下のようになります
コード追加したテンプレートの一部
<div class="blogbox">
<p><span class="kdate"><i class="fa fa-calendar"></i>
<time class="entry-date" datetime="<?php the_time('c') ;?>">
<?php the_time('Y/m/d') ;?>
</time>
<?php if ($mtime = get_mtime('Y/m/d')) echo ' <i class="fa fa-repeat"></i> ' , $mtime; ?>
<!? ここから何分で読めます ?>
<?php
$mycontent = $post->post_content;
$word = mb_strlen(strip_tags($mycontent));
$m = floor($word / 600)+1;
$time = ($m == 0 ? '' : $m) ;
?>
この記事は約<b><?php echo $time; ?></b>分で読むことができます。
<!? ここまで何分で読めます ?>
</span> </p>
</div>
5.追加しましたら「ファイルを更新」して終了です
下記ように、この記事は約◯分で読むことができます。 と表示されていればOKです
ディスカッション
コメント一覧
まだ、コメントがありません