「Advanced Custom Fields」でピックアップ記事の表示制御カスタマイズ

「Advanced Custom Fields」でピックアップ記事の表示制御カスタマイズ公開日：2021/05/24

この記事のURLとタイトルをコピーする

ホームページ運用が始まると、「特定の記事を特定の場所に常時固定で表示させたい！」という依頼を承ることが多くあります。

本記事では、管理画面で選択した記事を、トップページにPICK UP（ピックアップ）として常時表示するカスタマイズを「Advanced Custom Fields」プラグインを使用し、実装していきます。
それでは早速、今回のカスタマイズで使用する「Advanced Custom Fields」プラグインをインストールします。

目次 [ひらく ▼]

インストール手順

公式サイトからインストールする

下記、公式サイトよりZIPファイルをダウンロードします。
WordPress管理画面（プラグイン > 新規追加）からZIPファイルをアップロードし、有効化します。

Advanced Custom Fields

WordPress管理画面からインストールする

WordPress管理画面（プラグイン > 新規追加）より、「Advanced Custom Fields」を検索します。
「今すぐインストール」より、インストールし、有効化します。

Advanced Custom Fieldsの初期設定

インストールし、有効化します。
管理画面 > カスタムフィールド > 新規追加をクリックし、フィールドグループを新規追加します。

「＋フィールドを追加」クリックし、「ラベル」「フィールド名」「フィールドタイプ」「選択肢」を設定します。

「位置」の「このフィールドグループを表示する条件」を設定します。
「Custom Post Type UI」プラグインで追加した、カスタム投稿「コラム」へのみ、適用させたいので、条件は「コラム」とします。

設定の位置はデフォルトは「通常（コンテンツエディタの後）」ですが、「サイド」へ変更し、更新します。

記事編集画面に先ほど追加したカスタムフィールドが追加されていることを確認します。

こちらで「Advanced Custom Fields」側での設定は完了です。

特定記事の表示制御カスタマイズ

それでは早速、本サイト（https://sd-webworks.com/）トップページの「よくある質問」と「コラム一覧」の間に「PICK UP」コンテンツを追加していきたいと思います。

テーマファイルへの追記

<?php
    $toplist = array(
        'post_type' => 'column',
        'posts_per_page' => 3,
        'meta_key' => 'show_pickup',
        'meta_value' => 'show',
        'meta_compare' => 'LIKE'
    );
?>
<?php query_posts($toplist); ?>
<?php if (have_posts()) : while(have_posts()) : the_post(); ?>
  コンテンツが入ります。
<?php endwhile; endif; wp_reset_query(); ?>