Last active
February 24, 2022 17:20
-
-
Save nternetinspired/7482445 to your computer and use it in GitHub Desktop.
Load Disqus comments only on demand if you give a shit about page weight and your visitors. Even with no comments, i.e. an empty comment form, calling Disqus will load an extra 226Kb. If your page has comments this can be far higher. This Gist accompanies my blog post: http://internet-inspired.com/wrote/load-disqus-on-demand/
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Requires jQuery of course. | |
$(document).ready(function() { | |
$('.show-comments').on('click', function(){ | |
var disqus_shortname = 'YOUR-DISQUS-USERNAME'; // Replace this value with *your* username. | |
// ajax request to load the disqus javascript | |
$.ajax({ | |
type: "GET", | |
url: "http://" + disqus_shortname + ".disqus.com/embed.js", | |
dataType: "script", | |
cache: true | |
}); | |
// hide the button once comments load | |
$(this).fadeOut(); | |
}); | |
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!-- An element a visitor can click if they <3 comments! --> | |
<button class="show-comments">Load Disqus comments</button> | |
<!-- The empty element required for Disqus to loads comments into --> | |
<div id="disqus_thread"></div> |
Possible to make that button toggle comments on and off?
Thank you very much 👍
Piggybacking off of euler0's comment, in this day and age you really just want to use HTTPS instead of protocol-relative.
See for example https://jeremywagner.me/blog/stop-using-the-protocol-relative-url
Why does it has to be jquery? Can't JavaScript do this? Since it's to reduce bloat might as well do it in pure JavaScript.
How to specifiy postID etc... ?
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
@rrecinos Do I not have to specify a post ID?