The concept of “featured image” came into existence in the WordPress version 2.9 and since then it has been embraced by webmasters when it comes to make their posts more appealing and engaging. WordPress featured image has become a common practice among bloggers as they give visitors reasons to stick around a website and read its content. This is a common feature of magazine style or news website where images are frequently used with text snippets instead of the actual post.
Using featured images makes it easy for users to associate images with posts or pages. They have a lot of potential for both bloggers as well as for those who want to utilize WordPress in an unconventional manner. Using a thumbnail view of a post provides better opportunities for a post to gain attention and thus clicked by the user to explore it further. The featured-image functionality is based on the same rule. Creating thumbnails for every post on a website give users a glimpse of what the post is all about and encourage them to read it.
How Multiple Featured-images Come Into Existence
However, despite of all the benefits provided by featured-images, there are some areas where they fail to provide as much control as webmasters want especially when they have other images in the post which also need to be displayed. This is specially evident in the typical WordPress set up, when the user proceeds to add a featured-image for a specific post, and the same image also gets displayed within the post, above the content. However, the main problem arises when the same image also gets displayed over the larger area of the post. This results in image distortions, thus making the post look ugly.
Another issue which influenced webmasters to make the most out of the multiple featured-image is when they have to display the featured-image on the slider. WordPress site provides you facility to display featured-image on the slider but the problem sneaks in when the image isn’t set with the right dimensions, making the post look completely disorganized. It is worth noticing that the sliders have different dimensions than the standard post thumbnails. So, the chosen image for a square-shaped thumbnails will look completely disfigured when viewed on the rectangular slider because image aspect ratios are entirely different. This could either leave some space blank, or make your featured-image looked slightly cropped. Again, multiple featured-image is the only solution.
To cope up with the above mentioned challenges, separate featured images on the thumbnail as well as within the content can be provided. For this there is a plugins solution available known as Multiple Post Thumbnails which helps you accomplish your task of adding multiple featured images in the manner most effective and efficient.
It’s a very handy plugin which seamlessly adds multiple thumbnails to a post. The plugin lets you assign multiple featured-images to a post or page. It’s also very easy to use, all you need is simply install the plugin, add some code into theme functions.php file, and then replace the code in your theme’s template file where you want to display the second featured-image.
All the steps are explained below.
1. Download and install Multiple Post Thumbnails plugin
2. Now, the below mentioned code should be added to theme functions.php file.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15
<?php /* Add secondary thumbnail (featured image) in posts */ $thumb = new MultiPostThumbnails( array( 'label' => 'Secondary Image', 'id' => 'secondary-image', 'post_type' => 'post' ) ); ?>
3. In the next step it is recommended to add a custom thumbnail size, so that the featured-images of the future posts will get resized automatically. To do this, again assess your functions.php file and add the following code to it.
<?php add_image_size('post-secondary-image-thumbnail', 250, 150); ?>
4. Continuing with the above step, you can now add a secondary featured image to your post. For this, simply insert the following code in your post.php file.
1 2 3 4 5
<?php if (class_exists('MultiPostThumbnails') && MultiPostThumbnails::has_post_thumbnail('post', 'secondary-image')) : MultiPostThumbnails::the_post_thumbnail('post', 'secondary-image', NULL, 'post-secondary-image-thumbnail'); endif; ?>
Additionally, you can choose to pass a parameter with arguments such as class or title. For this, the following line should be added as a parameter in the above line just like this:
array('class' => '', 'title' => '', 'alt' => '');
You are almost done. Now, on the admin side, just below the “Featured image” box, you can see a meta box appearing with a name as “secondary image”. You can use this meta box for adding secondary post thumbnails just like you use the featured-image box.
To Sum Up
Well there you have it all. To conclude it can be said that featured-image is one of the most powerful tools introduced in WordPress. It’s an ideal solution to make your content appear elegant and catching. Hopefully, you find the tutorial helpful and will surely use it for future reference.