Feature image option was only introduced in WordPress version 3.0 replacing post thumbnails of version 2.9.
Now, if you are like me who have a number of blogs set up prior to the introduction of the feature image option, what should you do?
Are you going to rake through your 1000 or more posts to manually (and painstakingly) add in an image to each of your posts?
Also, after you upload the feature image for each post, the image would stubbornly want to appear right on top of the post.
What if you don’t want the feature image to appear on top of the post?
Then you would need to google around to search for tutorials on how not to display the feature image, which means you would need to add custom CSS, adding scripts that you have no idea what it is for.
Solution to feature image using Thesis WordPress theme:
The Thesis theme is able to auto extract images in your blog posts to be a feature image. So you need not go through the painful process of going back to every single blog posts that you have written to manual load and define the feature image.
Note: It is out of the scope of this tutorial on how to ensure certain images is not being displayed. Also, if you are using thumbnails to display related post, removing the WordPress feature post portion may cause your thumbnails not to display correctly.
Turning off the WordPress Featured image option and using Thesis’s thumbnail option:
Note: By turning off the WordPress Featured Image option, the box will no longer appear in your Add New Post/Edit New Post function. So in case you need the featured image option, you know where to go back to enable it.
Go to your Dashboard> Thesis> Post/Page Output and then click to edit the page:
At the pop up box that is being displayed, unchecked the “WP featured image” box. Also make sure the following options are checked (with a tick √):
- Thesis post image (single, page, and landing page templates)
- Thesis thumbnail image (home template)
Then close the box and click on the green “Save Display Options”.
Now, I am only relying on Thesis to grab and display the correct image for me.
Note: You must ensure the image in your post meets the following criteria as outlined in Facebook sharing best practices (source):
4. Optimize images to generate great previews
Image Sizes
Use images that are at least 1200 x 630 pixels for the best display on high resolution devices. At the minimum, you should use images that are 600 x 315 pixels to display link page posts with larger images. Images can be up to 8MB in size.Small Images
If your image is smaller than 600 x 315 px, it will still display in the link page post, but the size will be much smaller.We’ve also redesigned link page posts so that the aspect ratio for images is the same across desktop and mobile News Feed. Try to keep your images as close to 1.91:1 aspect ratio as possible to display the full image in News Feed without any cropping.
Minimum Image Size
The minimum image size is 200 x 200 pixels. If you try to use an image smaller than this you will see an error in the Sharing Debugger.
So if the image size in the blog post is less than 200×200, it will not be displayed. Probably a truncated image of your header will be grabbed instead.
Sharing posts using Thesis wordpress themes:
For example, let’s say I am sharing this particular post found on this site: How it all began- my journey into the world of intranets
The post had a single image on it. I have never set the image as my featured image in the Edit Post function.
When I click to share on Facebook, I am able to see the image in my post being displayed on the Facebook share page:
If I do not use the upgraded version of Thesis, a truncated version of my site banner is being displayed and it is very ugly.
What you see above is the post and the image is displayed at the share button and after it gets posted to Facebook.
But the correct feature image is still not displaying. Instead it used the image from my banner!
Yikes, I have it happened to me many times before. If the particular post that is being shared does not have an image or the image does not meet the guidelines, then you get a possibly awful looking truncated version of your blog header.
This is not unique to Thesis users but to many site developers/owners/bloggers who try to seek out answers in the forums.
I have tried all sorts of ways….downloading the “Default featured image” plugin and assigning a default featured image should the post have no feature image. Initially, after I install, activated the plugin and assigned a default image to it, the default image appeared on every page of my site. Every. Single. Page ?.
In a separate post in future, I would write about how I managed to get the problem solved using my Thesis template (total lifesaver) as I would need time to come out with the screenshots.