Can’t Seem To Fix Incorrect Facebook Thumbnail Images? Here’s How.

In recent weeks, the District Maven team has fielded several questions about sharing on Facebook -- namely, how to fix incorrect thumbnail images when sharing a link from your website. This is understandably annoying, but an easy fix nonetheless.

For those of you who are working with a WordPress website, read on. For those working with a different content management system, read this.

In recent weeks, the District Maven team has fielded several questions about sharing on Facebook -- namely, how to fix incorrect thumbnail images when sharing a link from your website. This isn't very pleasant, but an easy fix nonetheless.

For those of you who are working with a WordPress website, read on. For those working with a different content management system, read this.


Image

Why Does This Happen?

There are a few reasons why Facebook’s META crawlers would pull the wrong image when sharing a link. First of all, unless a featured image is chosen for a given page, Facebook will pull your favicon instead. (Most of those that asked about this found that their logo was showing up instead of any of the pictures actually on the page.) Conversely, this also happens because multiple images are set in the og:Image tag and the featured image is rendered as smaller than the other images.

Other common reasons why Facebook displays the incorrect image include:

  • Missing META tags for an image.
  • Aggressive caching plugins.
  • CDN conflicts.

A few reasons why Facebook’s META crawlers would pull the wrong image when sharing a link. First of all, unless a featured image is chosen for a given page, Facebook will pull your favicon instead. (Most of those who asked about this found that their logo showed up instead of any of the pictures actually on the page.) Conversely, this also happens because multiple images are set in the og: Image tag, and the featured image are rendered smaller than the other images.

Other common reasons why Facebook displays the incorrect image include:

  • Missing META tags for an image.
  • Aggressive caching plugins.
  • CDN conflicts.

 

How To Fix Facebook Thumbnails When Sharing A WordPress Link

Step One

If you haven’t already, download and install plugins such as All In One SEO or Yoast SEO. Both of these will add the correct Open Graph (og) tags that Facebook uses to your site. (Since these two plugins power many of the essential on-page optimization features websites need to rank in the search results, either one of these are worth a download anyways.)

For the purposes of this guide, we’re going to use the All In One SEO plugin since that’s the one we use on the District Maven website.

If you haven’t already, download and install plugins such as All In One SEO or Yoast SEO. Both of these will add the correct Open Graph (og) tags that Facebook uses to your site. (Since these two plugins power many of the essential on-page optimization features websites need to rank in the search results, either one of these is worth a download anyway.)

For this guide, we’re going to use the All In One SEO plugin since that’s the one we use on the District Maven website.

Step Two

After installing the plugin, go to your Wordpress dashboard and hover over the “All In One SEO” tab on the left-hand side of the screen in the darkly color toolbar. When a submenu appears, choose the “Feature Manager” option.

After installing the plugin, go to your WordPress dashboard and hover over the “All In One SEO” tab on the screen's left-hand side in the darkly color toolbar. When a submenu appears, choose the “Feature Manager” option.


Image

Step Three

Once the page loads, click the blue “Activate” button underneath the Social Media headline. This will activate a new feature on your backend page and post editor.

Once the page loads, click the blue “Activate” button underneath the Social Media headline. This will activate a new feature on your backend page and post editor.

Step Four

Go to the page or post you want to add a thumbnail to and press “Edit Post” so you can adjust the settings in the backend WordPress editor.

Go to the page or post you want to add a thumbnail to and press “Edit Post” so you can adjust the settings in the backend WordPress editor.

Step Five

Then, scroll down the page to the widget for “All In One SEO.” There should be a new tab now available called “Social Settings.” Click that and you will see a new set of menu options.

Then, scroll down the page to the widget for “All In One SEO.” There should be a new tab now available called “Social Settings.” Click that, and you will see a new set of menu options.


Image

Step Six

Here, you have the option of choosing designated META information for Facebook to index for that specific page or post. You can either choose one of the automatically populated images displayed on the screen, choose one from your Media Library or upload a new one. To be on the safe side, it’s a good idea to copy and paste your desired image’s URL into the space provided underneath the blue “Upload Image” button.

Here, you have the option of choosing designated META information for Facebook to the index for that specific page or post. You can either select one of the automatically populated images displayed on the screen, choose one from your Media Library, or upload a new one. It’s a good idea to copy and paste your desired image’s URL into the space provided underneath the blue “Upload Image” button to be on the safe side.

Step Seven

Use the next two spaces that follow to enter your desired image width and height in pixels. When finished, press save.

Use the next two spaces that follow to enter your desired image width and height in pixels. When finished, press save.

Step Eight

Clear your cache on WordPress. (Yes, that means your entire browsing history.) Afterward, you also have to reset the cache in Facebook too. The easiest way to do that is with their nifty Debugger Tool.

Clear your cache on WordPress. (Yes, that means your entire browsing history.) Afterward, you also have to reset the cache in Facebook too. The easiest way to do that is with their nifty Debugger Tool.


Image

Step Nine

Visit the link above and enter the URL of the page or post you want to share on Facebook and press "Debug." The tool will then populate data about the link, including the "Link Preview," which includes the thumbnail currently set for that webpage. It will also tell you the last time Facebook scrapped that URL at the top of the page. Hit the "Scrape Again" button to clear the cache. (Below is an example from District Maven client, Brother's Brother Foundation.)

Visit the aforementioned link and enter the URL of the page or post that you want to share on Facebook and press “Debug.” The tool will then populate data about the link, including the “Link Preview” which includes the thumbnail currently set for that webpage. It also will tell you the last time that Facebook scrapped that URL at the top of the page. Hit the “Scrape Again" button to clear the cache. (Below is an example from District Maven client, Brother’s Brother Foundation.)

Image

Step Ten

When the page reloads, you should see your newly chosen image as the thumbnail picture in the “Link Preview” section of the page. Simple as that!

When the page reloads, you should see your newly chosen image as the thumbnail picture in the “Link Preview” section of the page. Simple as that!




Image

about us

For over a decade, District Maven has worked with businesses across the country to establish a formidable and profitable brand online. This is a responsibility that we take very seriously. Regardless of the industry or client, trust, respect and integrity are at the heart of every relationship we maintain -- and we wouldn't have it any other way.

Latest on instagram



Recent Projects

Load More

Request A Quote


Contact BasicsStep 1 of 3