【Simplicity2】WordPress Related Postsで好きな場所に関連記事を!

RelatedPosts WordPress・PC

関連記事を設置することによって、ついでに気になる記事にも目がとまり、もう1本あるいはもう2本とより多くの記事を読んでもらえる可能性が高まります。

 

WordPressのテーマには、もともと関連記事を表示させる機能が付いているものもあります。

無料テーマで人気の高い『Simplicity2』にもその機能は付いています。

 

もっとも、Simplicity2の関連記事をサムネイル画像と記事タイトルのみにカスタマイズしようとしたところ、タイトルの一部が見切れてしまうなど、きれいに表示できないという問題が出てきました。

 

CSSをいじれば解決するかもしれませんが、より簡単により精度の高い関連記事を表示させるために、『WordPress Related Posts』というプラグインで解決しようと思います。

 

それでは、WordPress Related Postsの導入、設定、使い方、好きな場所への表示方法(Simplicity2の場合)をご紹介していきます。

 

スポンサーリンク

WordPress Related Postsの導入(インストール)方法

ダッシュボードから「プラグイン」→「新規追加」をクリックします。

下の画面のように、検索窓で「WordPress Related Posts」と入力し検索し、「今すぐインストール」をクリックします。

インストール

次に、「有効化」をクリックします。

有効化

これでWordPress Related Postsの導入は完了です。

 

WordPress Related Postsの設定

ダッシュボードの「設定」→「WordPress Related Posts」を選択すると、次の画面が表示されます。

なお、Advanced Settingの画面は最初は閉じられていますので、下向きの▼を上向きの▲にすると詳細な画面が出てきます。

管理画面

 

もう少し詳しく個別にみていきましょう。

E-mail

 

E-mail
 入力すると、お知らせなどを受け取ることができますが、空欄で構いません。

 

基本設定

関連記事タイトル、数

Related Posts Title
 「関連記事」、「あなたにおすすめの記事」、「一緒にこんな記事も読まれています」などの任意のタイトルを付けます。目を引くようなタイトルがいいですね。

 

Number of Posts
 表示させる関連記事数を入力します。6、8、10あたりの偶数がおすすめです。

 

詳細設定

応用設定

 

 icon-check-square-o Enable Themes
 もともとチェックが入っていますので、そのままでOKです。チェックを外すと、レイアウトが利用できませんので外さないようにしてください。

 

Layout
 8種類から選択できます。上から順に、サンプルとともに見ていきましょう。

レイアウト1,2

レイアウト3,4

レイアウト5,6

レイアウト7,8

 

カスタマイズ設定

カスタマイズ

 icon-check-square-o Display Thumbnails For Related Posts
 関連記事にサムネイル画像を表示するか 
 ➡チェックを入れる

□ Display Number of Comments
 コメント数を表示するか
 ➡チェックは入れない

□ Display Publish Date
 記事の投稿日を表示するか
 ➡チェックは入れない

□ Display Post Excerpt 200 Maximum Number of Characters.
 記事の抜粋を表示するか(文字数は選択可)
 ➡チェックは入れない

□ Display Post Categories
 記事のカテゴリーを表示するか
 ➡チェックは入れない

□ Enable custom CSS
 CSSをカスタムするか
 ➡チェックは入れない

 

サムネイル画像

デフォルトサムネイル画像とサムネイル画像のサイズ

サムネイル画像が設定されていない場合の画像を設定する項目ですが、基本的にはそれぞれの記事にサムネイル画像は設定しておきましょう。

ここは特にチェックする必要はありません。

 

その他の設定

その他の設定

Exclude these Categories
 除外するカテゴリーを選択します。関連記事に関係のないカテゴリーにチェックを入れることでそのカテゴリー内の記事は表示されません。特に除外指定がなければ、チェックは入れないでおきましょう。

 

 icon-check-square-o Auto Insert Related Posts
 チェックを入れると、関連記事が自動的に挿入されます。基本的に記事の下に挿入されるようです。もっとも、アドセンスを貼っている場合など、任意の場所に関連記事を表示させたい場合は、チェックを外してください。Simplicity2でのやり方については後述します。

 

Display Related Posts in Feed
 RSSフィードに関連記事を表示したい場合は、チェックを入れてください。

 

Support us (show our minimized logo)
 プラグイン作者のロゴを表示するか
 ➡チェックは入れない

 

保存

保存

最後に忘れず保存をしましょう。

 

応用編

好きな場所に表示させる方法(Simplicity2編)

まず、その他の設定で「Auto Insert Related Posts」(自動挿入)のチェックを外しておきましょう。

任意の場所に挿入

基本的には、上記のPHPコード「<?php wp_related_posts()?>」をsingle.phpファイルの表示させたい場所に書き込むことによって、好きな場所に表示させることができます。

 

ただし、Simplicity2の場合は、この方法によらず、『PHP Code Widget』というプラグインを使います。

※PHPコードを使うため、普通のテキストウィジェットでは表示されません。

 

『PHP Code Widget』をインストールし、有効化します。

PHPプラグイン

[外観]→[ウィジェット]で確認すると、以下のようになります。

ウィジェット

これを表示させたい場所にドラッグしていきます。

今回は、「投稿SNSボタン下」に関連記事を表示させることとします。

タイトルを付けて、PHPコードをコピペし、保存をクリックします。

これで、投稿SNSボタンの下に関連記事が表示されるようになりました。

 

関連記事を手動で選択する方法

WordPress Related Postsは基本的には関連付けられたカテゴリー内の記事を表示する仕組みのようですが、見つからない場合は別のカテゴリーから引っ張ってきます。ですので、直接の関連性が薄い場合もあります。

そういった場合は、関連記事から外したり、逆に自動的には抽出されなかった記事を手動で関連記事としてアップすることもできます。

手動アップ

このオレンジ色の「Edit Related Posts」は管理者にしか表示されません。

手動アップ&ダウン

下段の一覧から表示させたい関連記事を上段へドラッグします。

逆に関連記事から外したい記事は、下段へドラッグします。

 

まとめ

WordPress Related Postsの設定方法や使い方をご紹介しましたが、簡単に使えるところがいいですね。

また、手動でも設定できるのはありがたい機能です。

 

お好みのレイアウトをいろいろ試してみると面白いと思います。

 

タイトルとURLをコピーしました