This post is not about how to use the Facebook Open Graph meta tags - you can find a very good version of that in David Walsh's blog.
I was working on my blog a few days back and tried sharing my post on Facebook - which is when I noticed a strange thing.
The original title of my blog was:
The Obligatory "My first post"
But the facebook title was showing:
I scratched my head and browsed through the rendered HTML when I found this:
<meta property="og:title" content="The Obligatory "My first post"">
Now at first look you can notice what the issue was!
So I immediately changed my blog title to the following:
The Obligatory “My first post“
After making these changes - when I tried to share it on FB - I found the same issue again. Then it came to me that FB is surely caching the links once it's shared so I needed some way to refresh the data stored in FB. After searching around a bit, I found the following link to test the FB meta tags.
I opened the link and entered my URL there to test the outcome. FB immediately generated a fresh preview of the page and the changes reflected beautifully - exactly as I wanted.
The debugger is a very useful to test your link previews and optimize it accordingly :) And as it turns out - it even clears out any old cache of the unoptimized page someone might have shared in the past!