WordPress popular posts「人気の記事」をサイドバーに表示

みなさん、こんにちは!!

管理人のピーディー( @PD_bloger ) です。

WordPressでメインサイドバーに「人気の記事」を表示させる方法を解説します。

デフォルト(特にストーク)だと他人のブログと差別化ができないです。見た目は大事

ブログに華が出るので、ぜひ取り入れてほしいです。

あわせて読みたい
「最新の投稿」「カテゴリー」などは別記事で紹介しています。こちらはプラグイン不要です。

詳細はこちら ⇒ 【ストークをカスタマイズ】メインサイドバーに最新の投稿、カテゴリーを追加 

スポンサーリンク

WordPress Popular Posts とは?

「最新の投稿」「カテゴリー」などはウィジェットから追加配置するだけで OK でした。

デフォルトでは「人気の記事」がウィジェット欄にないため、プラグインの設定が必要になります。

「WordPress Popular Posts」を有効にすると、ウィジェット欄で「人気の記事」を配置できるようにできます。

まずは、プラグインを探しましょう。

これを有効化しましょう。では、設定に入っていきます。

ダッシュボード画面の左「プラグイン」から「WordPress Popular Posts」の設定ボタンを押します。

設定のトップに「ツール」があるので選択してください。

主に変更する点は、データ欄の「閲覧を記録する対象者」です。

訪問者のみ」に設定しておきましょう。

※ 全員にしておくと、人気記事の計測が「自分」も含まれてしまいます(記事更新しまくれば、自分で記事のランク操作できるw)。それでも良いなら全員で。

ウィジェットの追加

「外観」から「ウィジェット」を選択します。

あたらしく「WordPress Popular Posts」という項目が増えています。クリックするとメニューが表示されます。

メインサイドバーに追加しましょう。

「PC:メインサイドバー」に「WordPress Popular posts:人気の記事」が加わりました。

また、ここで数点だけ設定があります。「▼」をクリックしてください。

● タイトル・・・自由に名称を変更できます。

● 最大表示数・・・10件という制約はないです。5件でも20件でも表示させたい数を入力できます。基本は10かな。

● ソート順・・・コメント数、1日の平均、総閲覧数を選択できます。

● フィルター・・・計測期間です。これは大事かも。どの期間の記事ランキングを表示させたいのかを考慮するとよいです。

※ 記事の計測は設定した日から始まるので、これまでの数はノーカウントです。

すこし、とばして、、

● 投稿設定・・・タイトルだけではなく、できればアイキャッチ画像はほしいですね。

● サイズ・・・のちほど解説しますので、上図の設定してください。

● 統計タグの設定・・・「人気の記事」ランキング以外に、追加で「コメント数」「何人読んだ」「日付」など表示できます。好みですが、ごちゃごちゃするので、いらないと思います。

表示サイズを調整する

現時点のままだと、別途設定した「最新の投稿」などのサムネイルのサイズと統一できていない状態で、ランキング記事のサムネイルが大きく表示されるはずです。

「WordPress Popular posts」のサイズ調整に特化した CSS を追加することで改善できます。

テーマのデザイン変更をするときは「子テーマ」の設定を忘れずに。

詳細はこちら ⇒ WordPress にストークをインストール・初期設定【2018年版】

外観からカスタマイズ画面を出します。

カスタマイズのメニュー欄の一番下に「追加 CSS」があるので選択します。

/*WordPress Popular Posts*/
.wpp-thumbnail{margin:0 0.5em 0 0 !important;width:30%;max-width:100px;}
ul.wpp-list li{border-bottom:1px dotted rgba(125,125,125,0.2);margin:1em 0;}
ul.wpp-list li:last-child{border-bottom:none;}

上記コードを「追加 CSS」内にコピー貼り付けしてください。

設定は以上で終わりです。

ここまでお読みいただきありがとうございました。