I recently switched to remark box for comments and I’m having trouble lazyloading it…
I want to add a click to show comments button, and when user clicks on that the script should load!
My Blog: Geek’s World
Theme: Casper Two
Git repo: Github
You can see how I did it in disqus by going to commits section.
This is the script that I want to load at click!
<noscript>
<iframe id=remarkbox-iframe src="https://my.remarkbox.com/embed?nojs=true" style="height:600px;width:100%;border:none!important" tabindex=0></iframe>
</noscript>
</div>
<script src="https://my.remarkbox.com/static/js/iframe-resizer/iframeResizer.min.js"></script>
<script>
var rb_owner_key = "mykey";
var thread_uri = window.location.href;
var thread_fragment = window.location.hash;
function create_remarkbox_iframe() {
var src = "https://my.remarkbox.com/embed?rb_owner_key=" + rb_owner_key + "&thread_uri=" + thread_uri;
var ifrm = document.createElement("iframe");
ifrm.setAttribute("id", "remarkbox-iframe");
ifrm.setAttribute("scrolling", "no");
ifrm.setAttribute("src", src);
ifrm.setAttribute("frameborder", "0");
ifrm.setAttribute("tabindex", "0");
ifrm.setAttribute("title", "Remarkbox");
ifrm.style.width = "100%";
document.getElementById("remarkbox-div").appendChild(ifrm);
}
create_remarkbox_iframe();
iFrameResize(
{
checkOrigin: ["https://my.remarkbox.com"],
inPageLinks: true,
initCallback: function(e) {e.iFrameResizer.moveToAnchor(thread_fragment)}
},
document.getElementById("remarkbox-iframe")
);
</script>