Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

WordPress WordPress Theme Development Custom Post Type Templates in WordPress The Portfolio Single Page

Posted by Ben Goldman
Ben Goldman
14,626 Points

Problem with custom post type images and the_field()

I'm working back through the WordPress Theme Development course, and, this time, I'm having some difficulty with getting my images to appear on my single-customname.php page. I have the custom post type set up to take a featured image, which then links to another page with an image and text area. The featured image shows up. When I click the link, it goes to the target page, but only displays the text content. It looks like the image database info is displayed, rather than the actual image. 

32, , PictureName, Picture, , image/jpeg, http://localhost/wordtest.com/wp-content/uploads/2015/02/IMG_5491.jpg, 1042, 1744, Array

Here is the code for my page.

<?php get_header(); ?>

<section>
    <div>
       <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
        <div class="primary">

            <?php the_field('images'); ?>       

        </div>

        <div>
            <h1><?php the_title(); ?></h1>
            <p><?php the_field('description'); ?></p>

            <hr>

            <p>
                <?php previous_post_link(); ?> -
                <a href="<?php bloginfo('url'); ?>/portfolio">Back to Main Page</a> - 
                <?php next_post_link(); ?>
            </p>
        </div>

        <?php endwhile; endif; ?>
    </div>
 </section>

<?php get_footer(); ?>

I am working on a Mac and on localhost/MAMP.

Thanks for taking a look!

Ben Goldman
Ben Goldman
14,626 Points

I should also add that I am using the Custom Post Type UI and Adv Custom Fields plugins. The CPT UI plugin recently had some problems related to an update. I have a public site that encountered errors while trying to load images for custom post pages. However, after flushing the permalinks, the problem was corrected. The behavior on my local site is different. Rather than images not showing, the DB data is loading instead. I tried the same fix, but it did not work for this site.

Ben Goldman
Ben Goldman
14,626 Points

I took out the option to display my images field as images. I reset it as WYSIWYG and the picture loaded. So that narrows it down a little. I am thinking it is probably a plugin issue.

2 Answers

Rich Bagley
Rich Bagley
25,869 Points
Rich Bagley
Rich Bagley
25,869 Points

Hi Ben,

Not sure if this is what you're looking for but it's how I tend to do it.

From the WP dashboard I select image object. Then the ACF Image page has example code under Basic display (Object) for how to include this in the front end of the site.

This will allow you to output things like alt and title too.

Hope that helps in some way :)

-Rich

Ben Goldman
Ben Goldman
14,626 Points

Thanks, Rich. I think it's a plugin in issue at this point. See my comment to Andrew.

Rich Bagley
Rich Bagley
25,869 Points

Hi Ben,

No problem, but I don't think it's a plugin issue.

You look to have Image Object selected under the Return Value option (which is fine) but your code will need to change to allow this.

What you're seeing is what's displayed if you just write it out as:

<?php the_field('images'); ?>

You'll need to change this to the example code from the link in the post above. I'm sure that will resolve your issue.

-Rich

Andrew Shook
Andrew Shook
31,709 Points
Andrew Shook
Andrew Shook
31,709 Points

Ben, I'm confused by your question. Could you post the name of the two post types you are using and the custom fields associated with each post type?

Ben Goldman
Ben Goldman
14,626 Points

Sorry. I guess that does sound pretty confusing. I believe what I'm looking at is an issue with the Advanced Custom Fields plugin. I am having problems loading images to my custom post page. Instead of an image, the database information gets printed out to the screen. (See first post for example) After playing around with settings in both plugins (Custom Post Type UI and Adv Custom Fields), I found that once I switched the image Field Type setting from "images" to "WYSIWYG", then the images were able to display. I am assuming there is a problem with the Advanced Custom Fields plugin. So I am going to try and contact the developer and see what t hey say. I will post here when I have more information.