関連記事表示プラグインWordPress Related Postsの使い方と位置の設定

PVを上げたい、ブログ滞在時間を伸ばしたい、ブログ直帰率を減らしたい、と考えているなら関連記事表示プラグインは必須です。

そして、関連記事を表示させるならWordPress Related PostsというWordPressプラグインを最もおすすめします。

関連記事を表示させるプラグインはたくさんあるのですが、その中でもWordPress Related Postsは表示のバリエーションが豊かであったり、他のプラグインとの相性も良かったり、表示される関連記事の関連度合いが高かったりと、多くの点で優れていたのです。

今回はそんなWordPress Related Postsの使い方の解説として、導入方法や設定、また関連記事をお好みの位置に設置する方法について解説していきます。

ちなみにWordPressプラグインなどを紹介する際にいつも使用しているWordPressテーマの「Stinger5」では、プラグインを使用しなくとも最初から関連記事が表示される設定になっていますので、今回は「賢威6.2」を使用して解説していきます。

他のWordPressテーマでもやり方は基本的に変わりませんので、是非参考にしてみてください。

WordPress Related Postsの導入

まずはWordPress Related Postsをインストール、有効化していきましょう。

WordPressプラグインのインストール、有効化の具体的な流れは以下の記事で解説していますので、わからない方は参考にしながら進めてみてください。

WordPress Related Postsの設定

WordPress Related Postsをインストール、有効化するだけでも関連記事は表示されるのですが、せっかくいろいろな表示パターンがありますので、お好みのものを選択しましょう。

また、他の設定もしていきましょう。

まずはWordPress管理画面サイドメニューの「設定」→「WordPress Related Posts」と進みます。

2014-11-09_13h25_49

するとWordPress Related Postsの設定画面に移動します。

より詳しい設定をするために赤枠で囲っている三角矢印をクリックします。

2014-11-09_13h34_25

すると、以下のように詳しい設定をすることができるようになります。

それぞれ上から順番に見て行きましょう。

2014-11-09_13h35_22

Subscribe to news and activity reports

この部分にメールアドレスを記入し、「Subscribe」をクリックすることでWordPress Related Postsに関するお知らせをメールで受け取ることができます。

特に重要なものではありませんので、こちらは空欄にしておいても大丈夫です。

2014-11-09_13h44_56

Basic settings

2014-11-09_13h45_05

Relates Posts Title

関連記事を表示する部分の見出しを決めます。

「関連記事一覧」など、任意の言葉を入れておきましょう。

Number of Posts

いくつの関連記事を表示させるかを決めます。

お好きな数字を選択しましょう。

Themes

2014-11-09_13h45_42

最初の「Enable Themes」の部分にはチェックを入れておいてください。

Layout

この部分では関連記事のお好きな表示方法を選択できます。

全部で8種類ありますが、念の為すべて紹介しておきます。

 

Momma:

2014-11-09_13h46_52

Modern:

2014-11-09_13h47_02

Vertical (Large):

2014-11-09_13h47_11

Vertical (Medium):

2014-11-09_13h47_24

Vertical (Small):

2014-11-09_13h47_33

Pinterest Inspired:

2014-11-09_13h47_41

Two Columns:

2014-11-09_13h47_48

Plain (your own css):

2014-11-09_13h47_56

この中からお好きなものを選んでください。

Customize

2014-11-09_13h48_28

Display Thumbnails For Related Posts:

こちらにチェックを入れると、サムネイルを表示するかどうかを選択できます。

選択しておいたほうが見栄えが良くなるのでおすすめです。

Display Number of Comments:

こちらにチェックを入れると、記事のコメント数を表示することができます。

私はチェックを入れていません。

Display Publish Date:

こちらにチェックを入れると、記事を投稿した日付を表示することができます。

私はチェックを入れていません。

Display Post Excert ◯◯ Maximum Number of Characters.:

こちらにチェックを入れると、記事の抜粋分を「〇〇」の部分に入れた文字数分だけ表示することができます。

見栄えが悪くなるので、私はチェックを入れていません。

Enable custom CSS:

こちらにチェックを入れると、関連記事をカスタムすることができます。

少し上級者向けなので、わからない方はチェックを入れないでおきましょう。

Default thumbnails

こちらでは、記事にサムネイル画像(アイキャッチ)が設定されていない場合に、デフォルトで表示する画像を設定することができます。

また、チェックボックスにチェックを入れることで、カスタムフィールドからサムネイル画像を選択することができます。

Custom size thumbnails

