This is a tutorial for WordPress users who are adding Facebook thumbnail support for the first time or can’t get Facebook to show an image when sharing.
In this concise guide, you’ll learn:
- How Facebook finds Featured Images in your posts
- How to properly implement Facebook thumbnail support
- How to debug Facebook thumbnails when they don’t work.
How does Facebook know which image to use?
Facebook uses something called Open Graph protocol. In short, it’s a standardized way to add information to your page about your page.
For instance, Open Graph elements on your page can tell Facebook what the title is, the URL, and the image to show when shared on Facebook. Here’s what the Open Graph tags on a recent blog post on Compete Themes look like:
You can see all the Open Graph tags that begin with “og:”. Check out that “og:image” tag in particular. That is precisely how you tell Facebook which image to use as the thumbnail when the page is shared.
So, all you need is a way to add an Open Graph image tag to your posts that will automatically use your Featured Image. Luckily, there’s a great plugin that does it for you.
Ready to learn WordPress? Conquer WordPress in the next hour with WP101's video tutorials. Start Learning Now.
How to add Open Graph tags to your site
Before I tell you which plugin to use, you might already have one installed.
Using Yoast SEO
Are you using the Yoast SEO plugin? If so, all you need to do is navigate to the Social settings menu (SEO > Social). Then, click on the Facebook tab at the top, and check off the Add Open Graph meta data box.
Remember the image I shared above of the Open Graph tags? Those came from Yoast SEO. All you need to do is check off the box above, and they’ll be added automatically.
Using Facebook Thumb Fixer
If you don’t use Yoast SEO, you can use the Facebook Thumb Fixer plugin instead.
Facebook Thumb Fixer will add the necessary Open Graph tags to your page, and automatically use your Featured Image for the thumbnail image on Facebook. You can even set a default image for Facebook which is useful for any posts that don’t have a Featured Image.
Facebook isn’t showing a thumbnail!
If your Featured Images aren’t showing when you share your posts on Facebook, or if Facebook is using the wrong thumbnail, try this simple trick:
First, visit the Facebook debugger (you’ll need an FB account to access it). Then, enter your URL and click the Debug button. Once the page reloads, click the “Fetch new scrape information” button on the right.
Facebook most likely cached a version of your page before you added the Open Graph data. For some reason, this seems to happen all the time.
Once you fetch new scrape information, Facebook will replace their cached version with a fresh scrape of the page containing the new Open Graph information. If you scroll down the debugger page, you will see the table populated with information about your page including the desired thumbnail image. Copy and paste your post URL into Facebook to confirm that the image is now showing.
That trick fixes the problem 99% of the time, so make sure to keep that in mind when FB isn’t displaying your image properly.
Getting Facebook to use your Featured Images in the thumbnails doesn’t need to be a pain. In fact, you may already have a plugin installed to add the necessary support.
Next time you have a problem with Facebook thumbnail images, don’t forget to check out the debugger and re-scrape the page for a new thumbnail.