海洋SF小説の無料サンプルを更新しました。 PDFを読む

特定のタグに関連する記事リストを本文下部に表示する (手動で管理)

目次

特定のタグに関連する記事リストの出力

ここでは、プラグイン『Display Posts – Easy lists, grids, navigation, and more』を使って、投稿本文の下部に、特定のタグに関連する記事リストを自動表示する方法を紹介しています。

WordPress.org 日本語
Display Posts – Easy lists, grids, navigation, and more
Display Posts – Easy lists, grids, navigation, and moreAdd a listing of content on your website using a simple shortcode. Filter the results by category, author, and more.

管理画面の拡張プラグイン『Admin Column Pro』を使えば、入力・編集もぐっとラクになりますので、興味のある方は試してみて下さい。

特定のタグにフォーカスする理由

サイト内を効率よく巡回させる為に、『関連記事の表示』を取り入れているサイトも多いと思いますが、カテゴリー、もしくは、複数のタグをベースに、漫然と関連記事を並べても、ほとんどビジターの興味は引きません。

特に、雑記ブログで、複数のカテゴリーにまたがってタグ付けされている場合、まるで的外れな関連記事が表示されることもあります。

一例。

ビジターは「ホアキン・フェニックス」で検索

映画『ジョーカー』のレビュー記事にヒット

タグ付け ・・ アクション映画、 ロバート・デニーロ、 ホアキン・フェニックス、 感動ドラマ

関連記事の自動リスト
・ 映画『タクシー・ドライバー』のレビュー 
・ 小説『風と共に去りぬ』の名言集
・ 2018年 おすすめアクション映画 ベスト10

興味ない

離脱

ビジターの興味は、俳優のホアキン・フェニックスであり、もう一つ、読むとしたら、ホアキン・フェニックスの話題もフィーチャーした、映画『グラディエイター』のレビュー記事や、実兄であるリバー・フェニックスの特集記事だと思います。

それなら、最初から『ホアキン・フェニックス』にフォーカスした関連記事を一つか二つ、目立つ所に表示した方が、クリックされる確率は高いです。

しかし、カテゴリーやタグ・ベースで、関連記事を自動表示している場合、記事リストをこちら側で完全にコントロールすることはできません。

そこでおすすめしたいのが、特定のタグに限定した、関連記事リストです。

これなら、たとえ自動表示でも、ビジターの興味から大きく外れることはないので、次もクリックされる確率が高いです。

手動で関連付けするプラグインもありますが、ここでは、より簡便な『Display Posts – Easy lists, grids, navigation, and more』を使います。

手動で記事を関連付け・自動相互リンクも可能な『Custom Related Posts』

ショートコードの書き方

『Display Posts』を有効化したら、特定のタグに属する記事リストを呼び出す為のショートコードを作成します。

各種パラメータは、プラグインの公式Documentページを参照して下さい。
https://displayposts.com/docs/parameters/

タグのスラッグが【nietzsche】の場合。

・ tag (タグの指定) = スラッグ
・ exclude_current(表示中の記事)= true (リストから除外)
・ tax_current(指定タグに所属する表示中の記事) = true(リストから除外)
・ rand(表示順) = ランダム
・ posts_per_page (表示したい数) = 5本

テーマのデザインに併せてスタイリング

さらに、テーマのデザインに併せて、表示方法をカスタマイズします。

見出しをh4タグで括り、関連記事リストの下に、タグ・アーカイブへのリンクボタンを挿入しています。

テーマのデザインに併せてリスト表示

★ 記事リストのサムネイルについて
記事リストのサムネイルは、コンテンツの種類によって、効果的なものと、あまり効果のないものがあります。
たとえば、映画や漫画のように、ビジュアルがメインの場合、サムネイルがあった方が記事の内容が把握しやすいですが、カスタマイズ情報や操作方法のように、テキストが主体の場合は、テキストリンクの方が分かりやすいです。
むしろ、外国人モデルの写真やイラストのサムネイルは邪魔かと。
意外と、テキストリンクもクリックされやすいので、そのあたりはサイトの概要に併せてテストして下さい。

カスタムフィールドを使った記事リストの管理

テンプレート・タグで【値】を呼び出す

Display Posts で生成したショートコードは、投稿本文の下部に、手動で挿入してもいいですが、カスタムフィールドを使って、一括管理した方が、入力・修正ともに簡単・楽々です。

まず、任意の名前で、カスタムフィールドを設定します。

【値】に、表示したいショートコードとスタイル、文言などを入力します。

カスタムフィールドにショートコードを入力

次に、テンプレート・タグをウィジェットに記入して、【値】に入力したショートコードやスタイルを記事下部に自動表示します。

ウィジェットの種類は、お使いのテーマ・テンプレートによって異なります。

表示したい場所にウィジェットが存在しない場合は、single.php など、テンプレート・ファイルに直接書き込んで下さい。

通常、ウィジェットでPHPコードは使えないので、PHPに対応したプラグインを利用します。

下図の場合、『Code Widget』というプラグインを使って、使用中のテーマ『SWELL』に備わっている『記事下部』にテンプレート・タグを挿入しています。

他にも『PHP Code Widget』という有名なプラグインがありますが、Code Widgetは、ショートコードやHTML、テキストなど、いろんな種類に対応しているので、こちらがおすすめかと。

通常、カスタムフィールドの【値】を呼び出すには、 get_post_meta を使いますが、ショートコードの文字列がそのまま表示されるので、 apply_filters を使って、ショートコードの内容が反映されるようにします。

参考にした記事 → 【WordPress】カスタムフィールドでショートコードを使用する例|apply_filters()

下図のように、ウィジェットにテンプレートタグを記入。

なお、div class = post_content は、テーマ特有のスタイルです。
ご自身の環境に合わせて、カスタマイズして下さい。

ウィジェットにコードを挿入

Admin Column Proで一括管理

投稿数が多い場合は、有料プラグイン『Admin Column Pro』を使えば、カスタムフィールドの一括編集が可能です。

参考記事 → WordPressの管理画面を見やすくする『Admin Column Pro』長寿サイト向け

『Admin Column Pro』で、管理画面に表示する項目に、関連記事の【値】を追加し、「インライン編集」を可能にします。

インライン編集で楽々入力

次に、該当のタグに所属する投稿の一覧を呼び出して、インライン編集で、一気に同じ【値】をコピペすれば完了。

投稿数が、何十とあっても、5分とかかりません。

修正や変更も、管理画面の一覧表示→インライン編集で楽々。

興味のある方はお試し下さい。

カスタムフィールドを一括変換

ここでは「タグ」に注目していますが、Display Posts を使えば、投稿年月や、カスタムフィールドの値や、著者に特化した記事リストの作成が可能です。
コンテンツの種類に応じて、いろいろ試して下さい。

この記事を書いた人

石田 朋子のアバター 石田 朋子 サイト管理人

作家・文芸愛好家。1998年よりホームページを運営。PCと車が大好きな80年代のサブカルファン。WordPressとは10年以上の付き合い。普段はぼーっとしたお母さんです。小説より漫画とアニメに詳しいヲタで、昭和の名作漫画は大半の台詞を空で言うことができます。東欧在住。本を買ってくれたら喜びます。

目次
閉じる