Support

Account

Register Login

Home › Forums › General Issues › Get term ACF Image Field

Solved

Get term ACF Image Field

  • I have code to load the last 6 terms and only use terms without children so I get the months and not the years which are both part of the same Taxonomy as terms. I can already load the titles as links, but I am trying to load the attached ACF image field which I am failing to do.

    I use $summaryimage = get_field('summary_preview_image'); inside this block.php file to then use it for wp_get_attachment_image( $summaryimage, $size ). But it seems that the variable is not loading anything and so my term image is not being loaded. Question is why this is not working inside wp-content/themes/theme/blocks/spotlight/block.php I am guessing cause I perhaps need to indicate more in the get_field request to grab the image from the specific group which is used to attach a custom filed to the term.. But how?

    $args = array( 'hide_empty=0', 
                'childless'     => 1, 
                'number'        => 6,
                'orderby'       => 'ID', 
                'order'         => 'ASC'
                ); 

$terms = get_terms( 'molecules_of_the_month', $args );
if ( ! empty( $terms )   ) :
    $summaryimage = get_field('summary_preview_image');
    print_r($summaryimage);
    $size = 'full'; // (thumbnail, medium, large, full or custom size)
    $count = count( $terms );
    $i = 0;
    $term_list = '<p class="molecule-of-the-month">';
    ?>
    <div id="<?php echo esc_attr($id); ?>" class="<?php echo esc_attr($className); ?>">
        <div class="slider mobile-slider splide" data-splide='{ "type" : "loop", "perPage": "3", "arrows": 0, "breakpoints": { "99999": { "destroy": 1 }, "767": { "perPage": "1" } } }'>
            <div class="splide__track">
                <ul class="post-grid splide__list">
                    <?php 
                    if($term_list):
                        foreach ( $terms as $term ) {
                            $i++;
                            $term_list .= '<a href="' . esc_url( get_term_link( $term ) ) . '" alt="' . esc_attr( sprintf( __( 'View all post filed under %s', 'drughunter' ), 
                            $term->name ) ) . '">' . $term->name . '</a><figure class="post-featured-image">' . 
                            wp_get_attachment_image( $summaryimage, $size )
                            . '</figure>';
                            
                            if ( $count != $i ) {
                                $term_list .= ' &middot; ';
                            }
                            else {
                                $term_list .= '
';
                            }
                        }
                        echo $term_list;

                    endif; ?>
                </ul>
            </div>
        </div>
    </div>
<?php endif;?>

  • Did try

    $terms = get_terms( 'molecules_of_the_month', $args );
if ( ! empty( $terms )   ) :
    $termid = get_queried_object()->term_id;
    print_r($termid);
    $summaryimage = get_field('summary_preview_image', $termid);
    // print_r($summaryimage);
    $size = 'full'; // (thumbnail, medium, large, full or custom size)
    $count = count( $terms );

    but also do not get the term id . Perhaps I need to do another query on top, not sure yet…

  • Would the get field not need the taxonomy name? As per the docs

    For example:
    $summaryimage = get_field('summary_preview_image', 'tax_name_'.$termid);

    Assuming the image is assigned to the taxonomy.

  • Thanks for the feedback @jarvis . When I Use this updated code:

    $terms = get_terms( 'molecules_of_the_month', $args );
if ( ! empty( $terms )   ) :
    $termid = get_queried_object()->term_id;
    var_dump($termid);
    $summaryimage = get_field('summary_preview_image', 'tax_name_'.$termid);
    // print_r($summaryimage);
    $size = 'full'; // (thumbnail, medium, large, full or custom size)
    $count = count( $terms );
    $i = 0;
    $term_list = '<p class="molecule-of-the-month">';
    ?>

    does however not work … yet either. The var_dump shows me string(0) “”. So besides me not specifying the taxonomy (month here though acf group with field preview_image is attached to term month and year) something else is still needed I think.

  • Try changing tax_name to your actual taxonomy, does that work?

  • I tried

    <?php $args = array( 'hide_empty=0', 
                'childless'     => 1, 
                'number'        => 6,
                'orderby'       => 'ID', 
                'order'         => 'ASC'
                ); 

