サポート » 使い方全般 » ターム一覧の表示にカスタムフィールドの画像を表示

  • 解決済 velfarre000

    (@velfarre000)


    固定ページでターム一覧を出力し、アドバンスドカスタムフィールドでそれぞれのタームに設定した画像を表示したいと考えています。

    <div class="works-genre-wrap">
        <div class="row">
    <?php
      $terms = get_terms('genre');
      foreach ( $terms as $term ) {
        echo '<div class="col-6 col-sm-3 mb20 genre-item"><a href="'.get_term_link($term).'"><div class="genre-item-wrap">'.$term->name.'</div></a></div>';
      }
    ?>
       </div>
    </div>

    一覧までは出来たのですが、その後が全く分かりません。お力を貸していただけないでしょうか??よろしくお願いします。

8件の返信を表示中 - 1 - 8件目 (全8件中)
  • ishitaka

    (@ishitaka)

    画像フィールドの「返り値のフォーマット」は何を選択(配列、URL、ID)していますか?

    velfarre000

    (@velfarre000)

    ishitaka (@ishitaka)さん

    現在IDを選択しています。

    ishitaka

    (@ishitaka)

    例:

    foreach ( $terms as $term ) {
    	$image_id = (int) get_field('カスタムフィールド名', $term );
    	echo wp_get_attachment_image( $image_id );

    参考ページ: https://www.advancedcustomfields.com/resources/image/

    velfarre000

    (@velfarre000)

    ありがとうございます。

    試してみたのですが画像の出力が出来ませんでした。

    恐縮ですが、下記コードで修正すべき点を教えていただけないでしょうか??

    <div class="works-genre-wrap">
        <div class="row">
    <?php
      $terms = get_terms('genre');
      foreach ( $terms as $term ) {
    	$image_id = (int) get_field('term-img', $term );
    	echo wp_get_attachment_image( $image_id ); {
        echo '<div class="col-6 col-sm-3 mb20 genre-item"><a href="'.get_term_link($term).'"><div class="genre-item-wrap">'.$term->name.'</div></a></div>';
      }
    ?>
       </div>
    </div>
    Honda

    (@rocketmartue)

    echo wp_get_attachment_image( $image_id ); {の所の最後の { が余分です。

    velfarre000

    (@velfarre000)

    皆様ありがとうございます!!

    調べているうちに別のコードで実装する事が出来ました。
    方法は異なりましたが、これにて解決とさせていただきます。

    ishitaka

    (@ishitaka)

    方法は異なりましたが、

    どのようにして解決したかを教えてください。他の人の参考になるかもしれません。
    https://ja.wordpress.org/support/topic/ktai-style%e3%80%80%e5%a4%96%e9%83%a8%e3%81%ae%e3%83%aa%e3%83%b3%e3%82%af%e7%94%bb%e5%83%8f%e3%82%92%e8%a1%a8%e7%a4%ba%e3%81%97%e3%81%9f%e3%81%84/#post-126909

    velfarre000

    (@velfarre000)

    下記コードにて画像表示及びターム名の一覧を出力まで行う事が出来ました。
    リンクの出し方が分からずaタグは、まだダミーとなっています。

    <div class="works-genre-wrap">
    
    <div class="container">
        <div class="row">
    
    <?php
        $taxonomy_name = 'genre'; //表示したいtaxonomynameを設定
            $taxonomys = get_terms($taxonomy_name);
                if(!is_wp_error($taxonomys) && count($taxonomys)):
                    foreach($taxonomys as $taxonomy):
                        $term_id = esc_html($taxonomy->term_id);
                        $term_idsp = "genre_".$term_id; //タクソノミー名とアンダーバー
                        $photo = get_field('category_icatch',$term_idsp);
                        $photosp = wp_get_attachment_image_src($photo, 'full');
                        ?>
                        
                        <div class="col-12 col-sm-3 mb20 genre-item">
                            <a href="#">
                                <div class="genre-item-wrap">
                                
                                   <div class="row">
                                       <div class="col-12">
                                           <div class="genre-img-wrap">
    								           <img src="<?php echo $photosp[0]; ?>" alt="<?php echo esc_html($taxonomy->name); ?>" >
                                           </div>
                                               
                                       </div>
                                       
                                       <div class="col-12">
                                            <div class="genre-text-wrap">
                                                <div class="text-inner"><?php echo esc_html($taxonomy->name); ?></div>
                                            </div>
                                       </div>
                                    </div>
                                </div>
                             </a>
                        </div> 
    <?php
        endforeach;
        endif;
    ?>
    
       </div>
    </div>
    
    </div>
    • この返信は2 ヶ月前に  velfarre000 さんが編集しました。
8件の返信を表示中 - 1 - 8件目 (全8件中)
  • このトピックに返信するにはログインが必要です。