Answer
Rishadan on reddit gave a simple answer to this question. I’m finding the WHY out at the moment but the answer is the $website_image = get_field('website_image') variable needs to be defined in the while loop. Then you can access the arrays different properties like so echo $website_image['url']. If you want to create the variable outside of the loop, you would need to provide a post_id parameter.
Problem
Cannot access values of array in an Image Object from Advanced Custom Fields
Expected Result
Should be able to access URL and ALT specifically, but would like to know how to access the rest
MAIN
I have a section on a site I’m working on where I want to be able to create an indefinite amount of content for that area. So I bring in Advanced Custom Fields and create a Custom Post Type, write my loop, and now I’m stuck.
I’m not very familiar with PHP to be completely honest, I’m kind of learning as I go. So I understand that with images, ACF can return an image object and you can easily access any of the keys using bracket notation ie.
<?php
$website_image = get_field('website_image');
?>
<img src="<?php echo $website_image['url']; ?>" alt="<?php $website_image['alt']; ?>">
This is just an extremely simple example, but if you uploaded and image to a custom field with a type of image, you could display the image like this. It seems that when returning an Image Object from ACF and using it in a Custom Post Type, this method does not work
<?php
// Notice the use of the_field() instead of get_field()
$website_image = the_field('website_image');
?>
<img src="<?php echo $website_image['url']; ?>" alt="<?php $website_image['alt']; ?>">
I realize that I can just simply use the image as a Featured Image and be done with this, but I would really like to figure this out in case I were to ever need to add multiple images to a single post type.
ACF > Portfolio Site Images
Field Label: Website Image
Field Name: website_image
Field Type: Image
Return Value: Image Object
Custom Post Type > Portfolio Sites
Post Type Slug: portfolio_sites
Plural Label: Portfolio Sites
Singular Label: Portfolio Site
content-portfolio.php
<?php
$portfolio_header = get_field('portfolio_header');
$website_image = the_field('website_image');
?>
<a name="portfolio"></a>
<section id="home-portfolio-section" class="container-fluid">
<header class="row mb-5 pt-5">
<h2 class="h1">
<?php echo $portfolio_header; ?>
</h2>
</header> <!-- row -->
<article class="row text-center">
<div class="col-12">
<div class="row">
<?php
$loop = new WP_QUERY(
[
'post_type' => 'portfolio_sites',
'order' => 'ASC',
'orderby' => 'ID'
]
);
if ($loop->have_posts()) :
while ($loop->have_posts()) : $loop->the_post();
?>
<div class="col-12 mb-5 col-md-6">
// This next line is the problem
<img src="<?php the_field('website_image'); ?>" alt="">
</div>
<?php
endwhile;
wp_reset_postdata();
endif;
?>
</div>
</div>
</article>
</section>
Failed Attempts
echo the_field('website_image') returns a list of the arrays values
46,
,
testservert-xs,
,
,
image/png,
http://localhost/wptest/wp-content/uploads/2017/11/testservert-xs.png,
575,
264,
Array
If I attempt a var_dump($website_image) where $website_image = the_field('website_image') it returns NULL
A var_dump($website_image) where $website_image = get_field('website_image') returns bool(false)