HOW TO: Fix Facebook ‘Like’ Thumbnail Problem

Facebook quite recently changed the functionality of ‘Like’ button, now it is similar to ‘Share’ button. Normally the ‘Like’ button shows the link of the blog post and the blog, but from now onwards they will show the Title, Description and a screenshot of the page which you like.

By default most of the ‘Likes’ have random thumbnails, similar to the below image. Here they took the emoticon I used in comments!

Facebook Like Effect [Before]

Facebook Like Thumbnail [BEFORE]

After trying this trick, my blog post was able to show the related image as thumbnail.

Facebook Like Effect [After]

Facebook Like Thumbnail [AFTER]


Ashish Saini did a great job by creating a WordPress plugin and also a PHP code with similar functionality. Here we are going to see the two methods by which you can solve the Facebook Like Thumbnail problem easily.

Two Ways To Fix Facebook Like Thumbnail Problem

#1 – WordPress Plugin : WordPress users once again blessed with a plugin. Just download and activate it.

It will display the first image of the post or page you are on. In case someone likes your Category or Tag page, then the first image of the first post in the listing will be used.


#2 – Manual PHP Code : Not everyone love to use plugins, for them here is another method. Just copy and paste the following snippet in functions.php file. Bingo!

You can check the manual code [here]

You can replace ‘http://blog.ashfame.com/wp-content/themes/ashfameblog/images/ashfame-logo.png’ with your blog/brand image URL.


These two methods apply only* to WordPress blogs, but yet, you can use the following code to show a constant default image; maybe you can use your blog logo.

<link rel=”image_src” href=”http://example.com/logo.png” />

Do you like this new ‘Like’ functionality? Have you faced this thumbnail issue? Share your opinions below as comments.

25 thoughts on “HOW TO: Fix Facebook ‘Like’ Thumbnail Problem”

  1. the method that you given above
    (<link rel=โ€image_srcโ€ href=โ€http://example.com/logo.pngโ€ />) does not work for my blog. if you have any idea about blogger code pls explain

    Reply
  2. hi Pradeep…
    Thanks for providing that information but is this also applicable for the post we like before activating this plugin…

    Reply
  3. Hi Pradeep, its one of the informative post to all the blogger. Thanks a lot for given. No words to describe about this article. great work ๐Ÿ™‚

    Reply
  4. I have recently FORMATTED my C Drive using Windows XP Home so I didn't expect problems but if I try and open My Documents in thumbail view it crashes.

    Reply
  5. When you implement Open Graph protocol in your website with Facebook social plug in (Like button) properly, than whenever some one likes or shares a post from your blog , that will appear in their wall with a related image to that post plus a short description and URL to the post.

    There are certain syntax you need to use for proper integration of OG and FB like. Any mistake in the syntax will result in incorrect nbr of likes as well as improper URL associated with the like. I will cover this topic broadly on my blog pretty soon.

    Reply
  6. Well aren’t you clever… That’s a great idea, thanks so much for sharing this with us. I’m going to have to give this one a go myself. I love this idea!

    Adrienne

    Reply
  7. Hi Pradeep,

    Thanks for spreading the word about it. ๐Ÿ™‚

    BTW, take a look at your code, its messed up right now, outside the pre tag.

    Reply

Leave a Comment