$terms = get_terms( 'molecules_of_the_month', $args );
if ( ! empty( $terms )   ) :
    // $termid = get_queried_object()->term_id;
    // var_dump($termid);
    $summaryimage = get_field('summary_preview_image', 'tax_name_', 'molecules_of_the_month');
    // print_r($summaryimage);
    $size = 'full'; // (thumbnail, medium, large, full or custom size)
    $count = count( $terms );
    $i = 0;
    $term_list = '<p class="molecule-of-the-month">';
    ?>
    <div id="<?php echo esc_attr($id); ?>" class="<?php echo esc_attr($className); ?>">
        <div class="slider mobile-slider splide" data-splide='{ "type" : "loop", "perPage": "3", "arrows": 0, "breakpoints": { "99999": { "destroy": 1 }, "767": { "perPage": "1" } } }'>
            <div class="splide__track">
                <ul class="post-grid splide__list">
                    <?php 
                    if($term_list):
                        foreach ( $terms as $term ) {
                            $i++;
                            $term_list .= '<a href="' . esc_url( get_term_link( $term ) ) . '" alt="' . esc_attr( sprintf( __( 'View all post filed under %s', 'theme' ), 
                            $term->name ) ) . '">' . $term->name . '</a><figure class="post-featured-image">' . 
                            wp_get_attachment_image( $summaryimage, $size )
                            . '</figure>';
                            
                            if ( $count != $i ) {
                                $term_list .= ' &middot; ';
                            }
                            else {
                                $term_list .= '</p>';
                            }
                        }
                        echo $term_list;

                    endif; ?>
                </ul>
            </div>
        </div>
    </div>
<?php endif;?>

    and the var_dump for summary_image is NULL. Do not get it. And the ACF field is there:

    if( function_exists('acf_add_local_field_group') ):

acf_add_local_field_group(array(
	'key' => 'group_612651d5d04ad',
	'title' => 'Molecule Archive Fields',
	'fields' => array(
		array(
			'key' => 'field_6126521430c38',
			'label' => 'Slide Deck',
			'name' => 'slide_deck',
			'type' => 'file',
			'instructions' => '',
			'required' => 0,
			'conditional_logic' => 0,
			'wrapper' => array(
				'width' => '',
				'class' => '',
				'id' => '',
			),
			'return_format' => 'array',
			'library' => 'all',
			'min_size' => '',
			'max_size' => '',
			'mime_types' => '',
		),
		array(
			'key' => 'field_6126525730c39',
			'label' => 'Slide Deck Preview Image',
			'name' => 'preview_image',
			'type' => 'image',
			'instructions' => '',
			'required' => 0,
			'conditional_logic' => 0,
			'wrapper' => array(
				'width' => '',
				'class' => '',
				'id' => '',
			),
			'return_format' => 'id',
			'preview_size' => 'medium',
			'library' => 'all',
			'min_width' => '',
			'min_height' => '',
			'min_size' => '',
			'max_width' => '',
			'max_height' => '',
			'max_size' => '',
			'mime_types' => '',
		),
		array(
			'key' => 'field_6131b9c9bedc9',
			'label' => 'Summary',
			'name' => 'summary',
			'type' => 'file',
			'instructions' => '',
			'required' => 0,
			'conditional_logic' => 0,
			'wrapper' => array(
				'width' => '',
				'class' => '',
				'id' => '',
			),
			'return_format' => 'array',
			'library' => 'all',
			'min_size' => '',
			'max_size' => '',
			'mime_types' => '',
		),
		array(
			'key' => 'field_6131b9e1bedca',
			'label' => 'Summary Preview Image',
			'name' => 'summary_preview_image',
			'type' => 'image',
			'instructions' => '',
			'required' => 0,
			'conditional_logic' => 0,
			'wrapper' => array(
				'width' => '',
				'class' => '',
				'id' => '',
			),
			'return_format' => 'id',
			'preview_size' => 'medium',
			'library' => 'all',
			'min_width' => '',
			'min_height' => '',
			'min_size' => '',
			'max_width' => '',
			'max_height' => '',
			'max_size' => '',
			'mime_types' => '',
		),
	),
	'location' => array(
		array(
			array(
				'param' => 'taxonomy',
				'operator' => '==',
				'value' => 'molecules_of_the_month',
			),
		),
		array(
			array(
				'param' => 'taxonomy',
				'operator' => '==',
				'value' => 'molecules_of_the_year',
			),
		),
	),
	'menu_order' => 0,
	'position' => 'normal',
	'style' => 'default',
	'label_placement' => 'top',
	'instruction_placement' => 'label',
	'hide_on_screen' => '',
	'active' => true,
	'description' => '',
));

