The trick this time is still around custom templates, namely how to post Disqus comments on Blogspot, and make the Disqus Shortname editable directly on the Layout menu or Blogger Layout. This means that template users no longer enter Theme> Edit HTML or use the HTML Editor to change their username or Disqus Shortname. More or less, the appearance will be like in the following image:
Of course this will make it easier for template users, especially those who are unfamiliar with coding. Unlike the previous tutorial that used jQuery, which is a trick to be able to edit the ad code in the posting section on the Layout / Layout menu , this trick is not using the jQuery script.
Just move the Disqus comment loading script only. Here's how!
Attention!
Before going to the tutorial, first remove all Disqus JavaScript in the template, whether it's a widget (sidebar / footer), or a script in Edit HTML (theme editing).
Before going to the tutorial, first remove all Disqus JavaScript in the template, whether it's a widget (sidebar / footer), or a script in Edit HTML (theme editing).
Step 1
Go to the Theme menu> Edit HTML
Step 2
Find the following code:
<b: widget id = 'Blog1' locked = 'true' title = 'Blog Posts' type = 'Blog' version = '1'>
……………………………… ..
…………… ………………… ..
……………………………… ..
……………………………… ..
………………………………. .
……………………………… ..
……………………………… ..
</ b: widget>
Then put the following code after the code
</b:widget><b: widget id = 'HTML489' locked = 'true' title = 'Disqus Shortname' type = 'HTML' version = '1'>
<b: widget-settings>
<b: widget-setting name = 'content'> XXXXX </ b: widget-setting>
</ b: widget-settings>
<b: includable id = 'main'>
<b: if cond = 'data: blog.pageType in {& quot; item & quot;, & quot; static_page & quot; } '>
<script type =' text / javascript '>
var disqus_shortname = & quot; <data: content /> & quot ;;
var disqus_blogger_current_url = & quot; <data: blog.canonicalUrl /> & quot ;;
if (! disqus_blogger_current_url.
length) { disqus_blogger_current_url = & quot; <data: blog.url /> & quot ;;
}
var disqus_blogger_homepage_url = & quot; <data: blog.homepageUrl /> & quot ;;
var disqus_blogger_canonical_homepage_url = & quot; <data: blog.canonicalHomepageUrl /> & quot ;;
(function () {
var bloggerjs = document.createElement (& quot; script & quot;);
bloggerjs.type = & quot; text / javascript & quot ;;
bloggerjs.async = true;
bloggerjs.src = & quot; // & quot; + disqus_shortname + & quot; .disqus.com / blogger_item.js & quot ;;
(document.getElementsByTagName (& quot; head & quot;) [0] || document.getElementsByTagName (& quot; body & quot;) [0]). appendChild (bloggerjs);
</script>
</ b: if>
</ b: includable>
</ b: widget>
So, it will look like in the following image:
Step 3
Save Theme.
Note:
If the Disqus comments column does not appear, make sure the entry settings in your articles or posts, reader comments are allowed. As shown below:
If the Disqus comments column does not appear, make sure the entry settings in your articles or posts, reader comments are allowed. As shown below:
This is the tutorial on How to Install Disqus Comments, and Make a Disqus Shortname that Can Be Edited Directly on the Blogger Layout Menu . Hopefully useful and good luck!