Support

Account

Home Forums Front-end Issues Display taxonomy image in WP_Query

Solved

Display taxonomy image in WP_Query

  • Hello, hopefully someone can help me cause I’m having a little headache here. I am working with ACF Theme Code Pro and the provided code I think works only on an archive page (?). I am just trying to output an image field put on a taxonomy inside a WP_Query. Is the below code should be working considering that I need to replace “NULL” with something else or should it be inside a forEach? Thanks a lot!

    <?php 
    					
    // Acf Taxonomy Fields
    $taxonomy_prefix = 'category';
    $term_id = NULL;
    $term_id_prefixed = $taxonomy_prefix .'_'. $term_id;
    $image = get_field( 'logo_image', $term_id_prefixed );
    
    // args
    $args = array(
      'order'       => 'DESC',
      'orderby'     => 'date',
      'posts_per_page'	=> -1,
      'post_type'		=> 'post',
    );
    
    // query
    $posts_query = new WP_Query( $args );
    
    ?>
    <?php if( $posts_query->have_posts() ): ?>
      <?php while ( $posts_query->have_posts() ) : $posts_query->the_post(); ?>
      
      <div class="swiper-slide">
        <a href="<?php the_permalink(); ?>" class="c-card-article">
          <div class="c-card-article__img mb-15">
            <div class="c-card-article__overlay">
              <i class="icon-arrow-right"></i>
              <div><?php _e('Plus de détails', 'credo'); ?></div>
            </div>
    
            <?php if ( $image ) : ?>
              <img src="<?php echo esc_url( $image['url'] ); ?>" alt="<?php echo esc_attr( $image['alt'] ); ?>" class="c-card-article__cat">
            <?php endif; ?>
        
            <?php the_post_thumbnail( 'large', array( 'class' => 'u-w-100' ) ); ?>
          </div>
          <p><?php the_title(); ?></p>
        </a>
      </div>		
    
      <?php endwhile; ?>
    <?php endif; ?>
    
    <?php wp_reset_postdata(); ?>
  • To get the category of the current post you need to do this using wp_get_post_terms() inside of your post loop.

    
    $terms = get_post_terms();
    

    This returns an array that you loop over to get the images for each term, https://www.advancedcustomfields.com/resources/adding-fields-taxonomy-term/

    
    foreach ($terms as $term) {
      $image = get_field('logo_image', $term);
    }
    
  • Hey John, thanks for you answer. I tried but it results in nothing. My posts are well associated with a category and those categories have a “logo_image” in place. I think i’m dumb AF or it’s just because i’m a frontend guy, can you help me out a little bit more? You’d be my xmas angel! <3

    <?php 
    
    $terms = wp_get_post_terms();
    
    // args
    $args = array(
      'order'       => 'DESC',
      'orderby'     => 'date',
      'posts_per_page'	=> -1,
      'post_type'		=> 'post',
    );
    
    // query
    $posts_query = new WP_Query( $args );
    
    ?>
    <?php if( $posts_query->have_posts() ): ?>
      <?php while ( $posts_query->have_posts() ) : $posts_query->the_post(); ?>
      
      <div class="swiper-slide">
        <a href="<?php the_permalink(); ?>" class="c-card-article">
          <div class="c-card-article__img mb-15">
            <div class="c-card-article__overlay">
              <i class="icon-arrow-right"></i>
              <div><?php _e('Plus de détails', 'credo'); ?></div>
            </div>
    
            <?php 
              foreach ($terms as $term) {
                $image = get_field('logo_image', $term);
              }									
            ?>
    
            <?php the_post_thumbnail( 'large', array( 'class' => 'u-w-100' ) ); ?>
          </div>
          <p><?php the_title(); ?></p>
        </a>
      </div>		
    
      <?php endwhile; ?>
    <?php endif; ?>
    
    <?php wp_reset_postdata(); ?>
  • Finally solved, here’s the final code for anyone interested. Will sleep less dumb tonight! Thank you very much John!

    <?php 
    
    // args
    $args = array(
      'order'       => 'DESC',
      'orderby'     => 'date',
      'posts_per_page'	=> -1,
      'post_type'		=> 'post',
    );
    
    // query
    $posts_query = new WP_Query( $args );
    
    ?>
    <?php if( $posts_query->have_posts() ): ?>
      <?php while ( $posts_query->have_posts() ) : $posts_query->the_post(); ?>
      
      <div class="swiper-slide">
        <a href="<?php the_permalink(); ?>" class="c-card-article">
          <div class="c-card-article__img mb-15">
            <div class="c-card-article__overlay">
              <i class="icon-arrow-right"></i>
              <div><?php _e('Plus de détails', 'credo'); ?></div>
            </div>
    
            <?php $terms = wp_get_post_terms($post->ID, 'category');  foreach ($terms as $term) : $image = get_field('logo_image', $term); ?>
              <img src="<?php echo esc_url( $image['url'] ); ?>" class="c-card-article__cat" />
            <?php endforeach; ?>
        
            <?php the_post_thumbnail( 'large', array( 'class' => 'u-w-100' ) ); ?>
          </div>
          <p><?php the_title(); ?></p>
        </a>
      </div>		
    
      <?php endwhile; ?>
    <?php endif; ?>
    
    <?php wp_reset_postdata(); ?>
Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.