<div id="disqus_thread"></div>

<div class="btn_click_load"> 
    <button id="disqus_click_btn" class="btn"><%= __('post.comment.load_disqus_button') %></button>
</div>

<script>
    var disqus_config = function () {
        this.page.url = '<%= page.permalink %>'; // Replace PAGE_URL with your page's canonical URL variable
        this.page.identifier = '<%= page.permalink %>'; // Replace PAGE_IDENTIFIER with your page's unique identifier variable
    };
</script>

<script id="disqus-lazy-load-script">
    var xhr = new XMLHttpRequest();
    xhr.open('GET', 'https://disqus.com/next/config.json', true);
    xhr.timeout = 4000;
    xhr.send();
    xhr.onload = function() {
        if(this.status == 200||this.status == 304){
            var d = document;
            var s = d.createElement('script');
            s.src = '//<%= theme.comment.disqus.shortname %>.disqus.com/embed.js';
            s.setAttribute('data-timestamp', + new Date());
            (d.head || d.body).appendChild(s);
            document.getElementById('disqus_click_btn').setAttribute("style", "display:none")
        }
    };
    xhr.ontimeout = function(e) {
        document.getElementById('disqus_click_btn').setAttribute("style", "display:block");
    };
    xhr.onerror = function(e) {
        document.getElementById('disqus_click_btn').setAttribute("style", "display:block");
    };
    document.getElementById('disqus_click_btn').onclick=function() { //click to load comments
        (function() { // DON'T EDIT BELOW THIS LINE
            var d = document;
            var s = d.createElement('script');
            s.src = '//<%= theme.comment.disqus.shortname %>.disqus.com/embed.js';
            s.setAttribute('data-timestamp', + new Date());
            (d.head || d.body).appendChild(s);
        })();
        document.getElementById('disqus_click_btn').setAttribute("style", "display:none")
    };
</script>