endif;
  • <?php if( $molecules_of_the_month = get_terms( array( 'taxonomy' => 'molecules_of_the_month' ) ) ) :
foreach( $molecules_of_the_month as $month ) : 
	$summaryimage  = get_field('summary_preview_image', 'term_' .$month->term_id  );?>
	<?php print_r($summaryimage);?>
<?php endforeach;      
endif;
?>

    Try that on its own, if it works, integrate it into your code

  • @jarvis I used your code with foreach loops:

    <div id="<?php echo esc_attr($id); ?>" class="<?php echo esc_attr($className); ?>">
        <div class="slider mobile-slider splide" data-splide='{ "type" : "loop", "perPage": "3", "arrows": 0, "breakpoints": { "99999": { "destroy": 1 }, "767": { "perPage": "1" } } }'>
            <div class="splide__track">
                <ul class="post-grid splide__list">
                    <?php 
                    if( $molecules_of_the_month = get_terms( array( 'taxonomy' => 'molecules_of_the_month' ) ) ) :
                        foreach( $molecules_of_the_month as $month ) : 
                            $summaryimage  = get_field('summary_preview_image', 'term_' .$month->term_id  );
                            $size = 'full'; // (thumbnail, medium, large, full or custom size)
                            print_r($summaryimage);
                            // $molecules_of_the_month .= '<a href="' . esc_url( get_term_link( $month ) ) . '" alt="' . esc_attr( sprintf( __( 'View all post filed under %s', 'theme' ), 
                            // $month->name ) ) . '">' . $month->name . '</a><figure class="post-featured-image">' . 
                            // wp_get_attachment_image( $summaryimage, $size ) . '</figure>';
                        endforeach;
                    endif; ?>
                </ul>
            </div>
        </div>
    </div>

    and I know get 328235043514 or this using var_dump

    NULL int(3282) bool(false) bool(false) bool(false) int(3504) int(3514) bool(false) NULL bool(false) bool(false) bool(false) bool(false) bool(false) bool(false) bool(false) bool(false) bool(false) bool(false) bool(false)

    so I am getting something now. So I guess I needed to load the image in the foreach loop. But I also see you used:

    <?php $summaryimage = get_field('summary_preview_image', 'term_' .$month->term_id );?>

    with term_ .$month->term_id which I am clearly not familiar enough with. Besides understanding this better I also need to load the image url so guess I do not want ID numbers only. How would I do that?

  • @jarvis I used your code with foreach loops:

    <div id="<?php echo esc_attr($id); ?>" class="<?php echo esc_attr($className); ?>">
        <div class="slider mobile-slider splide" data-splide='{ "type" : "loop", "perPage": "3", "arrows": 0, "breakpoints": { "99999": { "destroy": 1 }, "767": { "perPage": "1" } } }'>
            <div class="splide__track">
                <ul class="post-grid splide__list">
                    <?php 
                    if( $molecules_of_the_month = get_terms( array( 'taxonomy' => 'molecules_of_the_month' ) ) ) :
                        foreach( $molecules_of_the_month as $month ) : 
                            $summaryimage  = get_field('summary_preview_image', 'term_' .$month->term_id  );
                            $size = 'full'; // (thumbnail, medium, large, full or custom size)
                            print_r($summaryimage);
                            // $molecules_of_the_month .= '<a href="' . esc_url( get_term_link( $month ) ) . '" alt="' . esc_attr( sprintf( __( 'View all post filed under %s', 'theme' ), 
                            // $month->name ) ) . '">' . $month->name . '</a><figure class="post-featured-image">' . 
                            // wp_get_attachment_image( $summaryimage, $size ) . '</figure>';
                        endforeach;
                    endif; ?>
                </ul>
            </div>
        </div>
    </div>

    and I know get 328235043514 or this using var_dump

    NULL int(3282) bool(false) bool(false) bool(false) int(3504) int(3514) bool(false) NULL bool(false) bool(false) bool(false) bool(false) bool(false) bool(false) bool(false) bool(false) bool(false) bool(false) bool(false)

    so I am getting something now. So I guess I needed to load the image in the foreach loop. But I also see you used:

    <?php $summaryimage = get_field('summary_preview_image', 'term_' .$month->term_id );?>

    with term_ .$month->term_id which I am clearly not familiar enough with. Besides understanding this better I also need to load the image url so guess I do not want ID numbers only. How would I do that?

    NB had to post this 3 times to make it stick on the forum

  • Okay, using this code

    <div id="<?php echo esc_attr($id); ?>" class="<?php echo esc_attr($className); ?>">
  <div class="slider mobile-slider splide" data-splide='{ "type" : "loop", "perPage": "3", "arrows": 0, "breakpoints": { "99999": { "destroy": 1 }, "767": { "perPage": "1" } } }'>
    <div class="splide__track">
        <ul class="post-grid splide__list">
            <?php 
            if( $molecules_of_the_month = get_terms( array( 'taxonomy' => 'molecules_of_the_month', $args ) ) ) :
                foreach( $molecules_of_the_month as $month ) : 
                    $summaryimage  = get_field('summary_preview_image', 'term_' .$month->term_id  ); // field, id and format value
                    // $summaryimage = get_field('summary_preview_image', 'term_name_', 'molecules_of_the_month'); // NULL++
                    $size = 'full'; // (thumbnail, medium, large, full or custom size)
                    // var_dump($summaryimage);
                    echo '<a href="' . esc_url( get_term_link( $month ) ) . '" alt="' . esc_attr( sprintf( __( 'View all post filed under %s', 'drughunter' ), $month->name) ) . '">' 
                    . $month->name . '</a>';
                endforeach;
            endif; ?>
        </ul>
    </div>
  </div>
