WordPressで関連記事を表示するコード

関連記事とは

関連記事とは、ある記事の内容に関連するテーマや情報を持つ別の記事のことです。多くの場合、ウェブサイトやブログ、ニュースサイトなどで、読者がさらに興味を持ちそうな記事を見つけられるように、元となる記事の終わりやサイドバーに表示されます。

なぜ関連記事が表示されるのか?

  • ユーザー体験の向上: 読者が探している情報や興味のあるテーマに、より深くアクセスできるようにするためです。
  • サイト内の回遊率アップ: 関連記事を読んでもらうことで、ユーザーがサイトに滞在する時間が長くなり、他のページも見てくれる可能性が高まります。
  • SEO対策: 関連性の高い記事同士をリンクでつなげることで、検索エンジンがサイト全体の構造や各記事の重要性を正しく理解しやすくなります。

例えば、ラーメンの食べ歩きについての記事を読んだ後、「東京の人気ラーメン店10選」や「美味しいラーメンの作り方」といった記事が関連記事として表示されることがあります。これにより、読者は同じジャンルの記事を続けて読むことができるため、満足度が高まります。

関連記事を表示するコード

WordPressで関連記事を表示するには、主に以下の2つの方法があります。

1. プラグインを利用する

これが最も簡単で、初心者にもおすすめです。多くのプラグインが無料で提供されており、設定も簡単です。

代表的なプラグイン

  • Yet Another Related Posts Plugin (YARPP): 非常に人気があり、タグ、カテゴリー、キーワードなどに基づいて柔軟に関連記事を抽出できます。
  • Contextual Related Posts: 記事の内容やタイトル、タグなどから関連性の高い記事を自動で表示します。
  • Jetpack: WordPressの公式プラグインで、関連記事表示機能も含まれています。

2. コードを直接テーマファイルに記述する

自分でコードを記述すれば、より細かくカスタマイズできますが、PHPやWordPressのテンプレートタグに関する知識が必要です。 以下に、カテゴリーが同じ関連記事を表示する基本的なスクリプトの例を示します。

スクリプトの例

このコードは、single.phpcontent-single.phpなど、記事の個別ページを表示するテンプレートファイルに追加します。

PHP

<?php
// 現在の記事のIDとカテゴリーを取得
$current_post_id = get_the_ID();
$categories = get_the_category();

// カテゴリーが一つでも存在するか確認
if ($categories) {
    $category_ids = array();
    foreach($categories as $category) {
        $category_ids[] = $category->term_id;
    }

    // クエリパラメータの設定
    $args = array(
        'post_type' => 'post', // 投稿タイプ
        'posts_per_page' => 5, // 表示する記事数
        'category__in' => $category_ids, // 取得したカテゴリーIDを含む
        'post__not_in' => array($current_post_id), // 現在の記事を除外
        'orderby' => 'rand' // ランダムに表示
    );

    $related_posts = new WP_Query($args);

    // 関連記事が存在するか確認
    if ($related_posts->have_posts()) {
        echo '<h3>関連記事</h3>';
        echo '<ul>';
        while ($related_posts->have_posts()) {
            $related_posts->the_post();
            ?>
            <li><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></li>
            <?php
        }
        echo '</ul>';
        // メインクエリをリセット
        wp_reset_postdata();
    }
}
?>
Code language: HTML, XML (xml)

スクリプトの説明

  1. get_the_category(): 現在の投稿が属するカテゴリーを取得します。
  2. WP_Query: WordPressで投稿を検索するためのクラスです。$args配列で検索条件を指定します。
  3. category__in: 指定したカテゴリーIDに含まれる投稿を検索します。
  4. post__not_in: 検索結果から特定の投稿IDを除外します。ここでは現在表示している記事を除外しています。
  5. wp_reset_postdata(): WP_Queryでメインクエリを上書きした後に、元のクエリの状態に戻すために必ず使用します。これを忘れると、他のテンプレートタグが正常に動作しない場合があります。

どちらの方法を選ぶかは、WordPressの習熟度や、どの程度カスタマイズしたいかによります。簡単な方法から試して、慣れてきたらコードでの実装に挑戦してみるのが良いでしょう。

プラグインを利用せずコードを記述するメリットとデメリット

