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 From Bootstrap to WordPress Create Bootstrap Styled Theme Templates Creating a Portfolio Landing Page

Fernando Cortes
Fernando Cortes
2,435 Points
Posted by Fernando Cortes
Fernando Cortes
2,435 Points

Images won't resize after adding the echo $thumbnail_url code

After adding the code shown up to the 12min10sec mark or so, images are shown at full size and overlapping. Up to that point, I was seeing the exact same thing as shown in the video.

I have rechecked my code, compared it with the one in the project download file, and even copied and pasted the relevant block of code (the div containing the php to echo the images from the external url) into my file, but no changes.

Any ideas?? (Below, the code of that row as I have it now)

 <div class="row">

            <?php

             $args = array(
                'post_type' => 'portfolio'
             );
             $the_query = new WP_Query( $args);

            ?>

            <?php if(have_posts() ) : while($the_query->have_posts() ) : $the_query->the_post(); ?>

            <div class="col-sm-3 portfolio-piece">

                <?php
                        $thumbnail_id = get_post_thumbnail_id();
                        $thumbnail_url = wp_get_attachment_image_src( $thumbnail_id, 'thumbnail-size', true );
                ?>

                <p><img src="<?php echo $thumbnail_url[0]; ?>" alt="<?php the_title(); ?> graphic"></p>
                <h3><?php the_title(); ?></h3>

            </div>

            <?php endwhile; endif; ?>

    </div>
Sergey Vrenev
Sergey Vrenev
28,778 Points
Sergey Vrenev
Sergey Vrenev
28,778 Points

Maybe css problems ? Try to put css here

Fernando Cortes
Fernando Cortes
2,435 Points
Fernando Cortes
Fernando Cortes
2,435 Points

You were right, I'd missed the img tag in the .portfolio img {max-width: 100%;} rule. Thanks!