Facebook Open Graph: How to get your FB Shares and Likes to Appear Right

I had a problem with the site where if a reader were to share a post or like a page, the resulting box that appeared on Facebook had the wrong thumbnail and shared post excerpt. It was frustrating to see the wrong information being submitted. Luckily, we have since been able to resolve this! This helps to resolve Facebook using the wrong thumbnail and summary for the pages that you share.

Well, the best way to ensure your WordPress site gets recognised by Facebook is to include the Open Graph tags. Facebook Open Graph protocol allows you to share your blog content not only with your readers, but their Facebook friends as well. The best part is whenever someone liked your content(s), it will be published on their Facebook profile and shared with their friends. But that’s not all, Open Graph has a few more advance features which we might explore in future. It allows you to explore more interesting ways to interact and engage with your readers (such as watch a movie, or ate at a restaurant, instead of just liking everything). Ultimately, if this is done right, it builds up your brand and increases your site’s traffic.

HongKiat.com has a very good article that clearly explains  how to integrate Facebook Open Graph with a self-hosted WordPress in a detailed step-by-step guide. It will require editing your existing WordPress theme and creating a Facebook application (if you don’t have one).

However, you may encounter that even after doing this step, when you try to share your old URLs, the information that Facebook displays is inaccurate. If that is the case, it likely means that the Facebook had already crawled your website and created the little preview that you see when you try to share a URL into its cache. This can be frustrating when you are trying to integrate the Facebook Open Graph into an existing website. Other tips recommend that you add slashes to your URL or use a URL shorterner but those just messed up your Facebook analytics. It turns out you can force Facebook to re-crawl or re-cache your site and update its cache by putting your URL into this tool: https://developers.facebook.com/tools/debug. That seems to shake the cache out.

 

Sean

Sean is a tech geek and star wars fan. He loves playing with new gadgets, writing little code snippets in Python, JS, and dabbling with Android programming from time to time, while keeping a lookout for the next biggest happening in the world of tech!

One thought to “Facebook Open Graph: How to get your FB Shares and Likes to Appear Right”

  1. Hi there! I’m at work browsing your blog from my new apple iphone!

    Just wanted to say I love reading your blog and look forward
    to all your posts! Carry on the great work!

Leave a Reply