WordPressプラグインを利用せずにコードを記述する(すなわち、テーマの$\text{functions.php}$ファイルやカスタムプラグインとして直接コードを書く)ことには、いくつかのメリットとデメリットがあります。

メリット

パフォーマンスと効率

  • 軽量化: 必要な機能だけを厳選してコード化するため、不要な機能やオーバーヘッドがなくなり、サイトのロード時間が短縮され、パフォーマンスが向上する可能性が高いです。
  • クリーンなコード: プラグインの多くは汎用性を高めるために複雑になりがちですが、自作コードはサイト固有の要件に特化できるため、よりクリーンで効率的なコードベースを保てます。

柔軟性とカスタマイズ性

  • 完全な制御: コードの全行を自分で管理できるため、WordPressの動作を細部にわたって完全に制御し、既存のプラグインでは実現できないような独自の機能を実装できます。
  • 他の要素との統合: テーマや他のカスタム機能とのシームレスな統合が容易になります。

セキュリティと安定性

  • セキュリティリスクの低減: 信頼できないソースの外部プラグインを使用するリスクを回避できます。自作コードは必要な機能に限定されるため、潜在的なセキュリティホールも減らせます。
  • 依存関係の排除: 外部プラグインの更新によってサイトが壊れるリスクや、そのプラグインが開発停止になるリスクを排除できます。

デメリット

専門知識と時間

  • 高度なスキルが必要: PHP、WordPressのフック(アクションとフィルター)、セキュリティのベストプラクティスなど、専門的なコーディング知識が必要です。
  • 開発とメンテナンスの負荷: 既存のプラグインを使えば数分で済む機能でも、一からコードを書いて実装・デバッグ・テストするのに時間がかかります。また、WordPress本体やテーマのアップデートに合わせてコードを自分でメンテナンスし続ける必要があります。

バグとデバッグ

  • エラー発生のリスク: 自分で書いたコードは、予期せぬバグを引き起こすリスクがあります。特に$\text{functions.php}$ファイルへの直接的な誤った記述は、サイト全体をダウンさせる可能性があります。
  • デバッグの困難さ: バグが発生した場合、その原因を特定し修正する作業(デバッグ)もすべて自分で行う必要があります。

移植性と互換性

  • テーマへの依存: コードを$\text{functions.php}$に記述した場合、テーマを変更するとその機能は失われます。この問題を回避するには、カスタムプラグインとして作成する必要がありますが、これはさらに手間がかかります。

WordPressはカスタマイズしやすい

一般的に、WordPressはカスタマイズがしやすいと言える要素が多いです。

カスタマイズしやすい点

  • テーマの豊富さ:
    • デザインや機能があらかじめ組み込まれた「テーマ」が非常に多く、テーマを選ぶだけでサイトの見た目や基本的な機能を簡単に変更できます。
    • カスタマイズ性に優れていることを売りにしているテーマ(例:SWELL, AFFINGER, Snow Monkeyなど)も多く、これらのテーマを使えばコードを触らずに設定画面から多くの調整が可能です。
    • 最近はフルサイト編集(FSE)に対応したテーマもあり、より直感的にサイト全体を編集できます。
  • プラグインによる機能追加:
    • Webサイトに必要な様々な機能(問い合わせフォーム、セキュリティ対策、SEO対策、表示速度の改善など)を、プログラムの知識なしにプラグインを導入するだけで追加できます。
  • CSSなどの知識があればさらに自由度が高い:
    • HTMLやCSS、PHPといったウェブ制作の知識があれば、テーマファイルを直接編集したり、子テーマを作成したりすることで、さらに細部にわたる自由なカスタマイズが可能です。

注意点

  • テーマ選びが重要:
    • デザインを大きく変えたい場合や、特定の機能を追加したい場合、選んだテーマのカスタマイズの自由度が低いと、実現が難しかったり、余計な手間がかかったりすることがあります。
    • 初心者の方は、直感的な操作や豊富な設定オプションがある「カスタマイズしやすい」と評判のテーマを選ぶと良いでしょう。
  • 複雑な機能の実装には知識が必要:
    • 非常に高度で特殊な機能や、テーマの標準設定にない大きな構造変更を行うには、やはりPHPなどのプログラミング知識が必要になります。
    • この場合、専門の制作会社に依頼したり、自分でコードを編集するために学習したりする必要があります。