</div>

    I have the summaryimage loading ids but not in use yet as I need image url. This so I can load the image, title and short description and link it all.

    I also can still load term links using this loop and an echo so that is fine. But need to work out loading image first.

    Furthermore I need to include the $args I had before. Not sure how with current setup. Doing some trials still.

  • Wait, echo wp_get_attachment_image( $summaryimage, $size ); does seem to try to load images now like:

    <img width="1191" height="1684" src="https://site.test/wp-content/uploads/2021/10/2021-MOTM-Aug.png" class="attachment-full size-full" alt="" loading="lazy" srcset="https://site.test/wp-content/uploads/2021/10/2021-MOTM-Aug.png 1191w, https://site.test/wp-content/uploads/2021/10/2021-MOTM-Aug-212x300.png 212w, https://site.test/wp-content/uploads/2021/10/2021-MOTM-Aug-724x1024.png 724w, https://site.test/wp-content/uploads/2021/10/2021-MOTM-Aug-768x1086.png 768w, https://site.test/wp-content/uploads/2021/10/2021-MOTM-Aug-1086x1536.png 1086w" sizes="(max-width: 1191px) 100vw, 1191px">

    so I am making progress and thanks to you @jarvis . Thanks a lot so far.

    Now I just need to add proper html, include $args, load part of text or excerpt and then I will be done.

  • Seems that I need to use WP_Query to loads arguments 

    $args = array( 'hide_empty=0', 
                'childless'     => 1, 
                'number'        => 6,
                'orderby'       => 'ID', 
                'order'         => 'ASC'
                );

    if I want to use these in get_terms. See https://developer.wordpress.org/reference/classes/wp_term_query/get_terms/#user-contributed-notes

    example:

    <ul>
<?php 
$args = array(
    'taxonomy'               => 'category',
    'orderby'                => 'name',
    'order'                  => 'ASC',
    'hide_empty'             => false,
);
$the_query = new WP_Term_Query($args);
foreach($the_query->get_terms() as $term){ 
?>
    <li><?php echo $term->name." (".$term->count.")"; ?></li>
<?php
}
?>
</ul>

    Will look into that.

  • Had to use

    <?php 
$args = array( 'hide_empty=0', 
        'taxonomy'      => 'molecules_of_the_month',
        'childless'     => 1, 
        'number'        => 6,
        'orderby'       => 'ID', 
        'order'         => 'ASC'
        ); 
$the_query = new WP_Term_Query($args);
foreach($the_query->get_terms() as $term) :
// foreach( $molecules_of_the_month as $month ) : ?>
    <!-- Post Content goes here -->
    <li class="post-grid-post splide__slide">
        <?php
        $summaryimage  = get_field('summary_preview_image', 'term_' .$term->term_id  ); // field, id and format value

    to make it work. Well, that seems to make most of what I want do. Need to limit description, tweak html to work on mobile. But will work well soon.

Viewing 13 posts - 1 through 13 (of 13 total)

You must be logged in to reply to this topic.