WordPressで記事を読むのにかかる所要時間を表示させる方法1

20161007_01
Pocket

WordPressで書いた記事を読むのにかかる所要時間を表示させることができると、読みに来てくれた方に親切で、すぐに読めるならと記事をしっかりと読んでくれることも多くなると思われます。今回はその実装を行ってみた方法となります。



 

記事を読むのにかかる所要時間を表示させる意味とは?

AppleのフロントエンドエンジニアのBrian Crayさんという方が、なんとかしてサイトの滞在時間を延ばせないかと試行錯誤した結果「記事の冒頭に読むための所要時間を表示させておけばいいのでは?」と思いつき簡単なPHPコードを書いてそれを検証した結果として13.8%ほどサイトの滞在時間をのばすことができたとのことです。
 
また、これは想定はされていなかったようですがTwitterやRSSの登録、RTが67%も増えたとのことです。記事をよく読んでもらえるようになったことの副産物ですね!
 
実際のところ、数分程度で読めるなら読んでみようかな?と思う方もそれなりにいるのではないかと思います。TONOSTでも実装してみることにしました。
 

記事を読むのにかかる所要時間を表示させる実装方法

記事を見たときに目に入りやすいように記事の上の部分に表示させます。テーマによって異なる場合がありますが、個別記事のコードは single.php に実装されるため、このファイルを編集します。

 

the_title() というテンプレートタグで記事のタイトルを表示しますので、このテンプレートタグがある下あたりに以下のコードを記述するといいでしょう。

 

<?php
$mycontent = $post->post_content;
$word = mb_strlen(strip_tags($mycontent));
$m = floor($word / 600)+1;
$est = ($m == 0 ? ” : $m) ;
?>
<div class="read-time"><span class="read-time-count">この記事は約 <b><?php echo $est; ?></b> 分で読めます。</span></div>

 

所要時間は、一般的に1分間でだいたい400~600文字読むことができると言われているため、600で割るように設定しています。調整する場合はこの数字を変えてください。

 

うまく実装ができず、自分が実装した方法

簡単に実装できるかと思いましたが、自分の使用しているテーマの場合はうまくいきませんでした。the_title() というテンプレートタグなどは見られず、ちょうどよさそうな場所に記述してみても表示されず、コードの内容をよく確認してみることにしました。

 

<?php
while ( have_posts() ) : the_post();
	get_template_part( 'content', 'single' );

 

よくコードを確認してみるとget_template_part()というテンプレートタグが使われてました。このテンプレートタグは指定したファイルを読み込むものであり、content-single.phpを読み込むという意味合いであったため、content-single.phpの内容を確認しました。

 

<header class="entry-header">
~ 途中の記述は省略します ~
</header>

 

上記のように記事のヘッダの記述がありましたのでその下にコードを実装して表示することができました!

 

あとがき

今回はコードを実装して表示する方法を紹介しましたが、コード修正が難しいという方向けに「estimated」というプラグインを用いても記事を読む所要時間を表示させることができるようです。
 
 



Pocket

コメントを残す

メールアドレスが公開されることはありません。