Replace "Post a Comment" Text With a Cool Image/Text On Blogger

Spice up your comment section by changing your old boring "Post a Comment" text with cool image or a text as you wish.This is a very simple hack you don't need to add any JavaScript or any other codes just replace a piece of code with your own image or text.Here I am giving few image which you can use these images or you can add your own images.Now lets go to the tutorial:

How To Replace Post a Comment Text?

1. Go to Blogger Dashboard > Design > Edit HTML.
2. As always download/backup a copy of your template.
3. Tick expand widget template checkbox
4. Now find below piece of code in your template

<data:postCommentMsg/>

You will find this code more than once,you need to find the code which looks like this -

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

Now replace above red colored code with one of the below image code.Here you can use your own image or your own text also.

Some Image Samples

Here I am giving some sample of images you can use them or you can add your own image.

Sample 1

<a href='http://www.helperblogger.com/'><img alt='Blogger Tricks And Tips' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjrd84gTlFvBsMKs3DoEvLo_hTHb0Eipgy9zl32BGk82NAxumyFGjVB-zKehQYpuFM-GZoHUcbrYZc5lU8pLNRHhbZXAKrSanG7r5bajZulC_a2OwYz_8oS9S6ZXK8JhO07F16hf1t-34I/s1600/blogger-ticks.png'/></a><img alt='Comment here' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhwUQb8uFvFK-nUiskF9psFefrxv8wTTtKs7pknfWKUBnP8NA5KF8CfjkRpBpyOVc6-sFNfXCmnsUAytwW0v-lC6XxKvk_FVAdzxRqkPSRSmj7B8m_SNeO2hiEDXlW1detSCa4cnxlYdxo/s1600/leave+a+comment.png'/>

Sample 2

<a href='http://www.helperblogger.com/'><img alt='Blogger Tricks And Tips' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjrd84gTlFvBsMKs3DoEvLo_hTHb0Eipgy9zl32BGk82NAxumyFGjVB-zKehQYpuFM-GZoHUcbrYZc5lU8pLNRHhbZXAKrSanG7r5bajZulC_a2OwYz_8oS9S6ZXK8JhO07F16hf1t-34I/s1600/blogger-ticks.png'/></a><img alt='Comment here' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7gpeNUCUQE8Jz2xdxhUVM8K0POSBiH_8UkzVQIpBRUrE9qHz7TuIvt_reEyr-Wn5hhrp-wLsqoUx59mQLc86HHBVBDIR_Ck9E8Ww-yTlTJXakUyoGfHD-AbR6HfjAt0gBfbcpourELZs/s1600/Post+a+comment+blogger.png'/>

Sample 3

<a href='http://www.helperblogger.com/'><img alt='Blogger Tricks And Tips' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjrd84gTlFvBsMKs3DoEvLo_hTHb0Eipgy9zl32BGk82NAxumyFGjVB-zKehQYpuFM-GZoHUcbrYZc5lU8pLNRHhbZXAKrSanG7r5bajZulC_a2OwYz_8oS9S6ZXK8JhO07F16hf1t-34I/s1600/blogger-ticks.png'/></a><img alt='Comment here' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQS4bQCPh7c07mImkCGUcObw1HsCTh_INpnx6-Qvk_b-uYg4xBiRivKp8Exu_iFaf_1G-CLTGwAgoud-GQAwhxrFqzpw04aaKw8yNCWFUG5PClZP976qzFkgDYgUcB5ziSR1pMRH0e18_4/s1600/comment.gif'/>

Sample 4

<a href='http://www.helperblogger.com/'><img alt='Blogger Tricks And Tips' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjrd84gTlFvBsMKs3DoEvLo_hTHb0Eipgy9zl32BGk82NAxumyFGjVB-zKehQYpuFM-GZoHUcbrYZc5lU8pLNRHhbZXAKrSanG7r5bajZulC_a2OwYz_8oS9S6ZXK8JhO07F16hf1t-34I/s1600/blogger-ticks.png'/></a><img alt='Comment here' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEivQsxSVvHTkZnWeezPXbPqc5Zsx4WkEsGQ8fNE0jYvYomLx-SUST-KHnv4wdtNzgS_xa61COCY5PkfN8vFhLirql6ajiFJkeHc_LbSFY3_Ui3OzOspbaDbAOpn22G2BwAowF5upgq9cmdN/s1600/colored+comment+text.png'/>

Now save your template and you are done.

Don't forgot to check - customize your own comment box with using CSS.