サポート » 使い方全般 » 次の記事リンクを同じカテゴリで画像付きで表示したい

  • 解決済 dataring

    (@dataring)


    記事ページの下部に配置する、「次の記事」「前の記事」の前後のリンクを、
    全ページが対象ではなく、同じカテゴリー内での前後のページにしたリンクで作成したいのですが、
    こちらをサムネイルの画像付きで表示をする専用のタグの例が、なかなか見つかりません。 どのようにしてタグを表記をすればよいでしょうか? ちなみに、全ページが対象のリンクのタグは、現在こちらを使用しています。 <?php
    $prevpost = get_adjacent_post(false, '', true);
    $nextpost = get_adjacent_post(false, '', false);
    if($prevpost != NULL){
    echo '<ul class="prevnext__ul"><li class="prevnext__li"><a class="nav-prev-link" title="' . esc_html($prevpost->post_title) . '" href="' . esc_url(home_url('/') . $prevpost->post_name . '/') . '" rel="prev">';
    echo '<img class="nav-prev-image" alt="' . esc_html($prevpost->post_title) . '" src="' . esc_url(get_the_post_thumbnail_url( $prevpost->ID, 'thumbnail')) . '"><br /> ';
    echo '' . esc_html($prevpost->post_title) . '';
    echo '</a></li>';
    }
    if($nextpost != NULL){
    echo '<li class="prevnext__li"><a class="nav-next-link" title="' . esc_html($nextpost->post_title) . '" href="' . esc_url(home_url('/') . $nextpost->post_name . '/') . '" rel="next">';
    echo '<img class="nav-next-image" alt="' . esc_html($nextpost->post_title) . '" src="' . esc_url(get_the_post_thumbnail_url( $nextpost->ID, 'thumbnail')) . '"><br /> ';
    echo '' . esc_html($nextpost->post_title) . '';
    echo '</a></li></ul>';
    }
    ?> どうぞよろしくお願いいたします。
4件の返信を表示中 - 1 - 4件目 (全4件中)
  • こんにちは。

    未テストですが、get_adjacent_post() 関数は第一引数である $in_same_termtrue にすると、同じターム内に限定出来るようなので、これを試していてはいかがでしょうか。

    トピック投稿者 dataring

    (@dataring)

    Aki Hamano 様、こんばんは。

    アドバイスを頂けましてありがとうございます。

    trueの表記で、同じカテゴリー同士での前後の記事のテキストリンクの方は表示ができました。

    残りはアイキャッチ画像の、URLの取得のみになったのですが、
    「img」のタグでの「src=””」の中に記述する関数が、やはりなかなか見つかりません。

    同じカテゴリー同士での前後のページの、サムネイルの画像を取得できるタグ等が何かありましたら、
    ぜひお教えいただければと思います。

    現在での前後ページのタグの表記はこちらのコードです。↓

    <?php
    $prev_post = get_adjacent_post(true, '', true, 'category');
    $next_post = get_adjacent_post(true, '', false, 'category');
    if( $prev_post or $next_post ):
    ?>
    <ul class="prevnext__ul">
      <?php if ($prev_post): ?>
        <li class="prevnext__li"><a class="nav-prev-link" href="<?php echo get_permalink($prev_post->ID); ?>" title="<?php echo get_the_title($prev_post->ID); ?>">
    <img class="nav-next-image" alt="<?php echo get_the_title($prev_post->ID); ?>" src=""><br />
    <?php echo get_the_title($prev_post->ID); ?></a></li>
      <?php else: ?>
      <?php endif; ?>
      <?php if ($next_post): ?>
        <li class="prevnext__li"><a class="nav-next-link" href="<?php echo get_permalink($next_post->ID); ?>" title="<?php echo get_the_title($next_post->ID); ?>">
    <img class="nav-next-image" alt="<?php echo get_the_title($next_post->ID); ?>" src=""><br />
    <?php echo get_the_title($next_post->ID); ?></a></li>
      <?php else: ?>
      <?php endif; ?>
    </ul>
    <?php endif; ?>
    • 前後の投稿取得する関数である get_adjacent_post() の戻り値が 投稿オブジェクトである
    • 投稿サムネイルを取得する関数である get_the_post_thumbnail() の第一引数で投稿オブジェクトを指定出来る

    という仕様から考えると、おそらく以下のようなコードで前後記事のサムネイルを取得出来ると思います。(未テストです)

    $prev_post = get_adjacent_post(true, '', true, 'category');
    $next_post = get_adjacent_post(true, '', false, 'category');
    
    $prev_post_thumbnail = get_the_post_thumbnail( $prev_post )
    $next_post_thumbnail = get_the_post_thumbnail( $next_post )
    トピック投稿者 dataring

    (@dataring)

    Aki Hamano 様、

    ご提供をありがとうございます。こちらのコードを貼り付けて、
    「width=」「height=」でサイズ指定をしたら、
    無事にカテゴリ別の前後ページのアイキャッチ画像も表示ができました。

4件の返信を表示中 - 1 - 4件目 (全4件中)
  • このトピックに返信するにはログインが必要です。