a comment form under post in blogger - like wordpress comment style. (320)
posted under blogger hacks by Rome Uy
sponsored links
Update: This blogger trick is now depreciated. There is a new much better way here: Comment Form Under Post On Blogger, The New Way. Thanks.
Sorry if the title is a little bit too long, well, i don’t know what should i titled it 
Finally i changed the title, thanks Ms Kumiko for your idea 
We know that in blogger.com / blogspot.com readers must click on the new page or new popup window just to leave a comment on our articles. that sometime just make them (well at least to me) too lazy to leave a comment, even they want to.
it’s true that blogger/blogspot is not like wordpress, in wordpress, we can just leave a comment on the post page. so, why can’t we have the same too on blogger/blogspot ?
we can actually
here is the step.
if you are looking for this same hack for old blogger / classic blogger, please go to this post created by Avi Alkalay.
Please backup your template first before changing anything.
1. Go to your dashboard - > control panel - > edit html
2. Tick the Expand Widget Templates
3. Find this html code below
<b:includable id='comments' var='post'><div class='comments' id='comments'><a name='comments'/><b:if cond='data:post.allowComments'><h4><b:if cond='data:post.numComments == 1'>1 <data:commentLabel/>:<b:else/><data:post.numComments/> <data:commentLabelPlural/>:</b:if></h4><dl id='comments-block'><b:loop values='data:post.comments' var='comment'><dt class='comment-author' expr:id='"comment-" + data:comment.id'><a expr:name='"comment-" + data:comment.id'/><b:if cond='data:comment.authorUrl'><a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a><b:else/><data:comment.author/></b:if><data:commentPostedByMsg/></dt><dd class='comment-body'><b:if cond='data:comment.isDeleted'><span class='deleted-comment'><data:comment.body/></span><b:else/><p><data:comment.body/></p></b:if></dd><dd class='comment-footer'><span class='comment-timestamp'><a expr:href='"#comment-" + data:comment.id' title='comment permalink'><data:comment.timestamp/></a><b:include data='comment' name='commentDeleteIcon'/></span></dd></b:loop></dl><p class='comment-footer'><a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a></p></b:if><div id='backlinks-container'><div expr:id='data:widget.instanceId + "_backlinks-container"'><b:if cond='data:post.showBacklinks'><b:include data='post' name='backlinks'/></b:if></div></div></div></b:includable>
4. replace all code above with this new html code below
(Right click - Save target as or Save link as)
Note: sometime, somehow, if you copy that code, the single quote ‘ character will change to this symbol `
i really have no idea how could that happen. but if it so, please change it back to single character again ‘ to make it work.
Update:
in the code above, you’ll see this line :
http://lifewg.googlepages.com/html-code-leave-comment.gif
That is this image source
You can change that image with your own image if you want to.
5. copy all this html code below on top of your </body> it’s usually second last line of your html code.
<!-- www.jackbook.com --><!-- this to hide and show el --><script languange='javascript'>function showcomment(a,b){var jackbookdotcom = document.getElementById(a);jackbookdotcom.style.display = 'none';jackbookdotcom = document.getElementById(b);jackbookdotcom.style.display = 'block';}</script><!-- www.jackbook.com -->
6. Find this code below:
<span class='post-comment-link'><b:if cond='data:blog.pageType != "item"'><b:if cond='data:post.allowComments'><a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a></b:if></b:if></span>
7. Change or replace with this code below:
<span class='post-comment-link'><b:if cond='data:blog.pageType != "item"'><b:if cond='data:post.allowComments'><a class='comment-link' expr:href='data:post.url + "#comments"' ><b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a></b:if></b:if></span>
8. then after you did step #7, say thank you to me
9. and then click on the “Save Template” button.
10. Look at your blog now, it should now has a commenting system under each post.
how is it? cool isn’t it
There are 2 formats of blogger commenting look,
One is in a new popup window and the other is not.
Make sure to set it on a popup window to have a same format as mine on this blog.
(I bold and highlighted it because seems not everyone paying attention on this
Popup Window will let you have all submitted comments placed on top of the comment form, so it’s good rather then have those placed on the left side of the comment form, so your readers have to scroll it to right first if they want to leave a comment.
But you can try both of them to see the differences anyway.
Update:
If you still have any trouble with this hack, you can download this template. This is an example of template already installed by this hack.
Update:
Please Read here about the new simple and great way to have a comment form under post in blogger with haloscan. (with HaloScan)
Update for above update:
I really disappointed using haloscan on my site. i wish i didn’t install it on the site 
please read here: should we use Haloscan if you wanna know why. thanks
Facts, some cool with this hack:
1. because it uses iframe, so it works in it’s own area, in other words, it’s like use an AJAX on our comments. so readers / commenter can see their comments immediately after they click on the submit comment button. isn’t that cool?!
2. Because this feature usually only exists on wordpress, some people think this blog powered by wordpress. they wrong!
3. found another one ? please tell us on the comment below, and i will added it with your link
Thanks for trying this.
sponsored links
Get Our Articles Sent To Your Inbox?
Or read this blog via Your Feed Reader?
ALL
Make Money and Blogging Only
test…
*it will be so embarrassing if it failed
so let me be the first*
so this is the first post in this site huh
Thanks Jack, I use this at my blog
yeah this will increase commenting because some people don’t see the “Post comment” link
Omar Abids last blog post..Digg sink with diggs, will it fail or success in the future.
Hey it works!
great
Hey i love it.
too bad i don’t use blogger. but at least, this make me so much easier too leave a comment here. hopely all blogger user will use it.
I agree, it works well! Thanks for the tip!
Very well done Jack. Thanks for the great tip. guess you will get a lot of backlinks for this.
Keep up the good work for us (supposedly) underprivileged blogpost-ers.
Ok I did it on my blog and am back.
The code in the screenshots above is perfect. He also linked to another blog if you want to copy the code.
That one is faulty and wont work. Read my comment on that page to understand the mistake.
Essentially its about using ‘ from your keyboard in place of ´ that he has used there.
Easy enough.
PS: Jack, your main blog page doesnt have a “comments” link. If that doesnt detract visitors from commenting, i dont know what will…
@Shypy,
thanks, your support is really appreciated.
i didn’t know that there is no a “comment” link on the home page. thanks, i’ll fix it soon
This is great, actually ! How in the world did you came up with this one?
Jack, thanks for the tip! Checking it out and may add it to The lactivist.
Only problem is when I try to read your page with the post about it, it automatically redirects me to this page in about 3 seconds.
Hello Ms Jennifer,
thanks for visiting us here
i don’t know what does it means by automatically redirects me to this page in about 3 seconds. but i’ll find it out anyway. thanks
oh.. now i get it.
i wasn’t like this before. let’s see what’s wrong.
thanks Ms. Jennifer
nice post!
http://www.wiierrorcodes.com
I agree with your information provided. This is really help in enhancing the knowledge in the specified area.
Regards,
Komail Noori
Web Designing and SEO Expert
Very good work!
Thank for the nice hack
interesting hack. thank you
it would be nice if you can make no bottom scroll bar and invisible frames that will make it very tidy
Good Work
@Admin
Oh, that is a really good idea.
i think it’s only need a little css trick. i’ll do it later. thanks
I tried to implement the code in my template (and I really followed the instruction !) but I can’t have it to work. Basically, it doesn’t change anything to my blog.
Any idea what’s wrong here ? Would you give me a hand ?
I have blogger beta, I thought it might be because of that…
Hi Zhu,
thanks for having a try on this. but just like i said on the post:
Thanks for trying this.
For some of you can’t make it yet, since i can’t guide you live. please make a backup of your template and send it to my email here: lifewg@gmail.com
i will try my best to quickly send it back to you modified.
thanks.
test
hola
Hallo jack, i permit to post again in my blog about it, i like ur post guy..thks
Alright I have a question…
Is it possible to have it underneath the comments? So after they view the comments on my blog, there’s the comment box underneath that… is it possible?
(Go to my blog to see what I mean)
@Budi Wiharto
Of course Budi, please, be my guest. and thank you
@Irjohnson
Yes, i got what you mean. i have been preparing that feature as a comment form for blogger v.2
let’s just hope i can have more time to finish it sooner
thanks, nice template you have there, can i share that
Thanks a lot for this hack. I’ve been having a shortage of comments for a long time. Think this’ll help.
Excellent modification man ! Keep doing gud job.
Thank you so much. My blog cant survive without u!
how about for classic template do you have a hack for inline comment, jack?
Thanks a lot dude. Your tuts makes my blogger blog more efficient. I’m new in blogger blog. I usually use Wordpress. Now i can learn some more from your tutorial.
Hi, thanks for providing this hack. I have written about this kind of thing in my post here.
It’ looks like that if I use the modern template of blogger, how about the classic one ? Can it to be applied ?
Hi Jack, I got a little doubt, I’m using your Fresh Blogger Template (Thanks a million for that!) … & I can’t find the code you mentioned in step 6.
…
I got a suggestion too … can’t we take off the comment frame; won’t that give a more wordpress-ish look?
Great work, anyways, Jack! Rock on!
This is Awesome!
I have used it at
Straight From The Heart
I have mentioned credit where it belongs, just see sidebar and click on credits
I just wanted to know whether there is any way to make this form transparent?
Please, pretty please
GBU and Regards
Arti Honrao
Sorry, just saw the code properly now and I see that there is option to change the color code.
GBU
Arti
It was good till now, but suddenly the form redirects to the comment page of blogger …
Pls have a look at my blog and see if you can help me
GBU
Arti
Hi Arti Honrao
Thanks for using this trick, i really love the way you implement it. i will set your blog as a good demo site.
about redirect to the comment page, i have try to access your site. and it’s all ok. nothing’s wrong there? does it occur once only or often? it’s never happen here, and i have never receive any compliant about that too. have you follow all the instruction correctly?
Hi!
i will set your blog as a good demo site.
Honored
The page had redirected once when I was here and it redirected once at my blog, not it seems to be fine.
Just a little slow in loading, perhaps it is my net speed…
GBU
Arti
Hi again…
Can you please change “his blog” to “her blog”? at the top where you have mentioned the demo blog
Just do not publish this comment
GBU
Arti
opps.. sorry,
sorry. i must be too focus on my writing, so i forget that it is her not his.
i can even see your avatar here, but i wrote it ‘his’
thanks Miss Honrao, you have a beautiful blog there
:d It’s ok
thanks Miss Honrao
I should be thankful to you for the wonderful script
you have a beautiful blog there
Thanks
GBU
Arti
It worked!
I’m just curious about one thing:
I would really like for the comments to automatically appear; i.e., come up as inline text with the main blog page.
As of now, the comments only appear if the comment icon is clicked on.
Do you know how I can change that?
http://www.baconcheese.blogspot.com
Hi Seth
thanks for asking that question.
actually we can set it appears immediately, but unfortunately blogger have their comment form autofocus on the textbox, so if we set it appears imediately, the page will be fully redirected into the comment form.
i have tried once before, and it sucks
Thank you very much… I have been trying to get this and had almost lost hope.. I have implimented it here This is a Tamil blog.. soon i will be adding this to the rest of my blogs too.. thank u sooo much..
Hey,
It was working but now, just like you mentioned in the previous comment, its redirecting the entire page into the comment form.
Suggestions on how to fix this?
Seth
http://www.baconcheese.blogspot.com
Hi.. me again.. would it be ok with you if i translate this entire post and repost it in Tamil
I co-author a techsupport blog in tamil. Most of the readers donot read or understand english..
do let me know if u have any problem..i shall publish the post only after seeing ur reply
@Seth
I have checked on your site and it works fine.
Thanks a lot.
@Deepa,
please be my guest. you are free to post this on your language as long as you keep it linked here.
thanks
I second LRJohnson’s request.
It would be more Wordpress-ish if the comments are shown on the post page. Then below it, would be the frame of the comment form (just the comment form–and not the comments made).
hmm..it looks great…maybe I should try this one..thanks anyway..
what if I am using the classic blogger template? there is no widgets button. when I tried to change to the new blogger layout and tried cutting and pasting back my owld template, it didnt work! help!
I love this comment form …
Wish Blogspot had something like this
GBU
Arti
Test myfunction comment
Xtreemly innerestin subject, i jus’ gon an started a blog didn i just.
So will work it out and get back
Jack, I got below error after doing all your hacks, any idea boss ?
The string “–” is not permitted within comments
??? ????? ????? ????????………..
???? ??? ????????? ??????? ????????? ????????????????, ?????????? ??????????????
????? ??????? ????????? ??????????? ??????????????? ?????……..
??????????? ??? ??? ?????? ??????????? ???? ????????????? …….
?????? ??????? ???? ??????????????????. ????? ????????? ??????
?????? ????? ?????? ?????? ??? ???…… ??? ????? ???????? ???????……….
[...] tutorial ini sudah dibuat oleh JackBook beberapa bulan lalu, tutorial aslinya bisa dibaca di sini. Tapi saya akan menulisnya kembali di sini dengan versi saya karena tutorial aslinya mbulet dan [...]
I used this comment on the post page thing and it worked fine for a couple of months. Some of my blog visitors tole me that the post pages are redirecting to comment page. It works fine for me.
Something not working at me! :((
Can you make a message form for me?
I`ve uploaded my template xml to the sendspace! Download link> http://www.sendspace.com/file/as79nq !
Thanks in advance and i wait for your reply with the template with comment form ar kristofer93@yahoo.co.uk ! Thanks!
Hi Kristofer,
could you send me through my email? i have problem with accessing sendspace. thanks
Jack, izzt possible that i chat with you on the email or msn regarding this coding, cause it is not working well.. I hope you can reply back thanks!
Hi Etienne Teo,
i have mentioned it on the post, if you still can’t install it on your template, please send me your xml template, and i will install it for you.
thanks
it works! Great. Thanks.
hi,
this is a great hack, thank you.
It tried it and it work,
but there is a problem with the line “Comment Form under post in blogger/bloggspot.” It runs over the “previous post, home, and next post” links.
I suppose it’s a simple thing to fix, but I don’t know how.
I’ll come back and check for an answer, if you will post one.
thank again.
S.
HI R_I_D
where do you install it? so i can check it.
thanks
Nice comment Raja tamil
http://www.lyricsenergy.com/lyrics/c/celine-dion/index.php
Hi jack, I have some problems with the step n.5 “copy all this html code below on top of your ” ,but I can’t find “”…!!
this trick doesn’t work with xml?:cry:
thanks 4 your help!!!!
Hi Sevy,
it works for xml. please read all the instructions carefully. if you still can’t do it. send me your template and i will install it for you.
thanks
Hello, very nice site, keep up good job!
Admin good, very good.
i like it Sevy
This is what I have been searching for since a long time.. thanks..!!
Will give it a try..
By the way.. I think that it will be much more user friendly if the Comment Box appears on TOP of the comments..
Can you tweak it further to accomodate this..??
Unfortunately that is impossible since we can not do any modifying with blogger form.
thanks
[...] que gostem! Dica garimpada do blog JackBook http://www.jackbook.com/2007/06/how-to-make-readers-leave-comment.html FONTE: Templates For [...]
This is a nice trick. But i don’t know how to use it on my blog since, i’m not use the custom blogger layout. can you please help me?
well, all you need to is just upgrade your blogger template to the new version Hakeemm.
you can use our template collections here.
thanks
I’m using skins from blogskins.com and i don’t know how to modify it.
Hello, very nice site, keep up good job!
Admin good, very good.
I really cant install the form under comment on my blogger…I cant find this code line of the step 3!
I installed the default template, search for this line, os variables on it and it never match.
Whats wrong? Than i always get errors from xml syntax and i cant load it.
Please give me a little help here.
Cheers
you can backup your template, and i will install it for you.
thanks
hey Jack i cant find the three lines in my template..please help me….thx in adv…..