How to Add Featured Image Support to a WordPress Theme

How to Add Featured Image Support to a WordPress Theme

WordPress themes makes it possible to give your users control of many aspects of their site’s designs.

One of the most common design features in themes are featured images. Many bloggers love to use large, high-quality images for their posts.

In this tutorial, we will show you how to add featured image support in a custom WordPress theme.


Step #1. Add featured image setting in the dashboard

Edit your theme’s functions.php file and add the code below:

{codecitation php}function mytheme_post_thumbnails() {
add_theme_support( ‘post-thumbnails’ );
}
add_action( ‘after_setup_theme’, ‘mytheme_post_thumbnails’ );{/codecitation}

When you create or edit a post, the new setting will be displayed:

Featured Image Support to a WordPress Theme

Step #2. Display the featured image in single posts

Look for the theme file that renders individual posts on your site. Often this file is called single.php.

Inside the while() loop add this code:

{codecitation php}<?php
if( has_post_thumbnail() ):
echo get_the_post_thumbnail();
endif;
?>{/codecitation}

The code above checks whether an image exists for the post/page and then prints it with get_the_post_thumbnail() function.

After your new code is integrated into the loop, it would look similar to this:

{codecitation php}<?php
while ( have_posts() ) : the_post();

if( has_post_thumbnail() ):
echo get_the_post_thumbnail();
endif;

endwhile;
?>{/codecitation}


Step #3. Check the end result

  • Create or edit a post.
  • Add a featured image.
  • Preview the changes:
Featured Image Support to a WordPress Theme

Summary

Hopefully this helps you. A stylish Featured Image really helps improve any WordPress post.

Any questions, please feel free to ask in the comments …

Author

  • Valentin Garcia

    Valentin discovered Joomla in 2010, and since then he has considered it as the best CMS. Valentin has been coding extensions and templates for Joomla for many years and truly enjoys helping people build their own websites with Open Source tools. He lives in San Julián, Jalisco, México.

0 0 votes
Article Rating
Subscribe
Notify of
14 Comments
Oldest
Newest
Inline Feedbacks
View all comments
Nicolasfa
8 years ago

WooCommerce website
Hi I bought a template and would like an advise for what would be the best way to upload 185 small short MP4 videos to the woocomerce website. [url=http://www.myjewelryforever.com]www.myjewelryforever.com[/url]

Mohammad reza Hajianpour
Mohammad reza Hajianpour
7 years ago

Worked like a charm! Thanks!

Mr Curious
Mr Curious
5 years ago

What if you don’t want the Featured Image to display on YOUR site, but instead you want it to be displayed on outbounds links FROM your site?

David
David
4 years ago

Thank you so much. Perfect explanation. Just what I need 🙂

Azhar
Azhar
4 years ago

worked like charm 🙂 thanks

AmecuxDEV
AmecuxDEV
4 years ago

Works for me, thank you so much

eu@eu.com
eu@eu.com
4 years ago

Hey dude u saved my day tnk!

Fracchie
Fracchie
3 years ago

cool. thank you 😉

Sam
Sam
3 years ago

thanks a lot

Jorge
Jorge
3 years ago

Thank you so so much! This was incredible

Paul Burton
Paul Burton
3 years ago

Hi this is great although it is displaying the image above the blog title instead of below it

[url=https://www.consciousconn3ctions.co.uk/iq-eq-sq-and-an-orange/]example post[/url]

I am using the twenty seventeen theme not sure if there is another file to edit, the single.php 

looks like this

aditi
aditi
2 years ago

not work

Spongedemus
Spongedemus
2 years ago

Thanks bro. This helped with my custom theme.

DZ
DZ
2 years ago

Didn’t work for me. Is there any difference in how this works currently (in 2022)?

14
0
Would love your thoughts, please comment.x
()
x