Displaying Wordpress category images with category - php

Question

I have this bit of code:
<div class="wrap sc-cat-container">
<?php
$customPostTaxonomies = get_object_taxonomies('short_courses');
if(count($customPostTaxonomies) > 0)
{
foreach($customPostTaxonomies as $tax)
{
$args = array(
'orderby' => 'name',
'show_count' => 0,
'pad_counts' => 0,
'hierarchical' => 1,
'taxonomy' => $tax,
'title_li' => '',
'hide_empty' => FALSE
);
$categories = get_categories( $args );
foreach ( $categories as $category ) {
echo '
<div class="one-half sc-cat-items">
<h2>
' . $category->name . '
</h2>
</div>';
}
}
}
?>
</div>
This displays a list of categories for my custom post type 'Short Courses' Here's how it looks currently: http://staging.seedcreativeacademy.co.uk/short-courses/
This is great and works fine but I would also like to add images for my categories, I it to look like this:
I have Advanced Custom Fields, where I have created an image field so I can now assign an image to each category. So far so good!
The main problem comes when I try and display the image inside the code above...
Here's the code that would display the image in any normal circumstance:
<img src="<?php the_field('course_type_image'); ?>">
But I guess I need to add it to the above code... so I came up with this but it isn't working as I don't t think I can put a php tag inside another PHP tag!?
<div class="wrap sc-cat-container">
<?php
$customPostTaxonomies = get_object_taxonomies('short_courses');
if(count($customPostTaxonomies) > 0)
{
foreach($customPostTaxonomies as $tax)
{
$args = array(
'orderby' => 'name',
'show_count' => 0,
'pad_counts' => 0,
'hierarchical' => 1,
'taxonomy' => $tax,
'title_li' => '',
'hide_empty' => FALSE
);
$categories = get_categories( $args );
foreach ( $categories as $category ) {
echo '
<div class="one-half sc-cat-items">
<img src="<?php the_field('course_type_image'); ?>">
<h2>
' . $category->name . '
</h2>
</div>';
}
}
}
?>
</div>
So I'm a bit confused...

Answer 1

You are attempting to echo a string, but within your string, you are calling a function that itself echos rather then returns, a string:
echo '
<div class="one-half sc-cat-items">
<img src="<?php the_field('course_type_image'); ?>">
<h2>
<a href="' . get_category_link( $category->term_id )
. '">' . $category->name . '</a>
</h2>
</div>';
Therefore, when trying to call the function the_field() within your string to be echo'd, it is attempting to echo again.
You need to return the value of the field instead, with the get_field() function.
Also, remove the php tags in the img source line, since you are already within an opening <?php tag:
'<img src="' . get_field('course_type_image') . '">'