現在の接続環境は
です

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

プロモーションを含みます

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

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

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

所要時間目安：約2分

This session is using　 IPv4 　is established in

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

目次に行く･戻る

2025年4月25日 (金曜日)本日の人気記事トップ１０

カーメンテナンスWAKO'S

2025年4月25日 (金曜日)↓における週間月間人気記事トップ３は？↓

  • 本日
  • 週間
  • 月間
  1. Windows10アップグレードキャンセル方法

    Windows10アップグレードキャンセル方法をMicrosoft正式に公開 1PV

    マイクロソフト（Microsoft）によるWindows10へのアップグレード攻撃？と通知が無償アップグレード期間残すところ約2ヶ月となったところで、3月ころから勝手にWindows10になっていた（…

    もっと読む

  2. キッチンシンクからドブ臭い異臭原因解決方法

    キッチンシンク下がドブ臭い下水臭い原因と解決方法 1PV

    意外と知られていないのが、キッチンシンクからいつもと違う臭いや異臭や下水臭い強烈な匂いが出てくることがあります。いくらシンク内をカビキラーやキッチンハイターなどの塩素系漂白剤などできれいにしても・・・…

    もっと読む

  3. オカルトチューンと言われていたマグチューンを取り付け 1PV

    2000年代後半のガソリン価格の高騰時に数々の燃費向上グッズが発売されました。その中のひとつでもあるマグチューンMG-600が埋もれていたので、効果の程は定かではないものの自分の車もであるので試しに再…

    もっと読む

  1. カーナビテレビが見れなくなったICカードが正常に動作しませんでした

    ナビテレビが見れなくなった時ICカードが正常に動作しませんでした対処方法 28PV

    本日ではなく昨日になってしまいますが、それまでカーナビで地デジ対応のナビで突然エンジンをかけなおしたら・・・・・・。 「ICカードが正常に動作しませんでした。販売店にお問い合わせください。」 なんてい…

    もっと読む

  2. エクストレイルT32運転席側バイザーメッキモール剥がれ修復方法とオススメ両面テープ 23PV

    車の購入後、乗ろうが乗らまいが経年劣化というものは付きものなのですが、特にプラスチック部分や両面テープ部分などは経年劣化がどうしても起きてきてしまいます。 そんな車でも長めにお気に入りの愛車となれば長…

    もっと読む

  3. キーレスリモコン破損

    車のキーナンバー確認方法。キーレス紛失や壊れた時 22PV

    初めての経験でした。（汗）…。 キーレスエントリー、キーレスリモコンがついた鍵がエンジンを回す時にボキッと折れてしまいました。（汗）…。 プラスチックの本体部分と鉄のキー部分が分裂してしまいました。 …

    もっと読む

  1. カーナビテレビが見れなくなったICカードが正常に動作しませんでした

    ナビテレビが見れなくなった時ICカードが正常に動作しませんでした対処方法 28PV

    本日ではなく昨日になってしまいますが、それまでカーナビで地デジ対応のナビで突然エンジンをかけなおしたら・・・・・・。 「ICカードが正常に動作しませんでした。販売店にお問い合わせください。」 なんてい…

    もっと読む

  2. エクストレイルT32運転席側バイザーメッキモール剥がれ修復方法とオススメ両面テープ 23PV

    車の購入後、乗ろうが乗らまいが経年劣化というものは付きものなのですが、特にプラスチック部分や両面テープ部分などは経年劣化がどうしても起きてきてしまいます。 そんな車でも長めにお気に入りの愛車となれば長…

    もっと読む

  3. キーレスリモコン破損

    車のキーナンバー確認方法。キーレス紛失や壊れた時 22PV

    初めての経験でした。（汗）…。 キーレスエントリー、キーレスリモコンがついた鍵がエンジンを回す時にボキッと折れてしまいました。（汗）…。 プラスチックの本体部分と鉄のキー部分が分裂してしまいました。 …

    もっと読む

今日は2025年4月25日です。

メルカリ招待コード：

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

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

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

アドセンス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ですと無難な感じですが以下のようにも・・・・・・。

閲覧所要時間表示例

 

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

Windows10サポート終了まで

【AmazonタイムセールSALE車＆バイク】！


人気の商品が日替わりで登場。毎日お得なタイムセール「Amazonタイムセール全体」

出展：Amazonタイムセール

人気の商品が日替わりで登場。毎日お得なタイムセール

年金倍増で日本経済は大復活する!デフレの終わり、第二の「高度成長」の始まり
Amazon
＼楽天ポイント4倍セール！／
楽天市場
＼ポイント5%還元！／
Yahooショッピング
メルカリ

あなたが訪問してから

⏰ 0 秒経過 🎉

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

エクストレイルとハリアー

伝えたいこと 時事ネタ 車

エクストレイル20Xtt特別仕様車ハリアー最大値引きはいくらなのか

ハリアーもエクストレイルも今年の来月６月には、マイナーチェンジをむかえます。両者ともに値引率、値引きしてもらうには絶好の時期でもあります。 そこで、ハリアーとエクストレイルについてディーラーにて値引き…

もっと読む

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

行政画像

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

医療崩壊ばかりだが行政崩壊もあり得るのでは…。そうならない為に。

この新型コロナウイルス感染症によるある意味混乱下になり始めもうすぐ1年が経とうとしています。2020年4月に緊急事態宣言が発出され（首都圏や北海道などの一部エリアから始まり全国に拡大。）そしてまた同じ…

もっと読む

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

抗がん剤オプジーボとは小林麻央さん

伝えたいこと 備忘録 時事ネタ 治療

がん免疫治療薬オプジーボについて、小林麻央さんは使ってみたのかなぁ。厚生労働省は１６日５０％の緊急値下げを提案し了承

昨今話題のがん治療薬の化学療法である抗がん剤でオプジーボ（商品名です：一般名はニボルマブ）ですが、 あまりにも高額だということで厚生労働省が異例に半額：50%値下げに承認を出しました。これまでは100…

もっと読む

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

ネコ

WordPress

アイキャッチ画像を設定してみた。

よく言うアイキャッチ！！正直めんどくさいですよね。でも、訪問者やTwitter、Facebookなどにサムネイル表示される際に、自分のブログの記事にアイキャッチ（画像？）があると…。

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

Windows10資格取得情報の追加画像

PC Windows10 伝えたいこと 無線LANルーター 設定

Windows10でNASにつながらい解決方法SMB1.0設定でなく資格情報の追加

Windows10でNASに接続できなくなることがあります。その時に、よく2017年のWindows10のアップデートでSMB1.0がデフォルトで無効になったためと見ることがあります。たしかにSMB1…

もっと読む

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

YouTube

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

YouTube動画が重い時や遅い時に遅くならない簡単解決方法(続)

以前の記事にYouTubeの動画が重い時や遅い時に、ページの表示速度やサイト自体が重くなってしまわないようにする方法を記載しました。ですが、WordPressにおいてのショートコード化で動画IDのクイ…

もっと読む

「WordPress, カスタマイズ, 伝えたいこと, 備忘録」の人気記事

入学入社まであと…入学入社祝いはどんなPresent（プレゼント）でどのように過ごされますか？

ホワイトデープレゼントは以下などの豊富なキャンペーン商品から選ぶと良いと思います。

ブログサービスが始まってから:


カウントダウンタイマー

おすすめの記事一部広告


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

Multiplex 広告

Total521


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

目次に戻る

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

この記事タイトルとURLをコピー

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

目次に戻る

目次に戻る

コメントを閉じる

comment

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


This site uses Akismet to reduce spam. Learn how your comment data is processed.