how to get image url in advanced custom field wordpress post

Question

I have created a custom post type called "albums". I have 5 custom fields in my each post. 3 text fields, 1 image field and 1 file upload field. I'm getting 3 text values correctly in my template page. but I can't get the url part of image and file upload field. here is my code:

<?php

$posts = get_posts(array(
'post_type' => 'albums'
));

if($posts)
{
echo '<ul>';

foreach($posts as $post)
{
    echo '<li><a href="' . get_permalink($post->ID) . '">' . get_the_title($post->ID) . '</a></li>';
         the_field('album_category'); echo "<br>";
          the_field('album_name'); echo "<br>";
           the_field('slide_name'); echo "<br>";
            the_field('slide_description'); echo "<br>";
            the_field('audio_file'); echo "<br>";
}

echo '</ul>';
}

?>

this is my current output

Cuckoo-1
Birds
Cuckoo
66, , 2668245306_027a56fe50_b, , , image/jpeg, http://localhost/YIB/wordpress/wp-content/uploads/2016/03/2668245306_027a56fe50_b-1.jpg, 1024, 768, Array
sample sample sample sample sample sample sample
18, , eudynamys-scolopacea, , "eudynamys-scolopacea"., audio/mpeg, http://localhost/YIB/wordpress/wp-content/uploads/2016/03/eudynamys-scolopacea.mp3

Maninderpreet Singh · Answer 1 · 2016-03-02T07:02:48.920

1

Try this

    <?php
    $imgurl = get_field('slide_image',$post->ID);

    if (filter_var($imgurl, FILTER_VALIDATE_URL) === FALSE)
    {
      $imgurl = wp_get_attachment_url($imgurl);
    }
       echo '<img src="' . $imgurl . '" alt="image">';
    ?>

edited Mar 02 '16 at 07:02

answered Mar 02 '16 at 06:34

Maninderpreet Singh

2,569
2
17
31

try after remove if statement..is your image field return int value ? – Maninderpreet Singh Mar 02 '16 at 06:41
can u send me screenshot of field in admin setting? – Maninderpreet Singh Mar 02 '16 at 06:45

Prakash Rao · Accepted Answer · 2017-08-28T06:45:14.487

1

Try this.

Image field and file field is returning the array so

$image_m =  get_field('slide_description');
$image_a = get_field('audio_file');
echo '<pre>';
print_r($image_m);
print_r($image_a);
echo '</pre>';

Suppose you get the out put as

array(
 ['name'] => 'test';
 ['url'] => 'http://example.mp3';

)

then write <?php echo $image_m['url'];?> instead of <?php the_field('audio_file');?>

edited Aug 28 '17 at 06:45

answered Mar 02 '16 at 07:01

Prakash Rao

2,368
1
9
12

its working if we use get_field instead of get_the_field – Vadivel Murugan M Mar 02 '16 at 07:08

Alex Having Fun · Answer 3 · 2021-11-19T09:41:32.930

Custom fields for media such as image, video or files uploaded to the media library are saved as meta in the form of an array. You may try this simple function to extract URL value from the custom field's meta. This function goes through the array and return the URL meta value when it detects a valid URL in the meta value.

Add this function to your functions.php.

function get_post_asset_url($postid, $slug) {
  $meta_array = get_post_meta($postid, $slug, true);
  foreach ($meta_array as $meta) { 
    if (filter_var($meta, FILTER_VALIDATE_URL)){ return $meta; } 
  } 
}

In your template, call this function in an "echo" statement:

echo get_post_asset_url($post->ID, "your_asset_field_name");

So, for example on an image field:

<img src="<?php echo get_post_asset_url($post->ID, "image_field_1"); ?>" width="100" height="100">

score 0 · Answer 4 · answered Feb 21 '23 at 12:39

0

Verified and Tested Code:

<?php 

$image = get_field('instructor-image');

if( !empty($image) ): ?>

<img src="<?php echo $image['url']; ?>" alt="<?php echo $image['alt']; ?>" />

<?php endif; ?>

answered Feb 21 '23 at 12:39

Atif Tariq

2,650
27
34

how to get image url in advanced custom field wordpress post

4 Answers4