Select Page

The Featured Image, or post thumbnail, is a key part of a WordPress post. It can appear in various places on your website, such as the home page, category pages, and single post pages. Adding a class to the featured image allows you to style it with CSS to match the rest of your website’s design. In this article, we’ll show you how to add a class to the featured image in WordPress.

Here’s the code that you can use to add a class to your post thumbnail/featured images:

if ( has_post_thumbnail() ) { 
	the_post_thumbnail('medium', array('class' => 'my-custom-thumbnail-class'));

The code snippet checks if the post has a featured image. If it does, it outputs the featured image with a medium size and adds the “my-custom-thumbnail-class” class. This class can then be used to style the featured image with CSS.

Here’s an example:

.my-custom-thumbnail-class {
	border: 1px solid #333;

This will make the featured image have a border of #333 and a slightly transparent background.

The_post_thumbnail() is a function that will display the featured image. The first argument is the size of the image. The second argument is an array that contains the class that we want to add to the featured image. The class is called my-custom-thumbnail-class.
Add this code to wherever you want to display a featured image. For example, in the loop. You will want to replace all previous instances of the_post_thumbnail() with the new code.