こちらでは、表示するサムネイル画像のサイズを自由に変更することができます。

チェックを入れるとサイズを記入する空欄が出てきますので、サイズを変更したい場合に使用しましょう。

Other Settings

2014-11-09_13h50_30

Exclude these Categories

こちらでは関連記事に表示したくないカテゴリを選択できます。

除外したいカテゴリがありましたらチェックを入れましょう。

 

Auto Insert Related Posts (or add <?php wp_related_posts()?> to your single post template):

こちらにチェックを入れることで自動で関連記事が表示されます。

また、チェックを外して、表示されているコードを使用することで、お好きな所に関連記事を表示させることができます。

この方法についてはこの記事の下部で詳しく解説しています。

Display Related Posts in Feed:

こちらにチェックを入れることで、RSSフィードにも関連記事を表示させることができます。

しかし、WordPressテーマによっては表示されないこともあります。

Support us (show our minimized logo):

こちらにチェックを入れることで、「WordPress Related Posts」開発者の情報を表示するかを選択できます。

チェックしなくて大丈夫です。

 

すべての設定が完了しましたら「Save changes」をクリックして設定を保存しましょう。

2014-11-09_13h49_57

関連記事はこのように表示されます。

2014-11-09_14h32_14

関連記事表示位置の変更方法

最後に関連記事の表示位置の変更方法について詳しく解説していきます。

先ほどお見せした画像をもう一度お見せします。

2014-11-09_14h32_14

確かに関連記事は表示されているのですが、これだとソーシャルボタンが関連記事の下に表示されてしまうため、ソーシャルボタンがクリックされづらくなってしまいます。

今やソーシャルメディアでの拡散は重要になってきますので、この表示方法を改善することをおすすめします。

ここでは、関連記事をソーシャルボタンの下に持ってくる方法を解説していきますが、これから解説する方法を使用することでお好きな位置に関連記事を表示させることができますので、ぜひ参考にしてください。

 

まずは、「Other Settings」の「Auto insert Related Posts (or add <?php wp_related_posts()?> to your single post template)」のチェックを外します。

そして赤枠で囲った「<?php wp_related_posts()?>」の部分をコピーします。

そして設定を保存します。

2014-11-09_13h53_03

次はWordPress管理画面のサイドメニューから「外観」→「テーマ編集」へと進みます。

2014-11-09_13h54_02

そして「単一記事の投稿(single php)」を選択します。

2014-11-09_14h27_33

今回はソーシャルボタンの下に関連記事を表示させるので、ソーシャルボタンを示している「<?php get_template_part(‘social-button’); ?>」の下に先ほどコピーした関連記事を表示させるためのコードを以下のように貼り付けます。

そうしましたら設定を保存しましょう。

2014-11-09_14h30_11

実際に確認してみると…

このように関連記事がソーシャルボタンの下に表示されていますね。

2014-11-09_14h33_43

今回は関連記事をソーシャルボタンの下に持ってくる方法でしたが、「<?php wp_related_posts()?>」を好きな場所に貼り付けることで関連記事の表示位置を自由に決めることができますので、ぜひチャレンジしてみてください。

まとめ

長くなりましたが、今回は関連記事を表示するためのWordPressプラグイン「WordPress Related Posts」の使い方と、関連記事の位置を自由に設定する方法の解説でした。

WordPress Related Postsは、関連記事を表示するWordPressプラグインの中では今回解説したように高機能で自由が効きますのでぜひ使用してみてください。

メールマガジン登録





4 Responses to “関連記事表示プラグインWordPress Related Postsの使い方と位置の設定”

  1. やない より:

    こんにちは。
    すみませんが、ご質問があります。

    こちらのプラグイン、設定してみましたが、いまいち関連記事の精度が微妙です。

    similar posts+の方が、関連記事として、マッチするんです。

    wp_related_postsの方が、見栄えが良いので使いたいのですが、制度のカスタマイズ方法、ご存知ないでしょうか?

    宜しくお願い致します。

    • やないさん、こんにちは。

      申し訳ありませんが、
      精度を高める方法はちょっとわかりませんね。

      お役に立てず申し訳ありませんが
      ご了承いただければと思います。

  2. こぴごん より:

    はじめまして!
    関連記事の位置を変えたくて調べていましたが、なかなかやり方が分からず困っていたところ、こちらのブログにたどり着きました。

    説明が分かりやすかったですし、
    おかげで関連記事の位置を変えることが出来ました!
    ありがとうございました^^

コメントを残す

サブコンテンツ

このページの先頭へ