Show featured image inside post using Shortcode in WordPress

Sometimes you may want to insert the post’s featured image inside a post.

One way is to simply add an image to the post and select the image which is set as the featured image. This way, if you change the featured image then you have to change the inserted image again.

The other way would be to use a shortcode which displays the featured image of that current post. So even if you change the featured image, the shortcode reflects it.

Method 1 – Creating a Shortcode using PHP

If you are familiar with PHP and if you are aware of how WordPress API works, then you can write a simple shortcode which will display the featured image.

Even if you are not familiar with code, if you have tried code snippets like the below then you can use the below approach.

You can copy the code below and paste it into WordPress. There are multiple methods to insert code snippets in WordPress.

add_shortcode('featured_image', 'my_post_featured_img');

function my_post_featured_img($atts) {
    global $post;

    return '<img src="' . get_the_post_thumbnail($post->ID) . '" />';
}

Here, we have registered a shortcode of the name “featured_image” using WordPress’s shortcode API.

When the shortcode is executed, it will call the function my_post_featured_img. This function contains the shortcode logic.

Inside the function, we are using an inbuilt WordPress function get_the_post_thumbnail to fetch the post’s thumbnail given a post ID. It will return the URL of the featured image.

With this URL, we are building the HTML image tag and returning it back as shortcode content.

Now you can use the shortcode [featured_image] inside the post.

Method 2 – Using the Shortcoder Plugin

Shortcoder is a free WordPress plugin to create custom shortcodes for HTML, CSS, and JavaScript code snippets directly inside the admin dashboard.

You can install the plugin, create a shortcode with a name, and set a code snippet as shortcode content. This shortcode content will be replaced where the shortcode is used.

It provides a feature to insert some “dynamic parameters” like post title, URL, and feature image URL inside the shortcode content.

We can use this feature to create a shortcode which will display the featured image.

Image tag set as content for the shortcode with URL attribute being the placeholder for the featured image
Image tag set as content for the shortcode with URL attribute being the placeholder for the featured image

Create a shortcode with a name. Example: featured_image

Type the empty image tag as shortcode content.

For the image tag’s source attribute set the value Insert shortcode parameters” > “WordPress information” > “Post featured image”

Similarly, for the image tag’s alt attribute, you can set the custom parameter for the post title.

Once you publish, the shortcode created is [sc name="featured_image"][/sc]

We can now use this shortcode inside posts. Later if you decide to add some HTML or CSS class then you can edit the shortcode content easily.

Conclusion

In this article, we explored two ways to create a shortcode to display a featured image. Hope this was something new to you.

Please do share any comments below and follow us on Twitter or Facebook for more content like this.

Subscribe for updates

Get updates on the WordPress plugins, tips and tricks to enhance your WordPress experience. No spam. View newsletter

Add your comment No Comments so far