I am trying to display a page featured image. Every time I use the img tag,the text after the php code (" class="headshot" >) displays below the picture on the website. See picture screenshot of picture below

<div class="bio-picture">
    <img url="<?php the_post_thumbnail('full');?>" class="headshot">
</div>

I am trying to display a page featured image. Every time I use the img tag,the text after the php code (" class="headshot" >) displays below the picture on the website. See picture screenshot of picture below

<div class="bio-picture">
    <img url="<?php the_post_thumbnail('full');?>" class="headshot">
</div>

• php
• images

1 Answer 1

This is because the_post_thubmnail() outputs an <img> tag. So the result of your code will be something like this:

<div class="bio-picture">
    <img url="<img src="thumbnail/image/url.jpg" class="wp-post-image attachment-full">" class="headshot">
</div>

Your screenshot is how the browser has chosen to handle that broken HTML.

If you want to output the post thumbnail <img> with a custom class, use this:

<div class="bio-picture">
    <?php the_post_thumbnail( 'full', array( 'class' => 'headshot' ) );?>
</div>

Also, please note that the correct attribute for the img tag's URl is not url, it's src.