When you “share” a page on Facebook, you will – in most cases – have the range of various image thumbnails to choose from. More often than not, these thumbnails will be random, to say at least: banners from the sidebar, commenter’s Gravatar photos, etc. Obviously, you can always choose the best image, but will your readers do the same?
What is more, when a reader “likes” your article (which most users are more likely to do as that’s just so much easier), there will be no option to choose the thumbnail and your post will be placed on that user’s Facebook stream with an absolutely random and (in most cases) irrelevant image.
How much more interest could you great article result in if it *always* had a great and relevant thumbnail to go with the update?
Unlike Google Plus (which is much smarter at marking up the page and grabbing the most relevant information from the page), Facebook should be clearly “pointed” to what should make it to the update. Like it or not, it benefits you (in the first place) if you spend an effort to explain your page in a language Facebook understands.
For the lucky WordPress bloggers, there are a few plugins that will help you point Facebook to the best image to go in your Facebook “likers'” updates:
Contents
First Things First: Clear Facebook Cache!
If you try experimenting with different images as a thumbnail, you will instantly face a problem: Facebook page caching. Facebook would cache your page as soon as you (or anyone else) like it and will show you the same thumbnail each time (no matter which image you have in the meta tag).
Use this tool that clears Facebook cache of the page and creates a new one.
You can also use that tool to preview how Facebook “sees” your page before you even try to “like” it:
1. Custom Image SRC: the Simplest Option
All In One SEO is a handy plugin that lets you specify the image you want to be in the page preview on Facebook when anyone “likes” your post. The plugin works on the “Edit post” level:
Basically, the plugin adds the following code in the individual page <head> section:
<link rel=”image_src” href=”preview-image-here.jpg” />
With this code in the header, the random preview image is overridden by the image that you specify.
Let’s see if it works!
Here’s what the page we are “liking” on Facebook looks like:
Before activating the plugin:
(Absolutely random image from the sidebar is grabbed as the page thumbnail after someone likes your page)
After:
(The image *you* want is grabbed as the page preview):
2. Facebook: Open Graph Plugin
There’s another way to control your page Facebook “snippets”: WP Facebook Open Graph protocol which adds Facebook Meta information to your blog pages (the plugin requires your a Facebook User ID or App ID for it to work).
When it comes to generating the image preview, the plugin will:
- Try to use the page “featured” image;
- If you don’t have a “featured” image, it will pull the first image in the post/page content;
- If there are no images in the post, it will default to using the image you put into the plugin settings in the admin panel.
Besides, controlling the post thumbnails on Facebook, the plugin will also handle the proper title / description within the snippet on Facebook user’s wall:
Here’s the info the plugin has added to my post:
3. Also:
- It’s rather a speculation (but one I myself have seen evidence of), but Facebook seems to prefer .JPG images
- In order for the plugins above to work properly, make sure your image is self-hosted
- The image must be at least 50px by 50px and have a maximum aspect ratio of 3:1. Facebook will make it square if you don’t.
cc licensed ( BY SD ) flickr photo shared by joannapoe
Latest posts by Ann Smarty (see all)
- Semantic Research + AI = Win - May 15, 2023
- Visual Quotes. HOW TO: Quote Using Text-to-Image Tools (and Go Viral) - Aug 9, 2022
- Digital Marketing Tools: Best New SEO Software I Use - Apr 5, 2022
I sure wish I had found this last year Ann. I had a heck of a time with the images not pulling them from my blog.
I have a paid plug-in installed that is telling Facebook which image I want pulled and for some reason, today it’s not working at all. It won’t pull the image for nothing. So frustrating too because when people share my post I want the image to appear.
I’m going to share this post because I know other people who are having this same issue.
Thank you for sharing this, great post and I’m bookmarking this one because I KNOW I’ll run into this issue again in the future.
~Adrienne
This is great. I have never taken the time to look for this solution. Thanks so much for writing this Ann and thanks to Adrienne Smith for sharing it on Facebook.
I don’t believe i didn’t had search for this query. Never thought off! You did a fantastic job, seriously!
Great piece of information (as usual) Ann.
When one posts a link via their Facebook wall you do get to choose which image to display with the link. This would make it way easier!
Brilliant. This issue has been haunting me for a while. Every so often Facebook refuses to grab any image, but I read a hint that seems to work well: add the short code as your link when you post to Facebook. But that doesn’t solve the issue of random images appearing when you Like a page.
I’m off to try out these plugins. Thanks so much!
@Adrienne, thanks for the comment! Sometimes Facebook is really weird no matter what we do. I noticed it getting stubborn and refusing to use any images for some of my shares. No idea why!
@Sherryl, I am happy it could turn useful!
@S Emerson, yes, but how many readers would care to do that! Most of them are likelier to click “LIKE”
@Carolyn, gotta try your tip as well. THANKS!
This is good information to have. I can’t tell you how many times I’ve liked an article or link, just to have it show up next to an image of a random ad.
Every so often Facebook refuses to grab any image, but I read a hint that seems to work well.
The best plugin I’ve found for this is get_the_image(), combined with hard-coding the opengraph meta. The only issue is that this limits you to the first image in the post, but I think the lack of cognitive dissonance is key when clicking from one site to another. This also lets you use any location for your image and doesn’t require the image to be “Attached” to the post.
What’s great too is that G+ respects opengraph meta, so no need to mark up your code multiple times.
I worry about using so many plugins though for speed issues… why bleed speed when you can hardcode into the theme?
Great post …thank you for sharing. I agree with Sherryl that most probably have not taken the time to pursue such a thorough solution. Thank you for compiling and posting the info!
@Douglas, thanks for sharing the plugin!
Yes, Google Plus is much more flexible and smarter than Facebook. They would identify the best image without any markup.
And yes, good point on installing multiple plugins as well as overloading your pages with markup code!
Thanks for the Custom Image_Src plugin suggestion, Ann. That’s exactly what I was looking for 🙂
Good Share.I hope more people discover your blog because you really know what you’re talking about. Can’t wait to read more from you!
Thank you, thank you! The first one wasn’t useful for me because it only seems to work for Likes, but the second one, Open Graph Plugin, worked like a charm and forced the featured thumbnail on the user. Hurray.
And clearing Facebook cache… gosh I wish I had known about that one a year ago.
Great post and thanks for sharing about this excellent WP plugin.
Thanks Ann for the post. Facebook can be very stubborn when it comes to pulling the right images. This sorted it out for me.
Thanks again
THANK YOU!!!!! This had me going crazy. I used the Custom Image SRC plugin and it works like a charm!
Very nicely explained about Facebook post share with image selection option and wordpress plugins for it. Very helpful post and Thank you for sharing.
Thanks! I’ve been searching for this information for weeks! Now my website thumbnail looks great!
Sadly…. this didn’t work me. 🙁 FB is still grabbing the wrong images. Blah!!
It it happening for the old articles or new ones? Maybe try to debug?
Hi Ann,
Great blogpost.
Do you know if the plugin Custom Image SRC works with WP 4 / still works as it is not updated in 2 years. I got a security warning on the plugin page.
Robert!
Hey Robert, it is still installed on this site and it’s the recent WP version. So it does seem to work!
Thank Ann.
Good to hear.
i’m gonna install it!
Btw, i discovered that using the Yoast SEO plugin i can upload on the tab social media a picture to be shown on FB. And another one for twitter if you would like 😉
Works like a charm! Thanks so much for sharing this information. It was annoying the heck out of me when I went to share the link and some random image appears. It works well with Yoast SEO for the title and description…now I just need to figure out how to get my name removed, in the “by” part of the description.
Doesn’t seem to work for a blogspot?
or
I seem to be too naive for thing to work.
Thank you Ann, you save my day…
i wish you all the best to what you are doing..
That WordPress plugin is fantastic and I apply it to all of my clients’ websites.
I have been facing this problem ever since I started blogging. Thanks for this life saver posts!
what about other sites…not wordpress?
HI Ann,
The plugin you addressed – Custom Image_Src – is no longer supported and I could not get it to work. Any other recommended plugins that are current? Thanks!
Thanks for sharing this guide, I was facing the error of not fetching the perfect thumbnail. Now fixed. Everything working fine.
Thanks again
Thank you so much!! As a total newbie to WP, this was immensely helpful! I spent all day trying to work this out and read a ton of posts, yours was did the trick 🙂 Thanks again.
Hey, one question on this! I recently added the og meta image to our site, and it’s definitely improved the appearance of shares, especially for press releases and such with no image on the page. HOWEVER, I’m going to a lot of trouble to add optimized social images to each blog post, and now the meta image is completely overriding them. Do you know if a wordpress plugin will override the meta image? I’m stuck in a hybrid situation, where the blog articles will always have good images, and the rest of the site may not, so sometimes I want that meta image to pull in, but not if you can’t even choose one of the other images on the blog article (which is what seems to be happening).
Thank you for the FB website image preview update solution! Worked like a charm, been scratching my head all day trying to figure out why it was still showing my “Still under construction page” image! Now i need to figure why the Google search console / Google webmaster console still shows that. I hope it auto-resolved at some point. If you have suggestions please let me know.