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 trialMonica Anderson
3,621 PointsI have a wordpress image not loading question
Hello, I am creating my first wordpress website www.monikaandersondesign.com/wordpressblog I watched two tutorials by Zac and am having trouble with my art page that lists my artwork. The artwork will not load. I am wondering if maybe the reason is because my template says Art and the php files say art. Thanks so much Monika
Monica Anderson
3,621 Pointsthey are in php files called art.php single-art.php and content-art.php but the code says "art" and I named my file "Art" would the fact that I have mine in upper case cause the issue. I tried to rename the file to art but I do not know how. It is a custom post I created and called "Art"
Luke Pettway
16,593 PointsCould you post a sample of the code? The title casing shouldn't matter at least not from what I gather. The posts seem to be loading so I think it is a simple syntax issue.
Monica Anderson
3,621 Pointshere is single-art.php file <?php
get_header(); ?>
<div id="primary" class="content-area">
<div id="content" class="site-content" role="main">
<?php get_template_part( 'content', 'art' ); ?>
</div><!-- #content -->
</div><!-- #primary -->
<?php get_sidebar(); ?> <?php get_footer(); ?>
Monica Anderson
3,621 PointsHere is content-art.php <?php /**
- Template for displaying art custom post type entries
*/
?>
<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>> <header class="entry-header">
<h1 class="entry-title"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h1>
<div class="entry-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><?php the_field('description'); ?></p>
</div><!-- .entry-content -->
</article><!-- #post -->
Monica Anderson
3,621 PointsHere is art.php <?php /**
- Template Name: Art 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' => 'art',
'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', 'art' ); ?>
<?php endwhile; endif; ?>
</div><!-- #content -->
</div><!-- #primary -->
<?php get_sidebar(); ?> <?php get_footer(); ?>
Luke Pettway
16,593 Points<p><img src="<?php the_field('image'); ?>" alt="Example image of <?php the_title(); ?>"></p>
You're pulling the image from ACF correct? How are you storing the image as a custom field? Are you storing it as an object or a url?
<?php
$image = get_field('image');
if( !empty($image) ): ?>
<img src="<?php echo $image['url']; ?>" alt="<?php echo $image['alt']; ?>" />
<?php endif; ?>
By default the above would be how you'd want to pull that info (assuming it was Object and not URL).
Monica Anderson
3,621 PointsSorry I just started learning wordpress on 2-10-16 so a lot of the terminology is new. What is ACF and where do I put this code - which page. Yes it is not a url I just uploaded the image and it is showing in the media library after I upload it.
Monica Anderson
3,621 PointsI created a custom post called art using CPT UI and custom fields widget so yes the image is placed in a custom field
Monica Anderson
3,621 PointsI did rename the custom field "art" instead of "Art" so it matches all the code in the php files but they still will not load...
Luke Pettway
16,593 PointsACF is a plugin "Advanced Custom Fields", so I'm guessing you probably aren't using ACF now (but check it out because it is awesome!). When you are adding images to those posts, how are you adding them? Are they the featured image, a field within the post, or in the editor portion of the post?
Monica Anderson
3,621 Pointsthanks they are a field in a custom post I created. I created a custom post and part of the custom post ask for you to upload an image. I followed this tutorial and followed it exactly like he instructed but my images will not load and I am not sure why.... Here is the tutorial thanks https://teamtreehouse.com/library/how-to-make-a-website-with-wordpress/custom-post-types-and-fields-in-wordpress/setting-up-custom-post-types-and-fields
Monica Anderson
3,621 PointsYes i did use advanced custom post fields
Luke Pettway
16,593 PointsOkay so you are in fact using Advanced Custom Fields. When he goes to the Custom Fields link in that video and then creates the new custom field for the image, at 2:16 you can see him select the Image URL for the return value. Is that what yours is set to?
Monica Anderson
3,621 PointsYes I did not do that! A simple little error like that wow. How did I miss that. So how do I correct this and check this box I am trying to edit it and it is not allowing me to?
Luke Pettway
16,593 PointsYou should be able to go back to the Custom Field, click on edit and then change the return value by clicking the radio button.
Monica Anderson
3,621 Pointsthanks it is working!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! I just have to reupload the pics thanks!!!!
Monica Anderson
3,621 PointsI want to give you the best answer but it won't let me I will try again in a little while thanks for your help
Luke Pettway
16,593 PointsGlad you got it working!
Luke Pettway
16,593 PointsYou can mark the answer I just added, that way people won't have to read the long reply chain here if they don't want to.
1 Answer
Luke Pettway
16,593 PointsSo for anyone else with a similar issue, make sure that your advanced custom field images are outputting in the correct format you are using. Use url unless you have a reason for needing the image object.
Luke Pettway
16,593 PointsLuke Pettway
16,593 PointsWhat is the code you are using for your image out?
<img src="" alt="Example image of Carnations Picture">
It looks like your images aren't loading their sources at all.