おすすめ記事

閲覧数: 19(0)

テーマのカスタマイズで「Featured Content」というオプションがあります。日本語では「おすすめ記事」と訳すのが一般的です。レイアウトとしてはサイトのトップ画像やサイトタイトルの後に横スライダーで表示するテーマが多いようです。現在使用中のテーマ「Fotografie」でも無料版ではスライドはしませんが「Featured Content」を表示することが可能です。列数は3か4を固定的に選択する仕様です。一時期スライダーを表示するプラグインを使用していましたがサイトが重くなるだけであまりいい印象は無かったので3列固定でいいんじゃないかと思います。「検索」の傾向でも「マドリッド バラハス空港」関連のアクセスが多いので、特に力を入れて?書いた3記事辺りをおすすめとして先頭に表示しようと思いました。

テーマカスタマイズで「おすすめ記事」オプションを有効にします。「フロントページ/ホームページ」のみ有効とするか「サイト全体」で有効とするか選べます。個別の記事を表示中は非表示でよいと思うので「フロントページ/ホームページ」を選択します。列数は3を選びます。記事数は列数に合わせて3を選びます。列数より多い数にすると行数が増えるようです。パソコンでは問題になりませんがスマホ画面ではスクロールが長くなり印象が良くありません。

記事数分のプルダウン(今回は3つ)から記事を選ぶのですが、、、ここで問題発生!「固定ページ」しか選べません。このサイトでは固定ページは「スペイン旅日記(ARIGATO.ESとは)」か「プライバシーポリシー」しかありません。「おすすめ記事を投稿から選びたい!」と思い、固定ページ以外を選ぶように出来ないものかとお盆休み返上でコードとにらめっこしました。紆余曲折あり結果的に出来るようにはなったのですが、、、まずはプルダウンで記事(固定ページ)を選ぶ部分から抜き出してみました。

    $number = get_theme_mod( 'fotografie_featured_content_number', 3 );

    // Loop for featured post content.
    for ( $i = 1; $i <= $number ; $i++ ) { 
        $wp_customize->add_setting( 'fotografie_featured_content_page_' . $i, array(
            'sanitize_callback' => 'fotografie_sanitize_post',
        ) );

        $wp_customize->add_control( 'fotografie_featured_content_page_' . $i, array(
            'active_callback' => 'fotografie_is_featured_content_active',
            'label'           => esc_html__( 'Featured Page', 'fotografie' ) . ' ' . $i,
            'section'         => 'featured_content',
            'type'            => 'dropdown-pages',
        ) );
    } // End for().
}
add_action( 'customize_register', 'fotografie_featured_content_options' );

「add_control」には、例えば「チェックボックス」「ラジオボタン」「リスト」など、選択のためのオプションがあり、その1つに「dropdown-pages」というのがあります。これがプルダウンを表示するためのオプションで「固定ページ」専用で「投稿」を選ぶことは出来ないようでした。投稿用の「dropdown-posts」とかあればいいのに。。。いろいろ探してみましたが見つかりません。無い場合はこのサイトでは自力で解決します。プラグインを導入するとか「有料テーマ(Fotografie Proでは実装されている)」を使うとかのオプションはありませんw とりあえず「add_control」の仕様を調べます。「’type’ => ‘select’」でリストボックスを表示することは判りました。中身は「’choices’ => $featured_list」のような配列を指定する必要がありそうです。

「$featured_list()」という配列を作るため「get_posts()」で「投稿一覧」を作ります。引数に「’post’」と「’nopaging’」を指定して投稿の全データを取得します。「foreach」で配列に整え「タイトルの一覧」を「$featured_list()」に格納します。これを「’type’ => ‘select’」指定することで投稿の全タイトルから「おすすめ記事」を選ぶことが出来るようになりました。ちなみにソート順はデフォルトの日付です。最新順に並びます。

    $number = get_theme_mod( 'fotografie_featured_content_number', 3 );

    // Loop for featured post content.
    for ( $i = 1; $i <= $number ; $i++ ) { 
        $wp_customize->add_setting( 'fotografie_featured_content_page_' . $i, array(
//        'sanitize_callback' => 'fotografie_sanitize_post',
          'transport' => 'postMessage'
        ) );

      $featured_list = array();
      $args = array(
          'post_type' => 'post',
          'nopaging' => true,
      );

      $featured_posts = get_posts( $args );
      foreach ( $featured_posts as $featured_post) {
          $featured_list[$featured_post->post_title] = $featured_post->post_title; }

        $wp_customize->add_control( 'fotografie_featured_content_page_' . $i, array(
            'active_callback' => 'fotografie_is_featured_content_active',
            'label'           => esc_html__( 'Featured Page', 'fotografie' ) . ' ' . $i,
            'section'         => 'featured_content',
//          'type'            => 'dropdown-pages',
            'type'            => 'select',
            'choices'         => $featured_list
        ) );
    } // End for().
}
add_action( 'customize_register', 'fotografie_featured_content_options' );

