【桃農家でもできた!!】 THE THOR 記事のランキング表示設定

こんにちは、ももおやじ(@Oyaji_Momoです。

今回はTHE THORでの記事のランキング表示設定についてご説明します。

  • TOPページに記事のランキングを表示したい
  • 読者にオススメ記事を紹介したい
  • ランキング表示って何?

この記事はこんな方にオススメです。

簡単な設定なので読めばすぐに設定できますよ。

ランキング表示とは

ママ
ねぇねぇ
たまに記事のランキングを表示してるブログを見かけるけど、あれって私にもできるかな?

ももおやじ
こんなののこと?
ママ
そーそー!
こういうの!
どうやってやるの?
ももおやじ
これは簡単な設定で表示できるよ。
THE THORでは簡単な設定を行うことでTOPページに記事のランキングを表示させることができます。
どの記事が最も読まれているのかわかりやすく、読者に人気の記事を紹介することができます。
この他にもオススメ記事を紹介する方法としてピックアップ記事を表示させる方法があります。
こちらもぜひ設定してみてください。
関連記事

こんにちは、ももおやじ(@Oyaji_Momo)です。 今回はTHE THORでのピックアップ記事の表示設定についてご説明します。 オススメの記事を紹介したい 記事を目立たせたい ピックアップ記事って何? […]

それではランキング表示設定について詳しく説明していきますね。

ランキング表示設定

  1. 記事ランキング設定
  2. ランキング機能設定

Step1.記事ランキング設定

  1. WordPressの管理画面「外観」→「カスタマイズ」
  2. 「TOPページ設定【THE】」→記事ランキング設定
  3. 記事ランキング設定

WordPress管理画面「外観」→「カスタマイズ」

TOPページ設定【THE】→記事ランキング設定

記事ランキング設定

  1. 記事ランキングを表示するか選択
  2. ランキングの対象期間を選択
  3. 表示件数を指定(5〜10件)
  4. 表示条件を選択
  5. セクションの見出しを入力
  6. 見出しの左に表示するアイコンを入力
  7. 見出しの右に表示する補足情報を入力
  8. 画像アスペクト比を選択
  9. カラー系マスク利用時の色を指定

①記事ランキングを表示するか選択

「表示する」を選択します。

②ランキングの対象期間を選択

「全期間ランキング(default)」「月ランキング」「週ランキング」「日ランキング」から選択できますが、今回は「全期間ランキング(default)」を選択します。

記事ランキングの対象期間を「全期間ランキング(default)」に選択した場合のみ、ランキング記事が1件しか表示されないという不具合が発生する可能性があります。
そのため対策方法についてに後ほど詳しく説明します。
これがランキング記事が1件しか表示されないという状態です。

それでは一旦先に進みましょう。

③表示件数を指定(5〜10件)

お好みの件数を指定します。

ここでは一旦「5件」と設定します。

④表示条件を選択

ここで条件を指定し、次の項目「指定するIDを入力」にIDを入力することで、ランキングに表示させる記事を絞り込むことができます。

ここでは一旦「無し(default)」と設定します。

⑤セクションの見出しを入力

これは必須項目なのでお好みの見出しを入力します。

僕の場合は「RANKING」と入力しています。

⑥見出しの左に表示するアイコンを入力

「アイコン一覧」を押すとアイコン一覧が表示されます。

この中から好きなアイコンを選択しコードをコピーし貼り付けます。

⑦見出し右に表示する補足情報を入力

お好みの補足情報を入力します。

僕の場合は「ランキング TOP5」と入力しています。

⑧画像アスペクト比を選択

ここでは一旦「16 : 9(default)」で問題ありません。

⑨カラー系マスク利用時の色を指定

お好みで設定しましょう。

これでランキングの表示設定は完了です。

次に不具合の対策を行います。

Step2.ランキング機能設定

  1. WordPressの管理画面「外観」→「カスタマイズ」
  2. 基本設定【THE】→アクセスランキングの設定
  3. ランキング機能の設定
  4. 表示確認

ここでは「ランキングの対象期間を選択」で「全期間ランキング(default)」を選択した場合に発生する「記事が1件しか表示されない」という不具合の対策を行います。

WordPressの管理画面「外観」→「カスタマイズ」

基本設定【THE】→アクセスランキングの設定

ランキング機能の設定

  1. ランキングの集計機能を有効にする
  2. リアルタイムで集計を行う

①ランキングの集計機能を有効にする

こちらをチェックします。

②リアルタイム集計で行う

こちらをチェックします。

これで設定は完了なので「公開」を押します。

④表示確認

TOPページを確認し、記事ランキングが表示されているか確認しましょう。

「リアルタイムで集計を行う」をチェックするとページの表示速度が遅くなる可能性があるようですが、今のところ僕は遅いと感じたことはありません。

どうしても気になるようであればPageSpeed Insightsで表示速度を調べたり、「リアルタイムで集計を行う」のチェックを外し「ランキングの対象期間を選択」で「全期間ランキング(default)」以外を選択しても良いと思います。

最後に

今回は記事のランキング表示設定についてお話ししました。

TOPページに設定することで読者に人気の記事を紹介することができます。

ぜひ設定してみましょう。

ももおやじ
最後まで読んでいただきありがとうございました。
ももおやじをチェック!!