プラグインなしでWordPress関連の投稿を追加する方法

WordPressを使用する大きな利点の1つはプラグインです。 WordPressプラグインは、ブログをCMSに拡張することから、気の利いた機能を追加して検索エンジン用にブログを最適化することまで、想像できるほとんどすべてをカバーします - 可能性は無限大です（さまざまなテーマを忘れてはいけません）。.

しかし、あまりにも多くのプラグインを使用することによって、あなたはあなたのWordPressブログを詰まらせる危険を冒します、そして、最悪の場合、あなたはそれを「壊す」かもしれません。あなたのブログを遅くするプラグインと同様に、互いに互換性がないプラグインの多くのインスタンスがあります.

最も人気のあるWordPressプラグインのカテゴリのいくつかは、追加に基づいています “関連記事” ブログに。 WordPressには標準的なものは何もないので、誰もが自分のサイトに関連する投稿を表示するためにある種のプラグインを使用する必要があります。.

この記事では、サムネイル付きの関連記事をプラグインなしでブログに追加する方法を説明します。始めましょう!

しかし、最初に、なぜプラグインを避けるのか?

プラグインではなく、常にWordPressに組み込まれているコードとサービスを試して使用しなければならない理由はいくつかあります。主な利点は、ブログを機能させるためにサードパーティ（プラグイン開発者）に頼る必要がないことです。人気のあるプラグインが開発者によって放棄され、無数のサイト所有者が時代遅れで潜在的に脆弱なソフトウェアに行き詰まっているケースが数多くあります。.

もう1つの理由は、あなたのサイトをひどく悪くする、あるいはさらに悪いことに悪意のあるコードを含む可能性がある肥大化したプラグインを使用する危険を冒していないということです。.

はじめに：サムネイル付きの関連記事

この「関連記事」機能は、他のほとんどの記事と同様に、メインの記事ページ（single.php）に配置するように設計されていますが、WordPressループ内であれば、ほとんどどこでも使用できます。関連する投稿を取得するために、個々の記事に付けられている投稿タグを使用します。.

サムネイル

WordPressにはサムネイルシステムが組み込まれています。これはここで必要になります。有効にするには、このコードをあなたのテーマフォルダのfunctions.phpファイルに追加してください（ほとんどの場合、それはすでにそこにあります）.

 add_theme_support（ 'post-thumbnails'）;

コードに別の行を追加して、サムネイルの幅と高さを設定することもできます。

 add_theme_support（ 'post-thumbnails'）; set_post_thumbnail_size（100、50、true）;

重要： 画像を投稿に追加するときは、サムネイルを作成するために、画像アップロードパネルで次のいずれかを選択する必要があります。 “注目の画像として使用”. これは投稿のサムネイルを作成します.

コード

  関連記事
 ID）; if（$ tags）$ tag_ids = array（）; foreach（$ tagsを$ individual_tagとして）$ tag_ids [] = $ individual_tag-> term_id; $ args = array（ 'tag__in' => $ tag_ids、 'post__not_in' =>配列（$ post-> ID）、 'posts_per_page' => 4、//表示する関連投稿の数。 'caller_get_posts' => 1） ; $ my_query = new wp_query（$ args）; while（$ my_query-> have_posts（））$ my_query-> the_post（）; ？

コード the_post_thumbnail（配列（150,100） 表示されるサムネイルのサイズ、この場合は幅150ピクセル、高さ100ピクセルを設定します。.

CSS

ここに2つのdivクラスがあります, “.関連記事”, これは全体のdivコンテナです。 “.relatedthumb” これは.relatedposts内の個々のサムネイルとリンクです。投稿の幅は標準の640ピクセルと仮定します。 CSS：

 .relatedposts 幅：640ピクセル;マージン：0 0 20px 0。フロート：左。 font-size：12px; .relatedposts h3 フォントサイズ：20px;マージン：0 0 5px 0。  .relatedthumb margin：0 1px 0 1px;フロート：左。  .relatedthumb img margin：0 0 3px 0;パディング：0; .relatedthumb a 色：＃333;テキスト装飾：なし。表示ブロック;パディング：4px。幅：150ピクセル; .relatedthumb a：ホバー背景色：#ddd;色：＃000;

上記のCSSでは、投稿のサムネイルの幅が150ピクセルにレンダリングされます。つまり、640ピクセルの幅の投稿には4つのサムネイルが必要になります（マージンを含む）。あなたは望むようにこれを調整することができます。あなたが5枚のサムネイルが欲しいならば、あなたはおよそ125pxの.relatedthumb幅を必要とするでしょう.

重要： WordPressのメディア設定で生成されるサムネイルの幅は、CSSで設定したものと一致するように設定してください。さらに、それはphpコードで指定されたサイズと一致しなければなりません： the_post_thumbnail（配列（150,100）.

例

ゲームのブログDigitalBattle（この記事で説明されているものとまったく同じ手法を使用しています）で使用されているように、関連記事は次のように表示されます。

同様のテクニック

これは、プラグインなしで関連記事を投稿する唯一の方法ではありません。プラグインなしで関連記事を追加する方法を紹介するテクニックやガイドがたくさんあります。そのいくつかを次に示します。

プラグインを含まないWordPressのサムネイル付きの関連記事 （TechWalz）
方法：プラグインを使わないでWordPressのサムネイル付きの関連記事 （WPBeginner）
プラグインなしでサムネイル付きの関連記事を追加する方法 （WPCode）

結論

私たちはWordPressが提供する組み込み機能で多くのことができます、そして多くの場合、仕事を終わらせるためにサードパーティのプラグインに頼る必要はありません。次回WordPressブログ用のプラグインが必要になったら、プラグインなしで同じ機能を実現できるかどうかを確認してください。いろいろ調べて、別の方法でWebを検索してください。あなたは箱から出してWordPressでどのくらい可能であるかに驚くでしょう.