Add New Facebook Comment Box with Plugin Version 2.3

Add New Facebook Comment Box with Plugin Version 2.3 Facebook has recently brought revolutionary change in their several Plugins Such as Like Box, Comment box etc. I have previously share Latest Like box widget. And now I am going to share installing latest comment box plugins in Blogger template. Though older comment box Facebook itself has announced that support for the old version will expire on June 23, 2015 to come. So It will be wise decision to install newer version of Facebook Comment box in your Blogger template. First of all we have to create a Facebook application ID for our new Facebook comment box. And after that we will integrate the comment box on Blogger template. Creating a Facebook Application ID This is the first step for using Facebook Comment plugins Version 2.3. we must create a Facebook App. But for creating an app you must have a Facebook account. And after that you will able to create a Facebook comment section. Just Follow the below steps- Step 1Go thehttps://developers.facebook.com/apps/link and Log in to yourFacebook Account Step 2UnderMy Appsclick on green colorCreate a New Appbutton and a popup window will appear. Step 3FromCreate a New App IDpopup windows writeDisplay Name(You can't use Facebook or their name so choose other name for application), Namespace(Must be less than 20 letters) and selectCategoryby using DropDown option. Step 4Finally click on blue colorCreate App IDbutton. And instantly you will getApp IDwithApp secret. Step 5From left side vertical menu click onSettingsand underBasictab, now underApp Domainsfield write your domain name without www. and underContact Emailwrite your email address. After that Click on+Add platformbutton. A popup window will appear from there click onWebsiteicon. Step 6Under Website section fill up theSite URLby using your Blog URL. And if you haveMobile site URLthen add URL on that field. And click on blue colorSave Changesbutton. Step 7Now navigate toStatus Reviewsection and select theYesfor making your App public. A confirmation message will appear, from there click on blue colorConfirmButton. Now our Facebook App ID has created and your Blog Platform has added. Now we will add the comment box in Blogger template. Installing Facebook Comment Plugins V2.3 in BloggerTemplate For Installing latest Facebook comment box please follow the below steps- Step 1Log in to your Blogger Account and Go to yourBlogger Dashboard Step 2Click on Now click on-Template-Edit HTML- Step 3Now Find the codebodyor body expr:class='quot;loadingquot; + data:blog.mobileClass' Step 4And Paste the below code after any code from above. div id='fb-root'/ script type='text/javascript' //![CDATA[ window.fbAsyncInit = function() { FB.init({ appId : 'YOUR-FB-APP-ID', status : true, // check login status cookie : true, // enable cookies 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 CUSTOMIZATION Replace Your App ID HERE with your Facebook App ID. Step 5Now again finddata:post.body/orpdata:post.body//pordiv class='post-footer-line post-footer-line-1'orp class='post-footer-line post-footer-line-1' orb:includable id='comment-form' var='post' Step 6And Paste the any script from below after any code from above. Light Color Version b:if cond='data:post.isFirstPost' script(function(d){ var js, id = #39;facebook-jssdk#39;; if (d.getElementById(id)) {return;} js = d.createElement(#39;script#39;); js.id = id; js.async = true; js.src = quot;//connect.facebook.net/en_US/all.js#xfbml=1quot;; d.getElementsByTagName(#39;head#39;)[0].appendChild(js); }(document));/script /b:if b:if cond='data:blog.pageType == quot;itemquot;' div id='fb-root'/ script(function(d){ var js, id = #39;facebook-jssdk#39;; if (d.getElementById(id)) {return;} js = d.createElement(#39;script#39;); js.id = id; js.async = true; js.src = quot;//connect.facebook.net/en_US/all.js#xfbml=1quot;; d.getElementsByTagName(#39;head#39;)[0].appendChild(js); }(document));/script div style='margin: 20px 0 0 0;background:white;border:1px solid silver;'fb:comments colorscheme='light' data-version='v2.3' expr:href='data:post.canonicalUrl' expr:title='data:post.title' expr:xid='data:post.id' width='100%'/ /b:if div class='clear'/ Dark Color Version b:if cond='data:post.isFirstPost' script(function(d){ var js, id = #39;facebook-jssdk#39;; if (d.getElementById(id)) {return;} js = d.createElement(#39;script#39;); js.id = id; js.async = true; js.src = quot;//connect.facebook.net/en_US/all.js#xfbml=1quot;; d.getElementsByTagName(#39;head#39;)[0].appendChild(js); }(document));/script /b:if b:if cond='data:blog.pageType == quot;itemquot;' div id='fb-root'/ script(function(d){ var js, id = #39;facebook-jssdk#39;; if (d.getElementById(id)) {return;} js = d.createElement(#39;script#39;); js.id = id; js.async = true; js.src = quot;//connect.facebook.net/en_US/all.js#xfbml=1quot;; d.getElementsByTagName(#39;head#39;)[0].appendChild(js); }(document));/script div style='margin: 20px 0 0 0;background:black;border:1px solid silver;'fb:comments colorscheme='dark' data-version='v2.3' expr:href='data:post.canonicalUrl' expr:title='data:post.title' expr:xid='data:post.id' width='100%'/ /b:if div class='clear'/ Step 8Nowhit theSavetemplatebutton. That's it. You have successfully added Facebook comment plugins in your Blog. Now check your any Blog post's and see Latest Facebook comment box is displaying.