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 trialEric Ridolfi
19,417 PointsCustomizing the html of the uploaded images
I'm trying to change the html output of the custom field. I can't seem to figure out how this is accomplished.
Here is the code in my single-portfolio.php file:
<?php get_header(); ?>
<?php
$header_image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'full' );
?>
<!-- Content Wrapper -->
<div class="content-wrapper large-12 columns clearfix" data-equalizer-watch>
<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
<?php if (get_the_post_thumbnail()): ?>
<div id="content-header" style="background-image: url('<?php echo $header_image[0]; ?>');">
<h1><?php the_title(); ?></h1>
</div>
<?php endif; ?>
<div id="content">
<?php if (get_the_post_thumbnail() == TRUE ): ?>
<h1 class="hide-title"><?php the_title(); ?></h1>
<?php else: ?>
<h1><?php the_title(); ?></h1>
<?php endif; ?>
<?php the_field('description'); ?>
</div>
<!-- End Content -->
<aside id="sidebar_right">
<h4>Sidebar</h4>
<img src="<?php $image_url; ?>">
<ul class="content_gallery">
<?php
$args = array(
'post_type' => 'attachment',
'numberposts' => -1,
'post_status' => null,
'post_parent' => $post->ID
);
$attachments = get_posts( $args );
if ( $attachments ) {
foreach ( $attachments as $attachment ) {
$image_src = wp_get_attachment_url( $attachment->ID);
echo '<li>';
echo '<a class="th" href="' . $image_src . '">';
echo '<img src="' . $image_src . '">';
echo '</a>';
echo '</li>';
}
}
?>
</ul>
</aside>
<?php endwhile; endif; ?>
<?php get_footer(); ?>
Here is the HTML that I need output in the sidebar:
<aside id="sidebar_right">
<ul class="content_gallery clearing-thumbs" data-clearing>
<li><a class="th" href="img/checkered_past_postcard_large.jpg"><img src="img/checkered_past_postcard.jpg" alt=" "></a></li>
<li><a class="th" href="img/postcard_final_back.jpg"><img src="img/checkered_past_postcard_back.jpg" alt=" "></a></li>
</ul>
</aside>
1 Answer
Tom Bedford
15,645 PointsHi Eric
With the JPG images check the file extension on them - is it lowercase or uppercase?
i.e. .jpg
or .JPG
?
I've had problems with uppercase file extensions on some hosting and had to change the extensions to lowercase.
If that doesn't help then is there a big difference in file size with the image that work and those that don't?
Eric Ridolfi
19,417 PointsHi Tom,
The extensions are all lowercase.
Recently I deleted all of the portfolio entries and the images that went with them, making sure the uploads directory was empty of images and started over. It seems to be working now. I am not sure why though.
Thanks for the help!
Eric Ridolfi
19,417 PointsEric Ridolfi
19,417 PointsI noticed something interesting and I am not sure why this is happening, but I did print_r with the attachments array and when I have jpg uploaded, the array is empty. However, if I upload png then the array returns the information that I need. I didn't set the mime type in the $args variable. I am a little confused.
Edit:
So, some of the jpg files do work and some don't. This is very confusing.