メデタシメデタシと思っていたら、トップページには何も表示されていませんでした。
Σ( ̄ロ ̄lll)ガーン
えっ?何で?どうやらトップページに表示する仕掛けは別にあるようです。確かにカスタマイズでは「タイトル」を選択してオプションとして保存しただけで表示のことは何も記述がありませんでしたね。しばらくコードを追いかけていると、どうやら表示に関係する部分がわかってきました。修正後のコードです。

// Get valid number of posts.
for ( $i = 1; $i <= $number; $i++ ) { 
//  $post_id = get_theme_mod( 'fotografie_featured_content_page_' . $i ); 
    $post_title = get_theme_mod( 'fotografie_featured_content_page_' . $i ); 
    $post = get_page_by_title($post_title, OBJECT, 'post'); 
    $post_id = $post->ID;

    if ( $post_id && '' !== $post_id ) {
        $post_list = array_merge( $post_list, array( $post_id ) );
    }
}

if ( empty( $post_list ) ) {
    return;
}

$args = array(
    'posts_per_page'      => $number,
    'post_type'           => 'post',
    'ignore_sticky_posts' => 1, // ignore sticky posts.
    'post__in'            => $post_list,
    'orderby'             => 'post__in',
);

$featured_posts = get_posts( $args );

「get_theme_mod( ‘fotografie_featured_content_page_’ . $i )」で先ほどテーマカスタマイズで選択した「おすすめ記事」として表示したい投稿の「タイトル」が取得できます。このタイトルから「ID」を逆に辿ります。「get_page_by_title()」で記事データを「$post」へ格納し「$post->ID」で投稿「ID」を取り出します。表示はここでも「get_posts()」を使用していますが「’post_type’」を「’page’」から「’post’」へ変更しないと指定した投稿が表示されないので注意が必要です。これで表示自体は出来るようになりますが、元のテーマがアップデートされると消えてしまうので「子テーマ」で対応する方が望ましいと思います。子テーマで実現するには一工夫必要で、元のテーマカスタマイズファンクションを残したままテーマが呼び出された後に該当するファンクションを削除して新しく作ったコードで置き換えるという作業を行います。このテーマでは「子テーマ」ディレクトリの「inc」サブフォルダから「template-tags.php」を「子テーマ」の「functions.php」で呼び出す仕様としています。

<?php
ob_start();
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
function theme_enqueue_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'child-style',
        get_stylesheet_directory_uri() . '/style.css',
        array('parent-style')
    );
}

get_template_part( 'inc/template', 'tags' );

function fotografie_child_languages(){
    load_theme_textdomain( 'fotografie', get_stylesheet_directory() . '/languages' );
}

add_action( 'after_setup_theme', 'fotografie_child_languages' );

ob_end_clean();

前述の「inc/customizer/featured-content.php」で修正した内容を丸ごと「inc/template-tags.php」へ移植します。唯一の変更点は「function()」名を変えること、単純に末尾に「2」とか付加するだけで十分です。関数名の重複を避けるだけの目的です。「fotografie_featured_content_options2」としました。「remove_action()」と「’after_setup_theme’」でオリジナルの関数「fotografie_featured_content_options」を削除します。テーマのセットアップ完了後に「remove_fotografie_content_option」が呼び出されることで実現しています。

add_action( 'customize_register', 'fotografie_featured_content_options2' );

function remove_fotografie_content_option() {
    remove_action( 'customize_register', 'fotografie_featured_content_options');
    }
add_action( 'after_setup_theme', 'remove_fotografie_content_option' );

ちなみに「Fotograife」の有料テーマは「$54.99」です。これ以外にも豊富な機能がついての値段ですけどね。

【最終更新日: 2019年5月20日】
カテゴリーIT閑話, 公開タグ, , ,
パンくずリスト詳細
2020年5月12日

テーマの「マイナーチェンジ」に伴って「パンくずリスト」の仕様を若干変更しました。一つ前のテーマではパ  続きを読む

カテゴリーを制限する
blank
2020年5月11日

過去に何度も書いた「カテゴリー制限」の話、元はと言えば初期に書かれた「非公開」の記事が原因です。トッ  続きを読む

マイナーチェンジ
blank
2020年3月23日

かれこれ一年近くほったらかしだったので、気合をいれて「テーマ変更」と思っていたのですが、、、いろいろ  続きを読む

6月の検索ワードまとめ
blank
2019年6月30日

6月の検索ワードのまとめです。 意外なところで「zabbixダウングレード」が複数回検索され、単独の  続きを読む

アクセシビリティ対策
blank
2019年6月23日

テーマカスタマイズの一環で、トップページに一覧表示されている「写真を左右交互に表示する」ようにした際  続きを読む

dockerとproxy
blank
2019年6月18日

dockerやdocker-composeをプロキシ環境下で使うのに苦労したので忘れないようにメモし  続きを読む

コメントを残す

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください