Connect with us

Easy Ways to Fix Facebook Incorrect Thumbnail Issue

solution

Easy Ways to Fix Facebook Incorrect Thumbnail Issue

When sharing your post on Facebook especially the content with images, you like to use an image as a thumbnail. This is one of the best ways of attracting visitors and engaging your audiences with your post. But, what happens when the Facebook incorrect thumbnail issue arise on your Facebook Post? Yes, I know this will make you feel depressed.

So, we are here to guide you how to fix the Facebook thumbnail image problems in WordPress. Look through the article to get the best solution to solve the Facebook image thumbnail issue in WordPress.

How Facebook pick a Thumbnail Image?

First, you should understand the Facebook behavior. It gives you plenty of choices to deal with the Facebook incorrect thumbnail issue.

When you share your post or page link on Facebook, it scans the website’s header for an ‘Open Graph’ tags for the information about post’s thumbnail image. The Open Graph for the image in the header looks almost like this.

Firstly, Facebook search for the image with least 600 pixels wide from the ‘Open Graph’ data. If it could not find the image with this specification then, it will go back and takes the first image from Open Graph tag which is the featured image we specified for the WordPress post.

Reasons for Facebook Thumbnail issue in WordPress

Many reasons can restrict the Facebook from guessing the right thumbnail image correctly. Knowing the reasons clearly will make you solve your problem easily. Therefore, go through all the possible reasons for the cause of WordPress site Facebook thumbnail problem.

Reason 1: Associating Open Graphs tag for all the images

Usually, Facebook checks for ‘Open Graph tags’ to pick an image as a thumbnail. Here one of the reasons for Facebook incorrect thumbnail issue may be that your post is having many images and these all are set under the tag og: image. This will create confusion for Facebook in picking a thumbnail. Due to this, Facebook either stops displaying the thumbnail or displays all the images randomly. This will lead to the ‘Facebook showing wrong thumbnail image’ issue.

Reason 2: The size of the Featured image

One of those many reasons is the size of the image you are planning to associate with your content. If the Featured image is smaller in size then the facebook fails to choose the featured image as a thumbnail. This will cause the Facebook thumbnail issue.

Reason 3: Cache plugins

If the Cache plugins you may use in your WordPress site would not support thumbnails then also this thumbnail error will arise.

Reason 4: CDN conflicts

CDN (Content Delivery Network) conflicts can also prevent on Facebook from picking right thumbnail.

Reason 5: Missing META Tag

Missing a meta tag associated with the image that you are planning to set as thumbnail will cause Facebook incorrect thumbnail issue.

Fixing Facebook Incorrect Thumbnail Issue

Fixing ‘Facebook post thumbnail issue’ is not a big issue. As you have known the root cause of the problem, it is very easy to solve the facebook thumbnail issue. Here we provided the possible reasons to wrong thumbnail issue. So, go through the solutions and fix the Missing thumbnail issue easily.

Related:  Update URLs When Moving a WordPress Site

Solution 1: Put SDK JS in Header

First of all, try to add the SDK javascript which is generated for your site immediately after creating the Facebook application from your WordPress. Copy that code and paste in your header.php file.
NOTE: It is better to avoid making changes to any of the php files through the dashboard for security reasons.
  1. Log in to your Website Dashboard and search for Appearance.
  2. Select Editor.
  3. Now, you can see all the php files on your right-hand-side as shown in the figure.

You can also access the header.php file with the FTP login. Once you log in, go to file manager and click on it to open. Now, select the wp-content folder and find themes folder in it. Under this folder, you can find the header.php file. Give a right-click on it and select edit file and add SDK JS.

If you have already done this, there is no need to do it again.

Solution 2: Remove Facebook Page Link From WordPress SEO

Another possible solution to fix ‘Facebook post thumbnail issue’ is to remove Facebook page link from WordPress SEO.

  1. Go to your WordPress site admin.
  2. Access your dashboard to find SEO options.
  3. Select Social.
  4. Delete your Facebook page link and save changes.
  5. Now, check your site by a Facebook debugger.

Hopefully, this method will help you to fix Facebook thumbnail problems for WordPress site.

Solution 3: Uploading Images Manually

If your page is static and you do not use the relevant plugin which assigns the og: image tags automatically for each and every page, then you need to change the og: image manually for each of your pages.

Note: The most frequently recommended resolution for an OG image is 1200 pixels x 627 pixels, i.e., (1.91/1 ratio). With this size, your thumbnail will be big among all other images crowd but just do not exceed the 5MB size limit.

