WordPress 関連投稿を表示する

テーマに沿って、単一の文の下に関連する記事のリストを表示する機能が提供されます。 しかし、現在このブログで使用されているテーマは、 冥王星というテーマですが、この機能を見つけることができないですね。 使用中のテーマにRelated Posts関連機能があるかのテーマオプションで確認が可能です。

この記事は古く、以下で紹介する方法が最新です WordPress バージョンでは動作しない可能性があります。 代わりに「WordPress 関連記事一覧を表示する（GeneratePress テーマ）「で紹介する方法をご利用ください。

Related Postsプラグイン

「関連記事」を表示する機能がない場合は、プラグインを使用して単に関連記事を表示できます。 このようなプラグインで コンテキスト関連記事, Related Posts for WordPress, Yuzo - Related Posts, インライン関連記事 など、様々な無料のプラグインがあります。 2年前にだけでも好みの無料のプラグインがあまりなかった頃には、まともなプラグインもたまにあるようです。

より洗練された機能ときちんとしたレイアウトが必要な場合は、有料プラグインを検討できます。 Related Posts Pro for WordPress, WordPress Thumby Related Posts Widgetなどがユーザー評価が大丈夫な有料プラグインがありましたが、今はアップデートできず放置されています。 別のプラグインで WordPress Infinite Related Next Post Managerがあります。

JetPack（ジェトペク）のRelated Postsプラグイン

JetPackがインストールされている場合は、別のプラグインをインストールすることなく JetPack> Settings（設定） 下からRelated Postsプラグインを有効にします。 次に 設定>読むでRelated Posts関連の設定を行うことができます。

別のプラグインをインストールしていなくても、JetPackの機能だけで素晴らしいRelated Posts機能を使用することができます。 ちなみにJetPackは便利な機能をたくさん提供しますが、重いプラグインです。 サイトに多くの負担を与えることができます。 だから、私はこのブログでは、JetPackを削除しました。 代わりに他のサイトにJetPackをインストールして使用しているが、この機能を有効にしたが、正しく表示がされないですね。 少しの検索を介してMinifyプラグインがインストールされている場合、この機能が正常に動作していないようです。 多分キャッシュプラグインとも関係があることだよ。

ユーザーコードの作成

プラグインを使用すると、便利で簡単ですが、プラグインを多く使用することは、サイトの速度に悪影響を及ぼして、他のプラグインやテーマなどの衝突問題も発生する可能性がありますので、プラグインは、必要な機能のみを使用することが望ましいです。

インターネットで Related Posts コードを簡単に検索できます。 そのようなコードの中から好きなコードを持ってテーマに合わせて適宜修正して自分だけの「関連文」を作ることができます。

以前のテーマ（Pluto）では Diviブログに記載されているコードを活用してみました。

次のコードをテーマに応じて適切なファイル（例えば、single.phpまたはcontent.php）に追加します。

Related posts ID）; if（$tags）{ $tag_ids = array（）; foreach($tags as $individual_tag) $tag_ids[] = $individual_tag->term_id; $args=array( 'tag__in' => $tag_ids, 'post__not_in' => array($post->ID), 'posts_per_page'=>3, // Number of related posts to display, 表示する関連記事の数 'caller_get_posts '=> 3）; $my_query = new wp_query( $args ); while( $my_query->have_posts() ) { $my_query->the_post(); ?> ">

通常ループが終わる地点に追加します。 現在、このブログで使用されているDiviテーマでは、single.phpファイルで下のendwhile（ ）の後に追加します。

その後、次のようなコードを追加します。 CSSコードは、子テーマを作成し、子テーマのstyle.cssファイルに追加するようにします。

.single .relatedposts .relatedthumb { display:inline-block; 幅：32％。 }

CSSコードを適切に調整すると、次のような形で関連記事が表示されます。

2％（多分20％）不足感が出ますがそれなりに似合うようです。 CSSを使用して詳細にレイアウトを調整できます。 elegantthemes 文章に記載されているコードを少し変更してポストを 3 つを表示させるようにし、画面が減ると横に 2 つ、モバイルでは縦に 2 つが表示するように調整しました。 これに関する詳細は CSS media query（メディアクエリ）を参照してください。

そしてarray部分に 'orderby'=>'rand'を追加して記事がランダムに表示されるよう変更しました。 だから変更された部分が、ここに書いてみると：

foreach($tags as $individual_tag) $tag_ids[] = $individual_tag->term_id; $args=array( 'tag__in' => $tag_ids, 'post__not_in' => array($post->ID), 'posts_per_page'=>3, // 3 に変更しました 'caller_get_posts'=>1, 'orderby' => 'rand' //追加）

上記のように 'orderby'=>'rand'を追加し、 posts_per_page（ページあたりのポスト数）を3に変更しました。 そしてサムネイルは、テーマに事前に定義されているサムネイルを使用していました。

the_post_thumbnail（array（150,100））;

上の部分を 以下のように あらかじめ定義されているサムネイルの名前に置き換えました。 テーマに適当な大きさのサムネイルが定義されている場合は、それをそのまま使用すると良いです。 それとも、次のようにサムネイルのサイズを直接定義してくれてもされます。

function my_custom_thumbs() { add_image_size( 'related-post-medium', 200, 150, true ); } add_action( 'after_setup_theme'、 'my_custom_thumbs'）;

上記のコードをテーマの関数ファイルに追加して、 the_post_thumbnail（array（150,100））; 部分は以下のように変更します。 （この部分については、 この記事を参考にして見れば役立ちます。）

the_post_thumbnail（ 'related-post-medium'）;

そして最終コード single.php 또는 content.php ファイルなど適切なファイルを検索し、目的の場所に追加し、CSSを使用して、レイアウトを調整してくれるようです。

또는 How to add WordPress Related Posts Without Plugins（プラグインを使用せずに関連記事を WordPressに追加する方法）という文で紹介されたコードを持ってテストすることもできそうです（テストはみていないこと）。

状況に応じて適切な方法で、個々の文の下に関連記事（Related Posts）を表示することができます。 直接コードを作成して追加する場合、サイトに最も少ない負担になって速度面で有利です。 そして、達成感も感じることができるでしょう。 次の記事では、サイドバーFeatured Postsウィジェットを作成して追加する方法を説明してみる予定です。

参照

• WordPress Diviテーマの背景マスクとパターンの導入（+無料ダウンロード）