Social networks like Facebook,Google+ can collect structured information about your blog posts and pages by adding open graph meta tags to your blog.
- Step # 1
- Step # 2
Find for <html and add xmlns:og=’http://ogp.me/ns#’ at the closing end of this tag like this.
<html……………………………..xmlns:og=’http://ogp.me/ns#’>
- Step # 3
Now find <head> and add the following code just below it.
<b:if cond=’data:blog.pageType == "item"’><meta expr:content=’data:blog.pageName’ property=’og:title’/><meta expr:content=’data:blog.canonicalUrl’ property=’og:url’/><meta content=’article’ property=’og:type’/></b:if><meta expr:content=’data:blog.title’ property=’og:site_name’/><b:if cond=’data:blog.postImageThumbnailUrl’><meta expr:content=’data:blog.postImageThumbnailUrl’ property=’og:image’/><b:else/><meta content=’http://www.your-bloglogo.jpg‘ property=’og:image’/></b:if><b:if cond=’data:blog.metaDescription != ""’><meta expr:content=’data:blog.metaDescription’ name=’og:description’/></b:if><meta content=’Your-App-ID‘ property=’fb:app_id’/><meta content=’Your-Facebook-Profile-ID‘ property=’fb:admins’/>
- Change the text in Pink with your configuration.
- NOTE:- use Facebook Lint Tool to verify your Open graph meta tags.
(Think you are sharing a post of your blog on facebook)
- #1
<b:if cond=’data:blog.pageType == "item"’><meta expr:content=’data:blog.pageName’ property=’og:title’/><meta expr:content=’data:blog.canonicalUrl’ property=’og:url’/><meta content=’article’ property=’og:type’/></b:if>
This IF condition code structure instructs facebook to fetch your blog post title and post url is you are sharing a post of your blog.
- #2
<meta expr:content=’data:blog.title’ property=’og:site_name’/>This instructs facebook to fetch your blog title as site name while sharing.
- #3
<b:if cond=’data:blog.postImageThumbnailUrl’><meta expr:content=’data:blog.postImageThumbnailUrl’ property=’og:image’/><b:else/><meta content=’http://www.your-blog-logo.jpg‘ property=’og:image’/></b:if>
This IF condition code structure instructs facebook to fetch your post image as thumbnail if you are sharing a post and instructs to fetch your blog logo as thumbnail when sharing your blog home page.
- #1
<b:if cond=’data:blog.metaDescription != ""’><meta expr:content=’data:blog.metaDescription’ name=’og:description’/></b:if>These tags instructs facebook to fetch your blog description stored in meta tags while sharing your blog.
No comments:
Write commentsThank you for getting in touch!
We appreciate you contacting us about [Contact Reason]. We try to respond as soon as possible, so one of our Customer Service colleagues will get back to you within a few hours.
Have a great day ahead!