当ブログの関連記事の表示には、「Yet Another Related Posts Plugin(YARPP)」を使っていました。

このプラグインも最高に使いやすく、特に問題は見当たらないなかったんですけど(強いて言うなら、おしゃれに表示するには結構なCSSの知識が必要)、多くのブロガーに利用されているMilliard関連ページプラグインがとにかくオシャレで簡単に導入でき、私の心を鷲づかみにしたので、導入してみることにしました。

今回は、Milliard関連ページプラグインの導入方法と使い方を書きたいと思います。

ちなみに、関連記事を表示すると、以下のような表示イメージになります。

Milliard-plugin-04

スポンサーリンク



Milliard関連ページプラグインのインストール方法

メニューの「プラグイン」「新規追加」からキーワードに「Milliard」と入力して検索し、「今すぐインストール」を押下します。インストールが完了したら有効化しましょう。

Milliard-plugin-01

 

Milliard関連ページプラグインの設定

設定は、「設定」メニューの中にある「Milliard関連ページ」から行います。

Milliard-plugin-03

 

私は、次のとおり設定しています。

設定項目は少なく、文字通りの設定内容なのでとても分かり易いです。

Milliard-plugin-05

では、一つ一つ説明していきます。

 

並び順

表示する記事を「関連度順」、「更新日時」、「ランダム」から選択することができます。

目的に応じて選択すると良いですね。

ちなみに、関連度順を選択しても、記事数が少ないとあまり関係ない記事も表示されてしまうようです。

私の場合、育児記事の関連記事として、下の内容が表示されました。

最初の方は子ども関係の記事が出てきて良い感じですが、近い内容の記事が尽きると、別カテゴリの記事でも表示されます。

Milliard-plugin-06

 

表示場所

フッターの下にチェックが入っていると、サイトのフッターの下に自動で関連記事が表示されます。

個人的に見栄えが今一つだったので、チェックを入れないようにしています。

 

ツール文字色

ツール文字とは、関連記事の下に表示される「by Milliard」のことです。

正直どんな色でも良かったので、デフォルトのままにしています。

お好みで設定ができます。

Milliard-plugin-07

 

固定で表示するページ

関連度や更新日時に関わらず、指定したページを固定で表示できるというものです。

これは使い方によっては非常に有効な機能ですね。

とりあえず私は空白にしていますが、めちゃめちゃお勧めしたい記事ができたら追加しようかなと思います。

 

デザインタイプ

PC、スマートフォン、タブレットなどのデバイス毎に表示方法を変更することができますが、必要が無いので、レスポンシブを選択しています。

 

PC/タブレット

記事幅が640px以上の場合、どのように関連記事を表示するか指定します。

私はパネル表示がお気に入りなので、パネル表示を選択しています。

パネルを選択した場合

以下のように表示されます。

スクロール付きで表示されるので、小スペースにたくさんの記事が表示されるのもgoodですね。

Milliard-plugin-04

 

リストを選択した場合

リストを選択すると、挿入箇所のスクロールを無効にするかどうかと、表示件数を指定できるようになります。

Milliard-plugin-08

下のイメージはリスト表示したイメージですが、こちらもシンプルでとても使い勝手が良さそうです。

Milliard-plugin-09

スマホ/タブレット

記事幅が640px以下の場合、どのように関連記事を表示するか指定します。

「挿入箇所のスクロールを無効にする」にはチェックを入れた方が良いと思います。

スマホ表示の場合にスクロールが表示されてしまうと、スワイプしてもいつまで経ってもフッターにたどり着かない、なんてことが起こりかねません。

パネルを選択した場合

以下のように表示されます。

Milliard-plugin-10

 

リストを選択した場合

以下のように表示されます。

パネルもリストもどちらも使い勝手は良さそうです。

Milliard-plugin-11

 

表示場所の指定

当ブログのテーマはTwenty Seventeenですが、私は、content.phpに表示場所を指定しました。

  • content.php:フォルダパス ⇒ public_html/wp-content/themes/子テーマ/template-parts/post/

表示場所を指定する場合は、以下のコードをファイルに記述する必要があります。

HTMLタグで指定する方法

ウィジェットで指定する方法

PHPコードを利用する方法

 

※詳しい使用方法は、シスウ株式会社 ホームページをご確認ください。

 

content.phpへのコード追加場所は以下のとおりです。

Milliard-plugin-12

 

このように指定すると、本文の後に関連記事が表示されるようになるので、記事を読み終わった後、すぐに関連記事を読者にアピールできるのかなと思います。

Milliard-plugin-12

 

Milliard関連ページプラグインは手軽に導入できるうえに、おしゃれに関連記事を表示できる素晴らしいプラグインだと思います。

どのようにして関連記事を表示させるか迷っている方には、Milliard関連ページプラグインをお勧めしたいと思います。

※Milliard関連ページプラグインのcssをカスタマイズしてみました!よろしければ以下の記事も見てみてください。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です