Wednesday, 28 March 2012

How to change Blogger "Post A Comment" Message

In this tutorial i will show you how to replace the 'Post A Comment' text that appears above the comment form with an image. Also, I will make available to you a few cool images or you can add your own image if you like... so let's get started.



How to replace Post a Comment with an image

To replace  "Post A Comment" message in your Blogger / Blogspot blog follow the next steps:

Step 1. Log in to Blogger, go to your Blogger Dashboard >> Design >> Edit HTML

Step 2. Tick the "Expand Widget Templates" checkbox.

Step 3. Now search (CTRL + F) for the code marked in red:

<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>
<data:postCommentMsg/></a>


...and for this one too:

<h4 id='comment-post-message'><data:postCommentMsg/></h4>

Step 4. Replace <data:postCommentMsg/> with one of the below images codes:


<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhemDVW-QyaxOf2R4yl0lBfcHYBAVeJRPZDCiub69isQTJzhuwCM2wryX6Rgyzq8BKp-TMsab1U172PWRUTzzkianzgwmGYPun38K3Ngzt2N8yCdZIzNabEXWSMw3CB8jdSo9Dc1KuEgkY/s1600/leave+a+comment.png" />


<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8Lfr4pDRWrMN6dbm12N0GDelzvZpE7UzIJ3l81Al_pK61qYASSY65T91ISe8q_3Hw1yAE8M9NyGBRQvmSVbB8u4h-p3WACjMf7WVuv-pi05TE-kd4JjQaNP7cSaC8NWX-R9Mc8-A_glE/s1600/Post+a+comment+blogger.png" />


<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhTGhN8WSZysw4d4gInu4w0G5HVSOTbnrQG2wT_Cro17EoylkSyk8nKIwGfJVAqCWHkuuCw-xLlQFl9A9SyIJzNtIUVRH3ZAYHr07p3JMCFODk288TDyFeDH00rr8fEXqKDJwAmurnaf58k/s1600/animated+comment+arrow.gif" />


<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibfOb1AfiCNd8Tn89WmSpm-Di9lFkE86d1SAKZhKDKnCyDvIBs6l31UPLC5qaFDlERceoxqbgOV5HMRPWdYjDqddPBfR83Os8z3u96qvxHXGBMIbFDuZwPphA0s-8R9q4Xj8oC2LhxHNzI/s1600/leave+a+comment2.png" />


<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7SYMtRGrDGImaH1Fupq_C2n9GoGl4m7p4SAnpOm8vrogQ09dY8dESFXmm9NDVrWYtH3jrrFT0IbTpw94hR97iL0zuisKENizQwdwU9QhQd5-uWB2sS_-tiu3q5OoxbN5Bxg5kQQPibHA2/s1600/comment.gif" />

You can use your own image instead. Just upload your image on Blogger, switch to Edit HTML tab, copy the image code and replace <data:postCommentMsg/> with your code.

Step 5. Save Your Template.

Thats it! I hope you like your new comment form !

No comments:

Post a Comment