結論として、多くのカスタマイズは知識がなくても比較的簡単に行えますが、どこまで深く、細かくこだわるかによって難易度は変わってきます。

有料WordPressテーマはカスタマイズに有利

有料のWordPressテーマは一般的にカスタマイズに有利だと言えます。

主な理由としては、以下のような点があります。

  1. 豊富な機能と設定オプション:
    • 有料テーマには、デザインやレイアウトを細かく調整するための専用機能や設定項目が豊富に用意されていることが多いです。
    • プラグインをあまり使わなくても、枠線、吹き出し、装飾文字などの実用的な機能が使えるようになっていることが多く、初心者でも簡単にカスタマイズできます。
  2. デザインの自由度の高さ:
    • 最初からプロが作成した洗練されたデザインテンプレートが用意されており、それをベースに色やレイアウトを比較的自由に調整できるテーマが多いです。
    • 多くのテーマがブロックエディタ(Gutenberg)に完全対応し、より直感的にカスタマイズできるようになっています。
  3. サポートとマニュアルの充実:
    • カスタマイズ方法やトラブルシューティングに関する詳細なマニュアルが整備されていたり、購入者向けのサポート(メールやフォーラムなど)が付いていることが多いため、困ったときに解決しやすいです。
  4. 技術的な優位性:
    • SEO対策や高速表示など、サイト運営に重要な技術的要素が考慮されて設計されていることが多く、その上でカスタマイズも容易にできるように作られています。

無料テーマでも素晴らしいものはありますが、カスタマイズの自由度を上げようとすると、自分でCSSやHTMLなどの専門知識が必要になるケースや、利用できる機能に限界を感じることが少なくありません。

時間を節約し、効率的かつ高品質なサイトを構築したい場合は、初期投資として有料テーマを導入することが、結果的に大きなメリットとなることが多いです。

テーマ名主な特徴・強み適したサイト
ザ・トール (THE THOR)国内最高クラスのSEO最適化高速表示
プロ仕様の美しいデザインを簡単に実現(着せ替え機能あり)
アフィリエイトに役立つランキング作成機能CTAが充実<記事装飾機能が豊富で、読みやすいコンテンツ作成を支援
アフィリエイトブログ本格的なメディアサイト集客を重視するビジネスサイト
エマノン (Emanon)Web集客・ビジネス利用に特化した機能が豊富
CTA(行動喚起)、LP(ランディングページ)、メルマガ専用ページなどを簡単に作成
企業サイト、オウンドメディアに適したデザイン
WooCommerce対応でネットショップにも利用可能(Premium)
コーポレートサイト企業ブログオウンドメディアリード獲得を目的としたビジネスサイト
ストークSE (STORK SE)「誰が使っても美しいデザイン」を追求したモバイルファースト設計
シングルカラム(1カラム)レイアウトに特化し、コンテンツへの集中度が高い
ブロックエディタに最適化され、直感的な操作が可能
シンプルかつ洗練されたデザインで、汎用性が高い
商品・サービスのブランディングサイト、ミニマルな企業サイトシンプルで美しいブログ
リキッドプレス (LIQUID PRESS)用途別に豊富なテーマ(マガジン、コーポレートなど)が用意されている
高いSEO対策と構造化データ対応
多言語対応機能(LIQUID CORPORATEなど)
カスタマイザーでの直感的な編集が可能
メディアサイト(ブログ)、多言語対応が必要な企業サイト目的に合わせたテーマを選びたいサイト
有料WordPressテーマ

補足情報

  • ザ・トール: SEOと収益化を最重視する設計で、アフィリエイターやブロガーに人気が高いテーマです。
  • エマノン: 特にBtoBサービス業など、Webからの顧客獲得(リードジェネレーション)を重視するビジネスサイト構築に適しています。
  • ストークSE: モバイルでの見やすさに徹底的にこだわり、余計な装飾を排したデザインが特徴です。商品の魅力を際立たせたいサイトにも向いています。
  • リキッドプレス: 豊富なラインナップの中から目的特化型のテーマを選べるのが大きなメリットです。例えば、ニュースサイトならLIQUID MAGAZINE、企業サイトならLIQUID CORPORATEなどがあります。