Copy the link of your hand-made feed and go to Bookmarks » manage bookmarks » new live bookmark. Past the link, give it some short name then drag it to the bookmarks toolbar folder.Comment Notification Added
I've been looking at some of the Blogger Hacks and I became inspired to write one of my own. Someone requested to some sort of notification to indicate when new comments have been added to a post. I wrote some code to modify the Peek-a-boo comments hack to implement this. The new code will create some cookies to save the comment counts for each post. If the comment count has changed since the comment was last expanded, the page will indicate that new comments have been added.Of course, the first time you load the page after it has been implemented, all comments on the page will be new. Once you expand each of the comments sections, the cookies will be created. The next time you load the page, it will no longer tell you there are new comments (unless there actually are new comments). It works pretty well, so I'm going to send it to the good folks at Blogger to see if they'll publish it. If they do, I'll be sure to post about it. If you're interested about the implementation details, read on.
Just like with peek-a-boo comments, add the following two lines to your stylesheet:
.commenthidden {display:none}
.commentshown {display:inline}
Next, add the following Javascript between the <head></head> tags:
<script type="text/Javascript">
function togglecomments (postid,commentcount) {
var whichpost = document.getElementById(postid);
if (whichpost.className=="commentshown") {
whichpost.className="commenthidden";
}
else {
whichpost.className="commentshown";
createCommentCookie(postid,commentcount);
}
}
function createCommentCookie(postid,commentcount) {
domain = "<$BlogURL$>";
domain = domain.split("/");
domain = domain[2];
document.cookie = postid + "=" +
commentcount +
"; domain=" + domain +
"; expires=Thu, 01-Jan-40 00:00:01 GMT; ";
}
function getCommentCookie(postid) {
postid += "=";
startpos = document.cookie.indexOf(postid);
if(startpos == -1)
return 0;
startpos = startpos + postid.length;
if(document.cookie.indexOf(";", startpos) != -1)
endpos = document.cookie.indexOf(";", startpos);
else
endpos = document.cookie.length;
return document.cookie.substring(startpos, endpos);
}
</script>
Search for the code between the <blogger></blogger> tags that displays the link to the comments. It should look something like this:
<blogitemcommentsenabled>
<a href="">#comments">
<$BlogItemCommentCount$> comments</a>
</blogitemcommentsenabled>
Replace this section with the following code:
<blogitemcommentsenabled>
<a class="comment-link" href="">',<$BlogItemCommentCount$>)">
<script type="text/Javascript">
numNewComments = <$BlogItemCommentCount$>-getCommentCookie('c<$BlogItemNumber$>');
if(<$BlogItemCommentCount$> == 0)
document.write("Be the first to comment!");
else if(numNewComments == 0)
document.write(<$BlogItemCommentCount$> + " comments");
else
document.write(numNewComments + " new comments added!");
</script>
</a>
</blogitemcommentsenabled>
This will display the comment notification and create the link to display/hide the comments. Finally, the comments section will need to be properly labeled for hiding and displaying. Search for the following:
<itempage>
<blogitemcommentsenabled>
[ ... lots of comment code here ... ]
</blogitemcommentsenabled>
</itempage>
And replace it with this:
<span class="commenthidden" id="">">
<blogitemcommentsenabled>
[ ... lots of comment code here ... ]
</blogitemcommentsenabled>
</span>
Voila! You now have peek-a-boo comments, plus comment notification! This hack is probably more useful if you have a site where people frequently comment on the posts. For a good example of it in action, check out the Stu Crew site.
55 Comments:
Thanks for posting this. I modified my template and can get evrything to work except - the new comments stay new, they don't change. Any idea what I could be doing wrong? I would really appreciate any tips. Thanks so much
Walter, try checking the security settings in your browser. You may have the settings set too high to allow the site to save cookies. Alternatively, you could also add your site to your trusted sites list if you're concerned about cookies on other sites. Let me know if you have any further problems.
Hi,
I got here thru Blogger Knowledge. Your idea sounds interesting and I'm going to try it. Thanks.
Hey there. I really like your hack! I added a bit of code so that it says "1 comment" instead of "1 comments" and "1 new comment" instead of "1 new comments"
<blogitemcommentsenabled>
<a class="comment-link" href="">',<$BlogItemCommentCount$>)">
<script type="text/Javascript">
numNewComments = <$BlogItemCommentCount$>-getCommentCookie('c<$BlogItemNumber$>');
if(<$BlogItemCommentCount$> == 0) {
document.write("Be the first to comment!") }
if(numNewComments == 0 && <$BlogItemCommentCount$> > 1) {
document.write(<$BlogItemCommentCount$> + " comments") }
if(<$BlogItemCommentCount$> == 1 && numNewComments == 0) {
document.write("1 comment") }
if(numNewComments == 1) {
document.write("1 new comment added!") }
if(numNewComments > 1) {
document.write(numNewComments + " new comments added!") }
</script></a>
</blogitemcommentsenabled>
also, i did have the same problem as walter. When i copied the code from the cru stew template however, it worked. so there must be a typo somewhere...
Keep up the good work!
This is fantastic! I've used it on my blog. I actually had trouble with the Peek-a-boo code from Blogger Hacks and went searching for something else when I found this; yours works perfectly and has better functionality!
When I find the time I'll try to modify it so that when "be the first to comment" is clicked, it takes you straight to the form.
I'm very pleased to learn that more people are using the hack. It's a very nice feature if you have a blog that receives a lot of comments.
Great work with a straight forward tutorial. Cheers!
Do you have any version to add the notifications to the standard comments (non peek-a-boo)?
Hmm... Zorak, I think you probably could do it without peek-a-boo comments by still using the createCommentCookie and getCommentCookie functions. Try adding those two functions and add the JavaScript code between the BlogItemCommentsEnabled tags (ignore the href part for toggling). I think that might do the trick.
I have a small hack in my blog to add a textarea instead of using the routine "Post a comment" link.
See the code hereAnd here's another hack to add rel=nofollow tag.
See the code hereHTH
Blogger folks have updated their comment system and it now allows you to add comments as anonymous even while staying on the same page.
Amit - The Indian Blogger
I'll have to take a look when I get the chance and see if I can modify the code to post on the same page. It is somewhat inconvenient having to go to a different web page to add comments.
I changed the code a bit so that clicking on "Be the first to comment" takes you straight to the BlogItemCommentCreate link.
<blogitemcommentsenabled>
<script type="text/Javascript">
if(<$BlogItemCommentCount$> == 0)
document.write("<a class="\" href="\">\">Be the first to comment!<\/a>")
else {
document.write("<a class="\" href="\">\',<$BlogItemCommentCount$>)\">")
numNewComments = <$BlogItemCommentCount$>-getCommentCookie('c<$BlogItemNumber$>');
if (numNewComments == 0 && <$BlogItemCommentCount$> > 1)
document.write(<$BlogItemCommentCount$> + " comments")
else if(<$BlogItemCommentCount$> == 1 && numNewComments == 0)
document.write("1 comment")
else if(numNewComments == 1)
document.write("1 new comment added!")
else if(numNewComments > 1)
document.write(numNewComments + " new comments added!")
document.write("<\/a>")
}
</script>
</blogitemcommentsenabled>
You can see it working here.
Thanks for sharing your work.
Thanks for your excellent hack, which I've happily tried out.A question: Now when you link from somewhere else to a post (using the time-dated link at the bottom of a post), it takes you to a page with just the original post and without any of the comments below it (in the default Blogger comment mode the link includes the comments). Is there a way to make the link to the post also include whatever comments there might be?I don't know if you're still checking this thread (I got here via the "Blogger Hacks" page), but thanks in advance for any thoughts you might have.
wg,I may be misunderstanding, but I do not believe I have that problem on my blog. It may be the way the code in your template is set up that is preventing the comments from appearing on the direct-link page.
Hi, I got here thru Blogger Knowledge. Your idea sounds interesting and I'm going to try it. Thanks.http://buy-levitra.spydar.com
Hello Jorge...I'm here to asking you help implementing that 'comment notification added' in my blog...I couldn't do it because I have change some things in my template...and that's why i think it doesn't work...If I give u my template...you can change it for me, by the way I can use your tool?Sorry my english...I'm portuguese
This post has been removed by the author.
Hello Jorge...I'm here to asking you help implementing that 'comment notification added' in my blog...I couldn't do it because I have change some things in my template...and that's why i think it doesn't work...If I give u my template...you can change it for me, by the way I can use your tool?Sorry my english...I'm portuguese
Thank you so much for your great help im my template...
Found a bug.When a comment is deleted, either by an admin or by a reader herself, the entire "comments" link disappears.
Nice hack. I use different ways of showing comments. One is the popular Farrago hack, another is one I whipped up myself, that shows below the post the date and author of each comment for that post. You can see the code for it here.You can see it in action here as well.
Hello!thank you for the script.I've modified it a little bit so that the just the cookie regarding a comment (not a peek-a-boo) page you open is updated. This way when you go back to the main page you can still see the new comment indicator for the other comment pages you haven't opened yet.In order to do that you need to delete from the script the following string:createCommentCookie(postid,commentcount);You will call this function when you click on the link to the comment, using the onClick property:<\a class="comment-link" href="http://www.blogger.com/comment.g?blogID=XXXXXX&postID=<$BlogItemNumber$>&isPopup=true" onClick="createCommentCookie('c'+<$BlogItemNumber$>,<\$BlogItemCommentCount$>);"\>Hope that helps!I've also modified your script in order to work with the YACCS commenting system, I've posted it the YACCS message board.Saludos!
Thenx for this great piece of script! I am translating it is Dutch now! Take a look.
Thanks a lot Jorge, it works. Check this out.
Jorge, thank you very much for your code. It works extremely well, with the minor problems already noted. I, too, had the problem that wg had. I've been able to solve it by just changing the "commentshidden" line to "commentshown" (specifically for the permalink page, though I suppose you could do it for the main page as well). I understand that you don't have that problem, but I combed through your source code twice and was unable to find what you're doing different than I am.As for the Rich Miller bug, my solution was to simply take out the BlogCommentDeleteIcon.I hate reading the This post has been removed line anyway...
Now, I'm using it for my photoblog. It's cool Jorge.
you are right
I have a post that describes various add-ons & hacks for blogger that I'm using at Freshblog. It points to a lot of resources that are making blogging much more interesting for me, & hopefully for my readers!! Hope you find it useful.
it is great Jorge! Just made a version in Greek. If anybody wants it, contact me...(I mean the changes are really minor, but if you are so lazy contact me :-)
I just noticed a small problem:i am surfing with a fast connection, so I don't care but for regular users the website has become veeeryyy slow. I guess it is because all coments are loaded before the page is displayed and we have quite many comments.Is there some way to make it load the comments only upon clicking on the link?Alternatively, can I use the notification without the peek-a-boo feature? The way you described to Zorak is not really working...Thanks for any help :-)
Thanks for this great code, may I translate it in French? (of course with your post url)By the way have you any idea to classify the comments in a chronological way...the newest at the top of the list?thanks for your blogger community helpingd(^_^)b
Oui! Please feel free to translate it into French. ;) I'm uncertain if it is possible to reverse the order cronologically. Perhaps you could make a feature request to the good folks at Blogger.
thanks for te authorization ;)I suggest you just a little idea, to post a comment, people have to clic on the "a lot of new comments button", go to the bottom of the looooong list of all your comments ;), you just may add the "post a new comment" at the top of the list (=DElse I will look this post that explain how to reverse the archive list, to find a way for changing the comments order, may be it will work?...And finally don't worry for the translation, I understand your language far better I speak it;]D)Thank you again
hmm.. hell nice plugin. is this post also applicable to the posts? I want the reader to know, which post is new. do you know what i mean? please help and send message back. THX
I don't know of a way to mark which posts are new. However, if you look at krom's comment above, he links to a page that describes how to sort them in reverse cronological order.
Have expanded & organised my blogger hacks posts into blogger hacks: the series, a growing list of add-ons, bookmarklets and template tag combinations that can make blogger more fun, more interesting and more interactive. There's stuff there about categories, but plenty of other goodies too. Check it out, and leave your hack in the comments or ask me to link to it.
Thanks for the great hack page John!
Hi JorgeI know I am no tecnical miracle but I really tried to make it work.... could not get it dome though.I love tecnical tips and trics like this so maybe you can help me?I also love the marked items as on the Stu crew page.... Thanks!
What website are you trying to add the notifications to? Perhaps you could email me the code for the template and I can take a look to see if I can find the problem.
gracias! muy pero muy bueno el datochequea mi bloghttp://elblogdelosblogs.blogspot.comchau
Thanks for the hack! I've modified it like Emanuele Ziglioli suggested and it's working really well.
hi jorge,your hack was what i was trying to find for sometime but when i tried it, the comments link disappears from the archived postpage. i must be so tech idiot.. :(would u know how to help me?? sigh
D, if you like, you can email me the template code and I can try taking a look at it.
This post has been removed by a blog administrator.
I think after making use of the information provided by your wonderful blog, I should drop by and say thanks. In fact, many thanks for sharing this tip. I'm looking forward to more blogger hacks from you.
Nice hack. I'd suggest using an onclick handler and keeping the href attribute for browsers with javascript turned off, though.
good point Johan, that was the first thing I did.It's a nice script you wrote, to bad I dont have any comments. hehehe
Hello!(Sorry for my english)Very nice work! Unfortunately in my Blog (http://luganobeach.blogspot.com) don't work.Assign (i suppose) correctly the link to the comments, the code show (Be the first...bla bla bla)..but...if i click on a comments, don't open nothing. I can't add a new comment, ecc.Can you check in my code where is the fault? Thank you very much!!Best Regards!
I got cofusing when put the code of peek a boo hack.
where do i paste this? and do i need to be the admin to change stuff?
Hi, I got here thru Blogger Knowledge. Your idea sounds interesting and I'm going to try it. Thanks.
Holy Crap!!!I've been trying to get these dang peekaboo comments to work forever. I came across your post today. Tried it....Voila!! Thanks a lot. Works perfectly.
Trying to add your "Comment Notification" code to my testing blog, using SonOfMoto template. Created some posts to add comments to and this is what happened: Test BlogCan you tell me where I went wrong?
Post a Comment