Loading…

記事内にプロモーションが含まれています。

WordPress カスタマイズ 伝えたいこと 備忘録

記事の閲覧時間や所要時間の目安を表示する方法(今は需要ないかも…。)

所要時間表示閲覧時間表示

所要時間目安:2

This session is using  IPv4  is established in

この記事は2017年1月15日のものです。現在は状況が異なる可能性がありますのでご注意ください。

WordPress カスタマイズ 伝えたいこと 備忘録

  • 本日
  • 週間
  • 月間
  1. パナソニックカオスバッテリーS-115

    エクストレイルT32おすすめバッテリーPanasonicカオスバッテリー 3PV

    すべての車でバッテリーが搭載されています。特にアイドリングストップ車以降現在主流になりつつある電気自動車などではバッテリーの性能がとても重要になってきます。今回は日産エクストレイルT32においておすす…

    もっと読む

  2. キーシリンダー

    TOYOTAキーレスリモコンの設定方法とキーナンバー(キー番号) 2PV

    この度は(今回は?)、プラスチックの経年劣化により車のキーレスリモコンキーの送信機側(トランスミッター)のみをなくしてしまった場合です。(まだスマートキーやインテリジェンスキーと言われる前のキーレスリ…

    もっと読む

  3. ヘッドライトクリーニングにダイソーアルカリ電解水で黄ばみクスミが綺麗に 1PV

    ヘッドライトは経年劣化で黄ばんできてしまいます。特にここ10年くらいの車のヘッドライトはプラスチック製のヘッドライトカバーになってきています。昔のようにガラスではありませんので、より経年劣化が目立って…

    もっと読む

  1. パナソニックカオスバッテリーS-115

    エクストレイルT32おすすめバッテリーPanasonicカオスバッテリー 3PV

    すべての車でバッテリーが搭載されています。特にアイドリングストップ車以降現在主流になりつつある電気自動車などではバッテリーの性能がとても重要になってきます。今回は日産エクストレイルT32においておすす…

    もっと読む

  2. キーシリンダー

    TOYOTAキーレスリモコンの設定方法とキーナンバー(キー番号) 2PV

    この度は(今回は?)、プラスチックの経年劣化により車のキーレスリモコンキーの送信機側(トランスミッター)のみをなくしてしまった場合です。(まだスマートキーやインテリジェンスキーと言われる前のキーレスリ…

    もっと読む

  3. ヘッドライトクリーニングにダイソーアルカリ電解水で黄ばみクスミが綺麗に 1PV

    ヘッドライトは経年劣化で黄ばんできてしまいます。特にここ10年くらいの車のヘッドライトはプラスチック製のヘッドライトカバーになってきています。昔のようにガラスではありませんので、より経年劣化が目立って…

    もっと読む

  1. パナソニックカオスバッテリーS-115

    エクストレイルT32おすすめバッテリーPanasonicカオスバッテリー 3PV

    すべての車でバッテリーが搭載されています。特にアイドリングストップ車以降現在主流になりつつある電気自動車などではバッテリーの性能がとても重要になってきます。今回は日産エクストレイルT32においておすす…

    もっと読む

  2. キーシリンダー

    TOYOTAキーレスリモコンの設定方法とキーナンバー(キー番号) 2PV

    この度は(今回は?)、プラスチックの経年劣化により車のキーレスリモコンキーの送信機側(トランスミッター)のみをなくしてしまった場合です。(まだスマートキーやインテリジェンスキーと言われる前のキーレスリ…

    もっと読む

  3. ヘッドライトクリーニングにダイソーアルカリ電解水で黄ばみクスミが綺麗に 1PV

    ヘッドライトは経年劣化で黄ばんできてしまいます。特にここ10年くらいの車のヘッドライトはプラスチック製のヘッドライトカバーになってきています。昔のようにガラスではありませんので、より経年劣化が目立って…

    もっと読む

目次に行く・戻る

メルカリ招待コード:

以前は結構流行っていた「この記事は何分で読めます。」という閲覧所要時間表示と言うものがあります。

ユーザビリティの為に概ねの記事の文字数で「何分何秒」と表示させていたアレです。

しかし、最近ではそのナリをひそめてしまっている気がします。

アドセンス336pxPC閲覧記事下表示1つ目コード


この記事を読む方へのオススメ


忘れない内に記事の閲覧所要時間(所要時間)を表示させる方法を残しておきたいと思います。

結構、簡単と言えば簡単なのですが…。

前提条件として、

人によって読む速度が異なりますので、600文字を1分程度かかって読むという計算式にての閲覧所要時間表示方法になります。

ということは…。

閲覧所要時間を算出するコードについてのロジックは単純で、
記事の文字数と読む速度(文字/分)から算出しています。

読む速度は、ざっとこんなもんだろうということで、600(文字/分)としています。読む速度は個人差がありますし、読む速度に影響するパラメータは他にもあるのですが、あくまで概算値の提供が目的なので複雑なことはしていません。

 

具体的にな方法です。

以下のコードをテンプレート.php内に追記します。

 

<?php
 $numchar = mb_strlen( strip_tags($post-> post_content), "UTF-8");
 $readtime = ceil($numchar/600);
 echo $readtime;
 ?>

 

この上記内にある600という数値を任意に変えることで、
上記の計算式は変更可能なので500にしたのであれば1分間に500文字の読むスピードにての閲覧時間表示(閲覧所要時間表示)になります。

 

※あまりにも長い閲覧所要時間が表示されると、( ̄◇ ̄;)エッそんなにかかっっちゃうの?とも思われ兼ねないので数値は適当に設定してみるのも良いかもしれませんね。

 

閲覧時間表示(閲覧所要時間表示)させたい任意部分(位置)に以下のコードを記載(追記)します。

 

<p class="meta_read_time">
 閲覧所要時間: 約
 <span class="ft14px">
 <?php
 $numchar = mb_strlen( strip_tags($post-> post_content), "UTF-8");
 $readtime = ceil($numchar/600);
 echo $readtime;
 ?>
 </span>
 分
 </p>

 

これで以下のような感じで表示されるようになります。

「閲覧所要時間: 約XX分」

と表示するコードです。

 

最後にCSSにて整形します。

 

p.meta_read_time {
 font-size: 12px;
 }

 .ft14px {
 font-size: 14px;
 font-weight: bold;
 }

 

上記CSSはフォントサイズをboldによって強調していますが、
今現在では通常表示程度の少し小さめのフォントサイズとboldによる強調は必要ないかもしれませんね。

=通常の大きさのみで充分かもれませんね。

まとめ

今はナリをひそめている所要時間表示(閲覧時間表示)ですが、

今後また流行る?かも?しれませんので備忘録として一応残しておきました。

また、
今でももしかしたら需要があるのかもしれないと思いつつ記事にさせて頂きました。

ちょっとだけブログなどのエッセンスにいかがでしょうか?

表示例)

CSSでいろいろなデザインにすることは可能ですが、

上記のCSSですと無難な感じですが以下のようにも・・・・・・。

閲覧所要時間表示例

 

デザインはいろいろと試してみて自分で納得のいく感じのものに仕上げてみてください!!

あなたにおすすめな関連記事

テレビの映像が乱れる可能性があります。

伝えたいこと 時事ネタ

700MHz利用推進協会からテレビの映像が乱れる可能性があります

先月末くらいだったでしょうか…。ポストにタイトルにありますように「テレビの映像が乱れる可能性があります。」って大きく書かれているチラシが入っていました。要は、これまで携帯電話(スマホ)で利用していた8…

もっと読む

インフィード広告アドセンス

Feedlyボタン

AFFINGER4Pro PC SNS STINGER PLUS+ Stinger6 Stinger7 WordPress カスタマイズ カスタマイズ ツール ブラウザChrome 伝えたいこと 備忘録 設定

Feedlyボタン最新作成方法2018年版とエラー対処・解決方法

Feedlyは、Googleリーダーがサービスを終了してから言わずと知れたRSSリーダーかと思われます。そのRSSリーダーの記事内下部などによく設置されているfeedlyボタンを押すと自分のサイトをf…

もっと読む

インフィード広告アドセンス

テレビリモコンHUIS REMOTE CONTROLLERリモコンカスタマイズ

ツール 伝えたいこと 備忘録 時事ネタ

テレビリモコンが壊れたり無くしたり見つからない場合HUISで対処方法

テレビリモコンって、意外とというか結構な確率で見つからないことってありますよね。そんなことで何度か夫婦ゲンカになったり、家族ゲンカになったり、兄弟ゲンカになったりと責任のなすりつけ合いになってしまうこ…

もっと読む

インフィード広告アドセンス

関連記事内にインフィード広告挿入画像

AdSense AFFINGER4Pro STINGER PLUS+ Stinger6 Stinger7 WordPress カスタマイズ 伝えたいこと 備忘録

関連記事内(途中)にインフィード広告を入れる挿入方法

先月いや先々月の7月初旬頃かと思います。Google Adsenseにおいて、 インフィード広告や 関連コンテンツ内広告 そして記事内広告 の3つが追加されてこれまでよりより使いやすくなりました。 (…

もっと読む

インフィード広告アドセンス

間違いメールと迷惑メールとフィッシング詐欺メール判断方法

LINE インターネット セキュリティ 伝えたいこと 備忘録 時事ネタ

クリス松村さん迷惑メールで個人情報流出疑惑抱く「1社登録したらその企業の釣りメール」

言わずもがなしれた方のクリス松村さんですが、一社にメールアドレスを登録した後にフィッシングメールが送信されてくるようになったとのこと。記事の内容には「釣りメール」とありますが、調べてみるとフィッシング…

もっと読む

インフィード広告アドセンス

ブログ画像

PC Windows10 カスタマイズ 不具合 伝えたいこと 備忘録 設定

ブログランキングなんて関係ない書く楽しみと喜び悦びと嬉しさはお礼のコメント頂いた時…。

ブログはある意味趣味でもあり、続けている人にとっては日常のひとコマだと思われます。 苦痛やきついといった思いが(強すぎると)あると、なかなか続けられないものだと思います。本当に日課に自然となっているよ…

もっと読む

WordPress, カスタマイズ, 伝えたいこと, 備忘録」同じカテゴリーの記事一覧

おすすめの記事一部広告

お小遣い稼ぎにアンケート。

Multiplex 広告

おすすめ!!

世界中でNo.1のシャアを誇るAmazonでのお得なお買い物でお得をしよう!!ネット通販なので、もちろん24時間年中無休です。健康商品から食品、車カスタマイズ商品、大手家電メーカー商品やパソコンの自作サプライ商品、その他アマゾン・プライムでは映画やドラマなど多くの作品や番組を見ることができます。マスクなど衛生商品も今では必須アイテム。一番信用できて一番商品数の多いAmazonでの買い物が絶対にオススメ!!

おすすめ2

楽天による季節特集です。それぞれの季節ごとにお得なお買い物商品やお得な旅行商品、その他にもAmazon同様に国内最大の買い物ポータルサイトです。楽天をメインにお買い物されている方はポイントやSPUも貯まりさらにお得に!!楽天カードや宇佐美系列のガソリンスタンドでも楽天ポイントが今では貯まります。それらのポイントを貯めてお得にお買い物や旅行商品その他にもパソコンサプライや車カスタマイズ商品など楽天も充実しています。

Total259


アドセンス336pxPC閲覧記事下表示1つ目コード

目次に戻る

よろしかったらシェアよろしくお願いします。

-WordPress, カスタマイズ, 伝えたいこと, 備忘録

目次に戻る

目次に戻る


コメントを閉じる

comment

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

You may choose to prevent this website from aggregating and analyzing the actions you take here. Doing so will protect your privacy, but will also prevent the owner from learning from your actions and creating a better experience for you and other users.