It is the easiest way to add the thumbnail image for the post in Facebook manually. To do this process, you have to Login to your Facebook account.

Now, find your site name under the pages category. Click on it to enter into your site page.

You will find a box saying ‘Add something’. Add your page or post URL there.

Now you can see a small square box with a dotted outline with ‘+’ symbol inside it.

Click on it to add the image which you kept selected for the Facebook thumbnail.

Finally, click on Publish to share your post or page on your Facebook wall.

The image you uploaded will stay in the ‘photos’ page of your Facebook. If you don’t want that on the photos page then, You can always delete it from there without worrying about the thumbnail. Whether you have the image or not in the photos page, the thumbnail image will remain irrespective of the presence of the image from which it originated.

Related:  Best Responsive Fitness WordPress Themes

However, this solution does not affect other users i.e. When others share your post or page. The people whoever shared your post or page, they need to manually upload the image as well, and this would not happen at all.

Solution 4: adding  filters in our functions.php

It is simply a straightforward process to add the required meta tags. Before that, we need to allow ‘Facebook markup’ process in our opening HTML tags. For this, copy the following code to accomplish this.

1add_filter('language_attributes', 'add_og_xml_ns');
2function add_og_xml_ns($content) {
3return ' xmlns:og="http://ogp.me/ns#" ' . $content;
4}
5
6add_filter('language_attributes', 'add_fb_xml_ns');
7function add_fb_xml_ns($content) {
8return ' xmlns:fb="https://www.facebook.com/2008/fbml" ' . $content;
9}

Now, we can add the Open Graph meta tags just like regular meta tags. You can use WordPress Template Tags to fill them in. Here is an example:

1<meta property="og:title" content="<?php the_title(); ?>"/>
2<meta property="og:description" content="<?php echo strip_tags(get_the_excerpt($post->ID)); ?>" />
3<meta property="og:url" content="<?php the_permalink(); ?>"/>
4<?php $fb_image = wp_get_attachment_image_src(get_post_thumbnail_id( get_the_ID() ), 'thumbnail'); ?>
5<?php if ($fb_image) : ?>
6    <meta property="og:image" content="<?php echo $fb_image[0]; ?>" />
7<?php endif; ?>
8<meta property="og:type" content="<?php if (is_single() || is_page()) { echo "article"; } else { echo "website";} ?>"
9/>
10<meta property="og:site_name" content="<?php bloginfo('name'); ?>"/>

Solution 5: Use WordPress SEO by Yoast plugin

If you want to avoid manipulating your theme files, use the relevant WordPress plugins like WordPress SEO by Yoast to automatically add Open Graph tags to your site to prevent Facebook incorrect thumbnail issue.

This will make easy to add the image. To select your Facebook thumbnail image, Go to the Yoast SEO section which is at the bottom of your WordPress editor.

Click on the Share icon.

You will get a window section with Facebook post details as shown in the figure. Click on Upload image to set your thumbnail image to Facebook.

Now you will be directed to your site media page and you will see a pop-up window to upload the image. Click on upload Files option.

You will be asked to select the required file from your folder.

Now select the thumbnail image from folder and click on use image.

Now you will get your image address or URL in the upload image field

Conclusion:

Even though we make the best effort to tell Facebook about the images which are associated with a post or page, the Facebook’s system will also analyze the page or post. After the complete analysis, it chooses the image which it feels as the best among all. But, by following the above mentioned solutions, you can easily resolve the Facebook incorrect thumbnail issue in WordPress. Hope our effort worked for you. For Best WordPress Tutorials, keep following our site.

Continue Reading
You may also like...

We are a WordPress plugin developer company that focuses on useful WordPress plugin creation and empowering people to earn passive incomes from their blogs. We build unique and groundbreaking plugins that will revolutionize your blog!

Click to comment

Leave a Reply

Your email address will not be published. Required fields are marked *

More in solution

    Sign up for our newsletter and get a free affiliate e-book!


    About Me:

    Szabi Kisded

    Hi, my name is Szabi and I'm documenting my journey selling plugins on CodeCanyon. I will show you every step of it: learning to code, plugin ideas, WordPress stuff and more. Read more…

    Mega Plugin Bundle:

    CodeCanyon Portfolio:

    Learn to Code Plugins:

    Latest Promotions:

    Recommended Theme:

    Start Your Own Blog:

    Recommended VPN:

    Translate Your Blog:

    AdSense Alternative:

    Best Article Spinner:

    Popular Posts:

    Latest Posts:

    To Top