How to Add Post Thumbnails as Background in WordPress

Featured images are also known as post thumbnails are a popular feature in WordPress themes. Today most WordPress photography themes, restaurant themes, church themes, and other types of themes have built-in support for post thumbnails. In this article, we will show you how to add featured images or post thumbnails as background in WordPress.

Featured Images or Post Thumbnails is a theme feature. Most themes such as Genesis and others support featured images by default.

An easy way to figure out whether your theme supports featured images is by going to the post editor. Simply create a new post and scroll down a little to see if there is a meta box called featured images on the right-hand side of the screen.

If you wanna to add the post thumbnail as background, the best way to be fixed is defined well below.

Sometimes the post thumbnails are in different sizes in order to make all in the same size without any problem. Just give a div class then put paste your thumbnail php code inside that then give some style.

The problem here is the_post_thumbnail() doesn’t return image url but the img tag.

You can use this code

$url = wp_get_attachment_url( get_post_thumbnail_id($post->ID) );
echo '<li class="produkt" style="background: url('. $url.')">';

We hope that this article helped you learn how to add featured images or post thumbnails in WordPress.

Tags: , , , ,


Agha Murtaza is a web designer and WordPress developer with over one year of experience. You can visit his business site here . Murtaza is the CEO of He also has an opinion on just about every subject. You can follow his rants on Twitter @murtaxa_n.