WordPress Related Posts は、アクセスアップを図るためのWordPress用プラグインです。関連記事を自動的に抜粋して表示したり、記事を選んで関連記事として表示できる。
類似するSTORK装備のプラグインと比較しながら、それぞれの特徴を解説。STORKに合わせた独自のカスタマイズも公開します。
Contents
プラグインの特徴
記事下に関連記事の画像リンク集を置くことで、PV数を稼いだり、ブログの滞在時間を増やしたりします。そうして直帰率を最小限に抑えることを目的としたプラグインです。
STORKに装備された関連記事

Yet Another Related Posts Plugin というプラグインを使ってデザインされたものがSTORKには装備されています。プラグインを有効化して記事を一定数追加すれば自動的に表示する。
しかし、関連する記事を特定の記事に指定することはできないので、別のプラグインを使わなければなりません。
WordPress Related Posts

WordPress Related Posts は、そうした問題を解決する特定記事を指定できるプラグインです。各記事にそれぞれ特定記事の指定が可能で、指定がなくとも自動的に記事を抜粋する。
機能を追加することに加え、なるべくSTORKのデザインに近いものにカスタマイズします。
プラグインの効果
特定の記事を記事下に置くことで、目的を持った誘導が可能となります。
例えば‥
- トレンド新着への誘導
- 興味を持たせたい無関連記事への誘導
- 新着アフィリエイトへの誘導
- 悩み系の記事からアフィリエイトへの誘導
様々な意図する理由によって誘導することでPV数を稼いだり、アフィリエイト報酬を得たりすることが期待できます。
そうしたプラグインの効果を最大に活かすのに、標準のデザインではかえって不自然。できればSTORKのようなデザインに揃えたいと思いました。
そのため一部は非表示ですが、CSSでできる限りSTORKに近いデザインにカスタマイズしてみました。今回の設定内容は、そんなSTORK的なカスタマイズの設定になります。
カスタマイズの設定

まずはプラグインの確認から

このプラグインのインストールとプラグインが有効化になっている必要があります。設定はそれから、まずはプラグインの確認をしよう。
プラグインリストの確認

サイドバーからプラグイン
インストール済みプラグイン
❶ リストにプラグインを確認
❷ 停止になっているのを確認
もし停止ではなく有効化だったらプラグインは停止状態なのでプラグインを有効化にします。
有効化 停止になったらOKプラグインは有効化されました


プラグインを新たに追加したいとき
下記の手順でプラグインをインストールする必要があります。プラグインのインストール方法を詳しく確認したいときは、下記の関連記事からプラグインインストール方法を確認下さい。
❶ サイドバーからプラグイン 新規追加
❷ プラグインのインストールと有効化
カスタマイズの設定手順
❶ プラグインの設定に移動

サイドバーより設定
WordPress Related Posts
❷ プラグインの設定

1 |
<span class="gf rf">Related Posts</span> 関連記事はこちらです。 |
❶ ペースト
❷ 「 4 」を入力
❸ ▼マーク
❸ Advanced settingsの設定

❶ 外す
❷ Enable custom css
下記のコードをコピー❸ ペースト
❹ Use Custom Size Thumbnails
❺ width「300」height「200」
❻ Save changes

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 |
.related_post_title { clear: both; padding: 0 !important; margin: 0.7em 0 !important; border: 0 !important; font-size: 12px !important; } ul.related_post {} ul.related_post li { display: inline-block; width: 24%; min-height: 225px; font-size: .76em; font-weight: bold; margin: 0 1% 1% 0; padding: 0; } @media only screen and (max-width: 480px){ ul.related_post li { width: 47%; min-height: 210px; font-size: .78em; margin: 0 3% 1% 0; float: left; }} ul.related_post li a { position: relative; text-decoration: none; margin-bottom: 5px; color: #444 !important; overflow: hidden; vertical-align: top; zoom: 1; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; } ul.related_post li img { margin: 0; } .rf { position: relative; font-size: 21.6px; margin-right: 0.5em; bottom: -2px; } |
- CSSカスタマイズ
- 記事表示数4記事
- シスポンシブ対応
- カテゴリー非表示
- 閲覧数非表示
- 日付非表示
- SNS非表示
- 除外カテゴリーは無
- 関連記事位置変更は無
カスタマイズの内容にあえて非表示にしているものがいくつかありますが、表示することで文字の体裁が崩れたりSTORKとのデザインからかけ離れるのでこんな感じの設定にしました。
また、例外指定や関連記事の位置変更も可能なのである程度、運用しながらの対応でいいかと思います。
初期の画面には、サムネイルのパターンを選ぶ画像がまず目に入ってきます。その設定内容は、❶のチェックを外すと非表示になる。
これは、このプラグインが用意したパターンでカスタマイズするのではなく、独自のCSSでカスタマイズするのでパターンは不要。
問題なく表示が確認できたら、サイトの関連記事を特定記事に置き換えて見てください。その手順はプラグインの使い方で解説します。
プラグインの使い方
特定記事の設定は、WordPress の設定画面でするのではなく、サイトの中で直接設定をします。まずは設定したい記事を表示して関連記事まで進んでください。
関連記事に特定記事の設定する方法

クリックしてね
ドラッグだよ
❶ サイト内の関連記事に移動

❷ 特定記事の設定

❶ 特定したい記事を選択
❷ 表示させたい位置に移動
❸ Save and Close

特定記事を設定する画面は、とてもわかりやすく下に表示された記事を好きなところにドラッグするだけです。記事の量が多い場合でも検索を使って見つけらるのでとても便利です。
次は、本来の目的である記事を意図的に繋げて誘導する。ただ自動化に任せているのではなく訪問者からの視点で考えるきっかけにはなるのでないかと思います。
アフィリエイト付きの記事だけではなく、古い記事でも伝えたいものや忘れたくないことなどをピックアップして特定記事にチョイスすれば埋もれることはない。
そうした意図がしっかりと反映して結果に繋がればいいですね。
このプラグインの設定は、WordPress用テーマ STORK を使用。テーマのCSSに合わせて不要なコードをなるべく削除しています。
それによってSTORKのテーマ以外では、うまく表示されないかもしれません。その場合CSSの調整が別途必要とになります。
さいごに
今回のプラグインは、「デザインにこだわってカスタマイズする」というテーマで記事を作成しました。でもカスタマイズはこれだけでなくまだ他にもあります。
- アイキャッチ画像がない場合の設定
- 表示を除外するカテゴリーの設定
- 関連記事を表示する場所の設定
最後の表示位置の設定は、高度なPHPを使ってカスタマイズしますが、慣れないうちはオススメしません。それに今回のカスタマイズによって最低限必要な設定は完了すると思います。
ただプラグインを導入しただけでその効果がPV数に反映されるものではなく、上がるように細工するという感じ。なので一連の設定が完了したら各ページに合う記事を選定します。
その選定には、それぞれのページビューを調べた上で選定する人もいるくらいなので、その効果が期待できるのは間違いないですが、なんでもかんでもってワケにいかない。
あくまで訪問者の意図に合うような記事でないとPV数は期待できないので、やはり効果を図る意味でもデータによって確認する必要はありそうです。
要は、「コンビニのレジの横に置かれた、つい買ってしまう駄菓子みたいなもの」その駄菓子を決めるというワケですね。
どんな駄菓子が売れるかなぁぁぁ 楽しみだぁ
このマークを見かけたら
クリックしてね