【コピペでOK】「WPP Plus Widget」でVIEW回数を表示する方法とは

2020年3月20日

この記事を読むことによって「WPP Plus Widget」でVIEW数(表示回数)を表示させ、読者に人気記事がどれだけの人に読まれているかを伝えることが出来るようになります。

こんにちは！読者の方のコメントでやりがいをいただいております、うみにん(@11tejun)です。

いつもコメントの投稿をしてくださり、ありがとうございます！

今までは生活、うさぎ、子育てに関する情報発信をしてまいりましたが、今回、Wordpressのカスタマイズについても情報発信を行います。

さて、あなたはインターネット上のブログを開いた時、サイドバーもしくは記事内に「表示回数が多い記事はこれ！」という記載があった場合、そのページに飛びますか？飛びませんか？

おそらく、多くの方が「とりあえず中身を見てみる（飛ぶ）」のではないでしょうか。

人気記事を表示することはブログ運営者、そしてサイトを訪れた人にとっても大事な指標になるのです。

人気記事を表示するプラグインは様々存在しますが、よく利用されているのが「WPP Plus Widget」です。

しかし、どの説明サイトを見ても「VIEW数(表示回数)を表示する方法の説明が無い」のが現状です。

そこで今回、「WPP Plus Widget」を利用して、VIEW数(表示回数)を表示するカスタマイズ方法を書いていこうと思います。

記事の見出し

1 本日の目標イメージ図
2 「WPP Plus Widget」とは
3 「view」コードを入力するだけでVIEW数が出現！
4 CSSで目立つように着色
5 「まとめ」と「お願い（教えて下さい！）」
6 シェアをお願いします！(*^^*)

本日の目標イメージ図

具体的な目標は上記図の通りです。

通常であれば、サムネイル画像とタイトルが表示されるところを、VIEW合計数も同時に表示しちゃおうではないか！という企画です。

確かに具体的な数字がある方が、その記事を見たくなる衝動にかられますね。

「WPP Plus Widget」とは

「WPP Plus Widget」とは、functions.phpや特殊なphpコードを使わずとも、カテゴリごとに人気記事をウィジェットでサイドバーに表示する事ができるプラグインです。

必ず知っておくべき知識は2点。

①このプラグインは、WordPress Popular Postsという人気記事表示プラグインが作成したデータを整形する形なので、WordPress Popular Postsのインストールも別途必要です。

②WPP Plus Widgetは公式プラグインではないので、[Wordpressの管理画面]⇒[プラグイン]⇒検索という流れではインストール出来ない。

さて、この前提知識を持った上で、「WPP Plus Widget」を全く導入されていない方はまず、以下のちゅんこ様のページより導入をお願いします。

人気記事を表示できるWordPressにプラグイン【WordPress Popular Posts】をご利用されている方、多いと思います。【WPP Plus Widget】は【Wo ... more

shufulife.com

「view」コードを入力するだけでVIEW数が出現！

さて「WPP Plus Widget」の導入が完了したら、お待ちかねのView表示です！＼(^o^)／

気になる方法ですが、結論から言うと「view」というコードを入力するだけです。

具体的な方法を説明していきましょう。

[外観]⇒[ウィジェット]⇒(ご自身で作成された)[WPP Plus Widget]を選択します。

その中の、「記事フォーマット」部分に以下のコードを入力してください。

<li>{thumb} {title}<br><a class ="view">{views} views</a></li>

たったこれだけで、記事にVIEW数が表示されるようになります。

補足

{thumb}はサムネイル画像を表示するタグです。
{title}はタイトル名を表示するタグです。
この後ろに<br><a class ="view">{views} views</a>を入れています。

<br>は単純にタイトルの次の行(改行)でVIEW数を表示するためです。
{views} はVIEW数を表示するタグです。
viewは言葉として出すためです。もしXXXXX回としたい場合は「{views} 回」と記載しましょう。

そしてこのVIEW部分をCSSで着色したいので<a>で囲っているのです。

CSSで目立つように着色

さて、無事にVIEW数が表示できたところで、着色をしていきましょう。これもコピペで実現可能ですよ。

[外観]⇒[テーマの編集]⇒[style.css]を選択します。

ここに以下をコピペで保存してください。

/* ------------View数表示_STRAT------------ */
.view{ font-size: 13px; font-weight: bold; color:#ff0000; background-color:#ffb6c1; } /
* ------------View数表示_END------------ */

次のように着色されたら無事完了です！お疲れ様でした！

「まとめ」と「お願い（教えて下さい！）」

さて、無事にVIEW回数は表示されましたか。

出来る限り分かりやすく書いたつもりですが、難しい部分あれば気軽に声をかけてくださいね！

簡単に纏めますが、「WPP Plus Widget」でVIEW回数を表示する方法は{view}というタグを入れるだけです。

とても簡単な方法ですので、是非皆さんも試してみてください！

そして、１点お願いです！私にソースコードをブログ記事に貼るいい方法を教えて下さい。

SyntaxHighlighter Evolvedを試してみるも、ビジュアルエディタとテキストエディタを切り替えながら編集を行っているので、ソースコードが自動変換されてしまい、困っている状況です。

また、Crayon Syntax Highlighterも現在はダウンロードできない状況(プラグインからの検索に出てこない状況)です。

どなたか、これを解決する良い手段があれば教えて下さい！！

シェアをお願いします！(^^)

最後にお願いです！この記事が良かった場合は、周りの人へシェアをお願いします。

また、気軽にコメントをいただけると嬉しいです！引き続き楽しいブログ生活を楽しみましょう！