How To Add Disqus gadget to Blogger Manually 2019

Today I’m going to show you How To Add Disqus gadget to Blogger Manually 2019. With this method, you will have everything set up exactly as you want.

If the Disqus gadget installer isn’t working, you have the option of manually installing the gadget on your Blogger site. This will require editing your Blogger template HTML, so it won’t work with Dynamic Views templates.

Add a new gadget

1. Go to your Blogger “Layout” section and click Add a gadget in the sidebar
2. In the Add a Gadget popup, scroll down to find the HTML/Javascript gadget and click the + button
3. Enter Disqus as the title and the following code for the content

<!-- Disqus comments gadget -->

4. Click save and the window will close
5. Click Save arrangement in the Layout viewer

Add the Disqus code to your template

1. Go to your blog’s Template section, click “Edit HTML”, and then click the “Edit template” button

How To Add Disqus gadget to Blogger Manually 2019. Today I'm going to show you How To Add Disqus gadget to Blogger Manually 2019. With this method, you will

2. Click inside the text area and search for the widget you just created in your HTML template by pressing Ctrl-F (Command-F on OSX) then typing Disqus. You should find the following line:

<b:widget id='HTML1' locked='false' title='Disqus' type='HTML'>

3. Change that line to add mobile=’yes’ to load Disqus on your mobile template. It will look like this when you’re done:

<b:widget id='HTML1' locked='false' mobile='yes' title='Disqus' type='HTML'>

4. Below that locate and DELETE the following code right before the closing tag. The section you’re deleting should look like this:

<b:includable id='main'>  <!-- only display title if it's non-empty -->  <b:if cond='data:title != ""'>    <h2 class='title'><data:title/></h2>  </b:if>  <div class='widget-content'>    <data:content/>  </div>  <b:include name='quickedit'/></b:includable>

5. BEFORE the closing </b:widget> tag, add the following Disqus code (remember to replace “EXAMPLE” with your forum shortname and be sure to leave ”’ in front of your shortname and ”;’ after it.):

<b:includable id='main'>
            <script type='text/javascript'>
                var disqus_shortname = 'EXAMPLE';
                var disqus_blogger_current_url = "<data:blog.canonicalUrl/>";

                if (!disqus_blogger_current_url.length) {
                    disqus_blogger_current_url = "<data:blog.url/>";
                }

                var disqus_blogger_homepage_url = "<data:blog.homepageUrl/>";
                var disqus_blogger_canonical_homepage_url = "<data:blog.canonicalHomepageUrl/>";
            </script>

            <b:if cond='data:blog.pageType == "item"'>
                <style type='text/css'>
                    #comments {display:none;}
                </style>

                <script type='text/javascript'>
                    (function() {
                        var bloggerjs = document.createElement('script');
                        bloggerjs.type = 'text/javascript';
                        bloggerjs.async = true;
                        bloggerjs.src = '//'+disqus_shortname+'.disqus.com/blogger_item.js';
                        (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(bloggerjs);
                    })();

                </script>
            </b:if>
                <style type='text/css'>
                    .post-comment-link { visibility: hidden; }
                </style>

                <script type='text/javascript'>
                (function() {
                    var bloggerjs = document.createElement('script');
                    bloggerjs.type = 'text/javascript';
                    bloggerjs.async = true;
                    bloggerjs.src = '//'+disqus_shortname+'.disqus.com/blogger_index.js';
                    (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(bloggerjs);
                })();

            </script>
</b:includable> 

6. Click Save template. Assuming there are no errors, Disqus should properly show up on your site now.

7. (Optional) Verify that the meta tags in your Blogger Template do not force Internet Explorer to load using IE7 standards. 

We hope you did it right. That’s all guys it’s simple and easy but if you can’t still do it yourself then you have to let us know so that we can assist you with the problem. Contact Us