ADVANTAGES
- Stylish
- Fast Comments
- Traffic From Facebook When Someone Comment on Blogger
- Quickly Loads
- Never Crashes
- Moderator Can View and Delete Specific Comments
DISADVANTAGES
Facebook Comments is a nice social plugin but sometimes its not too good to use there is no Doubt That it is the No.1 Social Network But When it is down it also effects your comment system because all your meta tags and scripts are hosted on Facebook Developers Site.
STEPS TO ADD FACEBOOK COMMENTS
- First of All Goto Facebook Developer Site and make There a New App By Hitting The 'Create New App' Button.
- A Dialog Box Will Appear Now Here Write The Name of Your App and Click Continue in The Category Section Just Select Other.
- Now You Will Be Taken To The App Dashboard page Where Your App Details are displayed you have to copy these keys such as app id which we will use later in the tutorial.
- Login To Blogger.
- Goto Template & Click Edit HTML.
- Search For Following Piece of Code it will be in the starting of the template.
<html ...... xmlns:expr='http://www.google.com/2005/gml/expr'>
- Just Next To This Code Paste Following Code.
xmlns:og='http://ogp.me/ns#'
- The Code Will Be Look Like This.
<html xmlns:og='http://ogp.me/ns#' ...... xmlns:expr='http://www.google.com/2005/gml/expr'>
- Now Search For <Body> Tag and just below it paste the following piece of code.
<div id="fb-root"></div><script>window.fbAsyncInit = function() {FB.init({appId : 'YOUR_APP_ID',status : true, // check login statuscookie : true, // enable cookies to allow the server to access the sessionxfbml : 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>
- Don't Forget To Replace YOUR_APP_ID With Your Facebook App ID
- Now Search For </Head> and Just Above it Paste That Facebook Open Graph Meta Tag.
<meta property="fb:app_id" content="YOUR_APP_ID" />
- Replace app_id With Your Facebook App id That You Created
- Now Search For <b:includable id='comment-form' var='post'> if You can't find this code just paste it below <div class='post-footer-line post-footer-line-1'></div> Make sure You repeat this process because there are more line (i.e line-2,line-3) And After that paste the following HTML code.
<b:ifcond='data:blog.pageType == "item"'> <div style='padding:20px 0px 5px 0px; margin:0px 0px 0px 0px;'> <script src='http://connect.facebook.net/en_US/all.js#xfbml=1' /> <div> <fb:comments colorscheme='light' expr:href='data:post.url' expr:title='data:post.title' expr:xid='data:post.id' width='550' /> </div> </div> </b:if>
- If You Want to Change The With Change The Number 550 To Desired .
- & You are Done :)
FINAL WORDS
Now You have successfully installed and add the Facebook comments in blogger if you have any problem in the coding then simply leave a comment we will be here for you all time & Don't Forget To Share The Tutorial. Good Luck!
No comments:
Post a Comment