Step 3. Codes To Add To Your Template.
you must add the following codes to your blogger template to ensure that the comments box will work for your blog in the right way.and in this step we’ll add the following codes,
- xmlns attribute
- SDK script
- Open Graph protocol tags
- Adding the xmlns attribute :
then find the following code,
<htmlyou’ll find it on the top of your code. second or third line, and after it add the following code,
xmlns:fb='http://www.facebook.com/2008/fbml'you must type a space before it and after it,
here is an example.
<html xmlns:fb='http://www.facebook.com/2008/fbml' expr:dir='data:blog..............2005/gml/expr' >
- Adding the SDK script Code :
<body>and after it add the following code,
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'YOUR APP ID',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
};
(function() {
var e = document.createElement('script');
e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
}());
</script>but please don’t forget to change YOUR APP ID to your app id ( you got it in the previous step ).- Adding the Open Graph protocol tags:
<b:if cond='data:blog.pageType == "item"'> <meta expr:content='data:blog.pageTitle' property='og:title'/> <meta expr:content='data:blog.url' property='og:url'/> <b:else/> <meta expr:content='data:blog.title' property='og:title'/> <meta expr:content='data:blog.homepageUrl' property='og:url'/> </b:if> <meta content='MY-SITE-NAME' property='og:site_name'/> <meta content='http://google.com/help/hc/images/logos/blogger_logo.gif' property='og:image'/> <meta content='YOUR-APP-ID' property='fb:app_id'/> <meta content='YOUR-FACEBOOK-PROFILE-ID' property='fb:admins'/> <meta content='article' property='og:type'/>and change the colored text to the following,
Change MY-SITE-NAME with the one you want to appear when a user likes a page. (Gil likes Helping on Facebook)
Changehttp://google.com/…/blogger_logo.gif with your blog logo, or remove the all tag if you don’t want it.
Change YOUR-APP-ID with your application ID number.
Change YOUR-FACEBOOK-PROFILE-ID with your own facebook user profile ID.
after making this changes add the above code just before
Post a Comment