How To Add A Facebook Comment Box For Every Post Of Your Web Or Blog Sites.


Now lot of people join to Web & Blog World. So , they try to Add something Special option to there Web or Blog Sites.

Now we are going to tell you , " How to add a Facebook Comment Box for your Every Post of your Web or Blog Sites. "
this is a Main part in your Web or Blog Sites. Because , If you add this Facebook Comment Box for your Web or Blog Sites , You can get Lot of Comment from your Web or Blog Readers.

We add this Facebook Comment Box to Our Site too.

In this Post we tell you How to add Facebook Comment Box for your Blogger Blog Sites.
But , If you have a Web Site , You can use this Methods. But , You must Customize some Steps.
I think you can Customize this , your self.

If you want to Add this Facebook Comment ox for your Web or Blog Sites , Follow this Steps.

  • First you have to Log in to Your Blogger & Click Templates In Left Side.
    • Take a Backup of the template first by clicking on Backup/Restore.
    • After you have taken a backup click EDIT HTML 
  • Copy the entire code and keep it in a Notepad temporarily in case something goes wrong and we need to replace quickly.
  • Press Ctrl + F & Type <head> & Press Enter Button.
  • Now you can see <head> and just after it paste the code.
    •  <meta content="FACEBOOK-APP-ID" property="fb:app_id" />
  •  If You Want To Find Facebook App ID , Do This.
    Go to this link - Facebook App ID Creator.
  • Now click ' Create New App ' in Top of Right Side.
  • [ If you haven't confirm your FB account via your Mobile Phone Number , When you click ' Create New App ' , you have to Type your Mobile Phone Number in that step & FB will send a Secret code to your Mobile Phone Number. Now , you have to Type that you received Secret Code in this step & Now you can Create New App. ( If you don't confirm your FB account via your Mobile Phone Number , you can't Create Facebook App ID. ) ]
  • Now Fill App Name using your Facebook Page Name. Fill App Namespace without Capital letters & symbols. Don't Do anything to Web Hosting. Now click Continue. [ Ex - App Name - Seven Net & App Namespace - sevennetsite ]
  • Fill Security Check with Correct Words & click Continue.
  • Now you can see your App ID below your App Name.
  • Fill Domain of your Site in App Domains. [ Ex - If your site is Blogger , your Domain is blogspot.com ]
  • Fill Your Site URL in Website with Facebook Login. [ Ex -  http://allsevennet.blogspot.com/ ] Be sure it starts with http:// and ends with this Symbol  / ) Now , Click '  Save Changes '.
  • Before you saw your App ID below your App Name. So , Now Copy Numbers of App ID & Replace in  FACEBOOK-APP-ID in that first code. 
  • Now press CTRL+F and find ,
    • * <div class='post-footer-line post-footer-line-3'>
    • OR <p class='post-footer-line post-footer-line-3'>
    • OR <data:post.body/>
  • Try finding any of the 3 above. ( This  <div class='post-footer-line post-footer-line-3'> Code is works 1000% Good. But , I Can't Say About Other 2 Codes. So , You Must Try that First Code.
  • And Paste the code Below right after it.
    • <b:if cond='data:blog.pageType == "item"'> <div id="fb-root"></div> <script>(function(d){ var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;} js = d.createElement('script'); js.id = id; js.async = true; js.src = "//connect.facebook.net/en_US/all.js#xfbml=1"; d.getElementsByTagName('head')[0].appendChild(js); }(document));</script> <fb:comments width='600' colorscheme='light' expr:title='data:post.title' expr:href='data:post.canonicalUrl' expr:xid='data:post.id'/> </b:if>
  • Now Copy this below code. Again press Ctrl + F & Type <html> & Press Enter button. Now click after the <html> & Press Space button & Paste that code and Again press Space button.
    • xmlns:fb="https://www.facebook.com/2008/fbml"
  • Click ' Save Template '.
  • Click ' Back '.
  • Go & See Your Blog Post Below , Yup Yup !!
    There Are A Facebook Comment Box.

  • If You Can't Understand Anything , Please Watch This Video.  

     We Told You , How to Find Your Facebook App ID before this. Please , Read over this Video.


    • If this post Helpful for your Web or Blog Site , keep your Comment here.

Posted by Kistlak Rajapaksha (Kisalka)
Labels:

0 comments:

Subscribe to: Post Comments (Atom)

Tweet Now !!

Recommend us on Google!
Copyright © 2012 - 2015 Seven Net - Technology In English.