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

Gabriel Ward
Gabriel Ward
20,222 Points

content image not displaying

I have a custom post type named newsletter that I'm trying to display images on. The page is all hooked up correctly, all captions and everything are displaying. The problem is that instead of the image displaying the alt attribute text for the image is displaying.

Here are my page and content templates

page-newsletter.php

<?php
/**
 * Template Name: Newsletter Page
 */

get_header(); ?>

    <div id="primary" class="content-area">
        <div id="content" class="site-content" role="main">

            <?php /* The loop */ ?>
            <?php while ( have_posts() ) : the_post(); ?>

                <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
                    <header class="entry-header">
                        <?php if ( has_post_thumbnail() && ! post_password_required() ) : ?>
                        <div class="entry-thumbnail">
                            <?php the_post_thumbnail(); ?>
                        </div>
                        <?php endif; ?>

                        <h1 class="entry-title"><?php the_title(); ?></h1>
                    </header><!-- .entry-header -->

                    <div class="entry-content">
                        <?php the_content(); ?>
                        <?php wp_link_pages( array( 'before' => '<div class="page-links"><span class="page-links-title">' . __( 'Pages:', 'twentythirteen' ) . '</span>', 'after' => '</div>', 'link_before' => '<span>', 'link_after' => '</span>' ) ); ?>
                    </div><!-- .entry-content -->

                    <footer class="entry-meta">
                        <?php edit_post_link( __( 'Edit', 'twentythirteen' ), '<span class="edit-link">', '</span>' ); ?>
                    </footer><!-- .entry-meta -->
                </article><!-- #post -->

                <?php //comments_template(); ?>
            <?php endwhile; ?>

                <?php 
                $args = array(
                    'post_type' => 'newsletter',
                    'orderby' => 'title',
                    'order' => 'ASC'
                );
                $the_query = new WP_Query( $args );         
            ?>
            <?php if ( have_posts() ) : while ( $the_query->have_posts() ) : $the_query->the_post(); ?> 

            <?php get_template_part( 'content', 'newsletter' ); ?>

            <?php endwhile; endif; ?>

        </div><!-- #content -->
    </div><!-- #primary -->

<?php get_sidebar(); ?>
<?php get_footer(); ?>

content-newsletter.php

<?php
/**
 * Template for displaying newsletter custom post type entries
 */
?>  


<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
    <header class="entry-header">

        <!-- <h1 class="entry-title art-title"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h1> -->

        <div class="art-meta">
            <!-- <p>Price: $<?php the_field('price'); ?></p> -->
        </div><!-- .entry-meta -->

    </header><!-- .entry-header -->

    <div class="entry-content">

        <p><img src="<?php the_field('image'); ?>" alt="Example image of <?php the_title(); ?>"></p>
        <p class="art-description"><?php the_field('description'); ?></p>

    </div><!-- .entry-content -->   

</article><!-- #post -->

Any help is much appreciated.

Gabriel Ward
Gabriel Ward
20,222 Points

Hi Rich,

Thanks again for your time. Unfortunately I that doesn't seem to be the problem. I've got the field name, label, and type all set to image. Everything seems to be working fine apart from this. All of the posts are showing up on the correct page, I can tell from the fact that the iamge alt attributes are showing, as well as the descriptions. Right now, I'm baffled.

Gabriel Ward
Gabriel Ward
20,222 Points

Also I already have a custom post type set up displaying exactly how I want, with images. I want to have another page display the same, but with different images. I went to the field setup for the correctly displaying post type and added and 'or' rule to display the other post type. The two are 'art' and 'newsletter'. 'art' is displaying but 'newsletter' isn't.

Hi Gabe,

Can you let me know the field type you've selected please?

-Rich

Gabriel Ward
Gabriel Ward
20,222 Points

The field type is image. This is really bizarre, I can't work it out.

Hi Gabe,

What option did you choose as the return value?

-Rich

Gabriel Ward
Gabriel Ward
20,222 Points

Hi Rich,

It was image object, now I've changed it to image url. That seems to have been the problem. You're a saint.

Just another aside, did you find you had a steep learning curve when you started learning PHP and Javascript? Or were you a natural?

Hi Gabe,

A lot of the logic is similar so that helped. The more I worked on it the easier it became.

-Rich

Gabriel Ward
Gabriel Ward
20,222 Points

Ok great. I sometimes find myself concerned that I'm too reliant on watching the solution videos for tutorial challenges. I'm thinking specifically here of Javascript. Do you think this is a sign I"m not much of a programmer? Or do you think it's all good and as I'm just learning still that's not a problem?

1 Answer

Hi Gabe,

I think this will be to do with the field type chosen and I've answered this one here.

Hope that helps :)

-Rich