Wednesday, November 26, 2014

How To Install Facebook Open Graph (OG) On each Blogspot Post

FB Open Graph
How to install Facebook open graph (OG) on each Blogspot post, it's quite easy and the function of its to maximize your post or content when it's shared on Facebook. So when you share your post or anyone share your post, and it only shows the title and descriptions of the post without thumbnail, then I suggest you to use the Facebook open graph tag here.

If you have installed it correctly, it's nearly 100% your shared post will appear just like in the following image.

If your post appears like in the image, of course will attract any Facebook users to visit that will generate you extra traffic from Facebook. Because it's so eye catching.

And the following is the Facebook open graph you need to place inside the <head> or place anywhere before the <b:skin><![CDATA[/*. (Just copy the entire codes below).

<!-- open graph --> <b:if cond='data:blog.url == data:blog.homepageUrl'> <meta content='website' property='og:type'/> <meta content='https://lh6.googleusercontent.com/-tedRhpDNEM0/U2ut0BBTUII/AAAAAAAAACc/_Uth1YnMN8Q/w296-h297-no/Logo-Mad-Tekno.png' property='og:image'/> </b:if> <b:if cond='data:blog.pageType == &quot;item&quot;'> <meta content='article' property='og:type'/> </b:if> <b:if cond='data:blog.pageType == &quot;item&quot;'> <b:if cond='data:blog.postImageThumbnailUrl'> <meta expr:content='data:blog.postImageThumbnailUrl' property='og:image'/> </b:if> <b:else/> </b:if> <b:if cond='data:blog.url == data:blog.homepageUrl'> <meta content='Mad Tekno' property='og:title'/> <b:else/> <meta expr:content='data:blog.pageName + &quot; - &quot; + data:blog.title' property='og:title'/> </b:if> <meta expr:content='data:blog.title' property='og:site_name'/> <meta expr:content='data:blog.canonicalUrl' property='og:url'/> <b:if cond='data:blog.metaDescription'> <meta expr:content='data:blog.metaDescription' property='og:description'/> </b:if> <!-- end open graph -->
Now save your template, and open your article to see its view source or just share your post to Facebook to see whether it appear on the example image above. Hope this post useful for you. See in in the next post guys.

No comments:

Post a Comment