How to Use Facebook, Disqus and Blogger Comment tab Together in Blogger Blogs

| , , ,

How to Use Facebook, Disqus and Blogger Comment tab Together in Blogger Blogs

As writers of  blogs, we all are aware of the importance of comments. While it is true that some blogs/websites tend to disable comments entirely, those are special instances where the websites do not essentially require comments. However, in general, comments form an integral part of any blog, be it a personal one or a magazine site. After all, what good is any info unless it provokes a healthy discussion?

All blogging platforms (including WordPress) come with native support for some sort of comment mechanism which seems to suffice for most bloggers. But sometimes, users may require some dedicated or specialized comment mechanism. This is where third-party commenting systems come in handy. In this article, we will take a look at some of the major third-party commenting mechanisms

Disqus is a mature comment management system and perhaps the most used amongst bloggers and website owners. Introduced back in 2007, it is currently serving more than 750,000 websites. According to a recent study done by folks at Lijit, 75% of the websites using 3rd party commenting system are powered by Disqus.

Facebook Comments
Uses social signals to surface the highest quality comments. Comments are ordered to display the most relevant comments from friends and friends of friends as well as the most-liked or active discussion threads. Comments marked as spam are hidden from view.
Comments are easily shared with friends or with people who like your Page on Facebook. If people leave the “Post to Facebook” box checked when they post a comment, a story appears on their friends’ news feed indicating that they’ve made a comment on your website, which will also link back to your site.

Blogger Comment Box
Is the default commenting platform for bloggers which gives us the full control in all the blogposts comments

In this post i will give a detail explanation and tutorial on how to COMBINE FACEBOOK, DISQUS and BLOGGER as commenting platform of your blogs

First thing you need to have disqus and Facebook App Id. See Below Tutorial to get your on Facebook App

REGISTER to DISQUS.COM to get your username

    • Go To Facebook Developers Page
    • Submit your blog URL and give it a name. Keep Site name as your “Blog Title” and Site URL as your “blog address”
        • Hit “create app” button and proceed
        • After submitting the security check code you will see this page,
        • Save that FACEBOOK APP ID in a notepad because we will need that later. Now Click the link near the top-right corner of the same page that says “Developer Dashboard 

        Now i had assumed that you had your own disqus account username and Facebook App Id, So Now lets start the tutorial.

        Step 1: Login in blogger Account. And select Your Blog.
        Step 2: Backup Your Blogger Blog.
        Step 3: Navigate Blogger Dashboard > Go to Template > Edit HTML.
        Step 4: Find Following Code by pressing CTRL + F.


        Now just above it place the below code


        • Replace mcdeweyl with with your own personal facebook username.(this will be used in regulating your fb comment box
        • Replace xxxxxxxxxxxxxxx with your own facebook App Id.

        Step 5: Now search for below code.

        <div class='comments' id='comments'>

        You may find 2  instance of  <div class=’comments’ id=’comments’> place the code in both of this. [ 1st is when there is no comment and the 2nd is when there ‘s already comment] some users having problem that disquss and facebook is hidden when they comment using blogger comment. It is because they don’t put it twice.

        Step 6: Use Below Integrated Facbook, disqus and blogger tab generator, Copy and Paste Generated Code Just After
        <div class=’comments’ id=’comments’> code.

        Step 7: Now we need to add disqus script to show no. of comment on button for it, find below code.
        Step 8: Paste Following code just above </body> tag.

        Step 9: Replace Disqus-Site-Name  (one the 3rd line) with your own disqus site username
        Step 10: Save Your Template, that set.

        Note: If you find any trouble regarding appearance of 3 comment box, kindly change the comment setting as per instruction. Go to Setting > Post and Comment > In field of comment location select option “Embedded or Full Page” and check it respectively..

        If you experience any problem just drop a comment

        Credits to: jsblogstop for the css
                     to: tipsviablogging for the generator.

        Enjoy Pals!

        1. Add 3 In 1 Slide Out Follower Box Widget to Blogger BlogsNew !!
        2. Facebook Like Box Without Footer Note
        3. Facebook Likebox with White Lightbox Effect for Blogger BlogsNew !!
        4. How To Add Beautiful Horizontal Random Post to Bloggers Blog
        5. How To Add HTML Contact Form for Blogger Blogs
        6. How To Add Mashable Subscription Box to Blogger Blogs
        7. How To Create Drop Down Menu Form with GO Button for Blogger BlogsNew !!
        8. How to Add Random Post Widget to blogger Blogs
        9. How to Add a Beautiful Accordian Table of Contents for Blogger BlogsNew !!
        10. How to Create a Beautiful Table of Contents for Your Blogger BlogsNew !!
        11. How to Use Facebook, Disqus and Blogger Comment tab Together in Blogger BlogsNew !!
        12. Slider Don’t Forget To Join Our Community Popup Widget for Blogger BlogsNew !!
        13. Smooth JQuery Scroll to Top Widget Generator for Blogger BlogsNew !!
        14. The Fastest and Easiest Tabber Widget For Blogger BlogsNew !!

        How to Add a Beautiful Accordian Table of Contents for Blogger Blogs

        TheBlogger911 Online Collection of All of The Best Templates and Their Creator


        23 thoughts on “How to Use Facebook, Disqus and Blogger Comment tab Together in Blogger Blogs”

        1. @Abdul yes you can..i just want to place it there so everyone who wants to use it, will know where to find it, if your kind please leave it as it is.

        2. @ABDUL brother just remove the older jquery it is advisable to always use the latest pack of jquery…BTW it will work without my jquery in the code, try to remove my jquery and see if your slider works..

        3. brother if i remove ur jquery my slide is work but ur code in command box seperate by three box command box disqus box and fb box.there is a ny possible two jquery commands in single blogger.please help me brother

        4. @ABDUL yes you can use 2 jquery.. can you try to place the code as it is without removing anything..maybe some code are broken when you try to remove the credit..and can you tell me your blog URL so i can address the problem.
          you can send details in my contact form if you don't want to publish it here.

        5. @Richard, Hi thanks for dropping by. yes i made it easy to understand.. and step by step so anyone can understand it, even newbies can relate to the post.

        6. Hi Claud, i already look at your template, seems your did some error on the last part of tutorials. can your repeat the step 8, and be sure your disqus name is correct.
          then message me in my contact form for more advance help if still disqus is not loading, i'll surely fix that for you.thanks.

        7. Thank you for your help. I managed to install your plugin. I've noticed that Disqus comments only show a summary of the comment not the full text, and there doesn't appear to be a way to view the full text, as it is with comments made via the blogger comment system.

        8. Hi Claud.. i already replied to your email about your background color request..BTW the summary of message of disqus.. it is in the disqus side.. we can't do anything about it.. they made it that way so it will not load long messages.. imagine if all your comments has 400 characters then it will be too long 🙂

        9. It also has the advantage of integrating tightly with social networking sites like Twitter and Facebook. It incorporates a strong spam filter as standard. Although commonly used in blog pages, in theory you can add support for Disqus to many other page types in RapidWeaver as well.
          los angeles website design

        Comments are closed.