CODEWITHSUNDEEP
phpwordpress
Pruteanu Alexandru
Pruteanu Alexandru

Reputation: 33

Can't Display Image in wordpress

I try to add images in a columns using Advanced Custom Fields but the images doesn't display. But it displays the url of the images.

<div class="container">
    <?php if( have_rows('columns-1-services') ): ?>
    <div class="row">
        <?php while(have_rows('columns-1-services')):the_row(); {
            $image_1 = get_sub_field("images-1");
            $image_2 = get_sub_field("images-2");
            $image_3 = get_sub_field("images-3");
            $image_4 = get_sub_field("images-4");
        } ?>
        <div class="col-md-3 services"><?php echo "$image_1"; ?></div>
        <div class="col-md-3 services"><?php echo "$image_2"; ?></div>
        <div class="col-md-3 services"><?php echo "$image_3"; ?></div>
        <div class="col-md-3 services"><?php echo "$image_4"; ?></div>
        <?php endwhile; ?>
    </div>  
    <?php
        else :
        // no rows found
        endif;?>

</div>

Upvotes: 0

Views: 44

Answers (1)

Sephsekla
Sephsekla

Reputation: 441

As LucasNesk has said, the get_sub_field("image") function is returning a url rather than a full img tag.

Rather than using the url in a tag, I would recommend changing the field in settings to return the ID, and then using WordPress functions to output the image tag. That way you can easily use a thumbnail size and WP handles a responsive srcset for you.

From https://www.advancedcustomfields.com/resources/image/#template-usage

<?php 

$image = get_field('image');
$size = 'full'; // (thumbnail, medium, large, full or custom size)

if( $image ) {

    echo wp_get_attachment_image( $image, $size );

}

?>

Upvotes: 2

Related Questions