Okay Geek Farm
Disqus V3 Comments not working in Squarespace - SOLVED
Brandon Davenport
Today I recieved an email from a Reader and it regarded this,
...Indeed ever since they've upgraded, when I put the new theme (narcissus) I'm unable to post a new comment on my website. However I'm able to reply to a comment but not post a new one !!! Apparently so do you but I wanted to make sure that it wasn't because of some compatibility issue since I'm running on Fedora with epiphany as a browser !!! I'm a linux freak & a windows (& mac) hater !!! If it's not open source I'm not for it...
Godspeed,
Iras
I wondered how this could not work, then I thought, "maybe since he is using a lesser known browser, they haven't patched the source code for it yet"
But I was wrong:
Actually it's not a problem with my browser.
I've been talking with the guys from Disqus & the bug was from their end.
I don't have windows and I don't plan on using unless there's a nuclear attack & it's the only os left.....
Anyway there's been some HUGE changes if you want your V3 to work with squarespace under EVERY browser (including opera).Godspeed,
Iras
So as soon as I read that I bolted over to my SQSP blog and saw a bunch of comments that just had "test", thats it. They were all replys, because without this patch, you cant leave comments with the V3 Disqus framework.
All hope is not lost :D
this Java-Genius figured out how the heck to get this working with a simple fix.
First
Download this Java script file - Download <1KB
Then Upload it to anywhere you like in your squarespace folder storage.
Then
If you have the "Code Injection" option, copy and paste all this code into your "Site HTML Header" section.
NOTE: replace all bold text with the appropriate string
<script type="text/javascript" charset="utf-8">
var disqus_forum_url = 'YOUR_DISQUS_USERNAME';
</script>
<script type="text/javascript" src="http://path-to-storage/area/disqus.js"></script><script type="text/javascript">
var disqus_url = Squarespace.Constants.OBJECT_PERMALINK;
var cEl = document.getElementById('comments');
cEl.id = 'disqus_thread';
cEl.innerHTML = '';
</script>
<style>#comments .caption, #comments .text, #comments .comment-wrapper { display:none; }</style>
<script type="text/javascript" src="http://disqus.com/forums/YOUR-DISQUS-USERNAME/embed.js"></script>
<script>
(function() {
var links = document.getElementsByTagName('a');
var query = '?';
for(var i = 0; i < links.length; i++) {
if (links[i].href.indexOf('#comments') >= 0) {
links[i].href = links[i].href.substring(0, links[i].href.length-9) + "#disqus_thread";
query += 'url' + i + '=' + encodeURIComponent(links[i].href) + '&';
}
}
document.write('<script type="text/javascript" src="http://disqus.com/forums/YOUR-DISQUS-USERNAME/get_num_replies.js' + query + '"></' + 'script>');
})();
</script>
Or
If you dont have the "Code Injection" option, no worries :D
Go to structure editing, and edit the website footer. Below all your other stuff, paste this.
NOTE: replace all bold text with the appropriate string
<script type="text/javascript" charset="utf-8">
var disqus_forum_url = 'YOUR_DISQUS_USERNAME';
</script>
<script type="text/javascript" src="http://path-to-storage/area/disqus.js"></script><script type="text/javascript">
var disqus_url = Squarespace.Constants.OBJECT_PERMALINK;
var cEl = document.getElementById('comments');
cEl.id = 'disqus_thread';
cEl.innerHTML = '';
</script>
<style>#comments .caption, #comments .text, #comments .comment-wrapper { display:none; }</style>
<script type="text/javascript" src="http://disqus.com/forums/YOUR-DISQUS-USERNAME/embed.js"></script>
<script>
(function() {
var links = document.getElementsByTagName('a');
var query = '?';
for(var i = 0; i < links.length; i++) {
if (links[i].href.indexOf('#comments') >= 0) {
links[i].href = links[i].href.substring(0, links[i].href.length-9) + "#disqus_thread";
query += 'url' + i + '=' + encodeURIComponent(links[i].href) + '&';
}
}
document.write('<script type="text/javascript" src="http://disqus.com/forums/YOUR-DISQUS-USERNAME/get_num_replies.js' + query + '"></' + 'script>');
})();
</script>
Last (if your old squarespace comments don't dissapear)
Paste this code into your custom CSS section (located in the styles editor)
.journal-comment-area .caption { display:none; }
.journal-comment-area .text { display:none; }
.journal-add-comment-area-wrapper { display:none; }
Now you are done!
Test the T3ch H3lp comments to see if it is working ok
Say "Thankyou Iras"
All the Credit goes to Iras.
You can find the origional SQSP forum post here
You can find his EPIC blog Here
and you can endulge in his new free CD here
