facebook open graph og:type helps facebook robots to crawl your website and show your web page title description and your article thumbnail with your website link on facebook but it's work when you have added facebook open graph in your website head section if you can't see your post with title thumbnail and description then this tutorial will show you how can you show your post with title description and post thumbnail by adding Facebook Open Graph In Blogger Blog.
Add Facebook Open Graph in Blogger Blog
Add Facebook Open Graph in Blogger Blog
first go to blogger and login your account if already login then no need to login
click on your blog title to open your blog dashboard
now click on template.
in next page you will see your blog screenshot and 2 options one is customize and second is edit HTML click on Edit HTML.
now you will see your template code press ctrl+F and search <head>
you don't need to search because you will see <head> in the top of you template code.
just add following meta tags below <head>
you can add open graph anywhere between <head></head>
Add Facebook Open Graph in Blogger Blog
- go to blogger and login your account
- click on your blog title to open your blog dashboard
- now click on template
- click on edit html
- you will see your template code
- add following meta tags between <head></head>
- you are done.
Add Facebook Open Graph in Blogger Blog
first go to blogger and login your account if already login then no need to login
click on your blog title to open your blog dashboard
now click on template.
in next page you will see your blog screenshot and 2 options one is customize and second is edit HTML click on Edit HTML.
now you will see your template code press ctrl+F and search <head>
you don't need to search because you will see <head> in the top of you template code.
just add following meta tags below <head>
you can add open graph anywhere between <head></head>
<!-- Open Graph Meta Tags BEGIN -->
<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='your website logo url' 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 fb app id' property='fb:app_id'/>
<meta content='your fb profile id' property='fb:admins'/>
<!-- Open Graph Meta Tags END -->
Dear readers, after reading the Content please ask for advice and to provide constructive feedback Please Write Relevant Comment with Polite Language.Your comments inspired me to continue blogging. Your opinion much more valuable to me. Thank you. Conversion Conversion Emoticon Emoticon