How to replace Post a Comment with an image

While the main secret of getting comments is to have good friends and creating good content, sometimes it is difficult getting more comments when we have a brand new blog that is not visited very often. A pretty good technique is to put images to encourage visitors to comment.

This tutorial will show you how to replace the 'Post A Comment' text that appears above the comment form with an image. Also, below are some images that you can use but you can also add your own image, that depends on your tastes. So, let's proceed with the steps...

How to replace Post a Comment with an image

In order to replace "Post A Comment" message in Blogger / Blogspot, follow the steps below:

Step 1. Log into your Blogger account and select your blog.

Step 2. Go to "Template" and press the "Edit HTML" button

Accessing Blogger template editor

Step 3. Click anywhere on the code area, then press the CTRL + F keys and search for this code (if you can't find the entire code, then search only for the one in red and you should see the rest of it):

<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 image URLs:

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

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWnK4CR6K7AIT8rVuVyJUbI-V1fXBov9R5PjEYLHQI2B7PCrq8wtMZJo4c6n4pY5wPq9IZxpIZnTwPiQ0Lh9vedIqCxyizyKglxoF4hrj24MXYYQBfW3K169gthzUYTsjtUKX7Ss83FR0/s1600/Post+a+comment+blogger.png" />

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

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhckeLyemzy2cDIGIwduC9gHW5dAQZPrK7_TlRU7XUjHWcBjMkcqRfqbyB7G1b0EyC3jgcherx44ThuzNlV5glNiH4T42-kg9cEHuaOUHlo6sMMEjGx0FJBGG1L5ezWy_9eCpm0EjvAto56/s1600/leave+a+comment2.png" />

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCEQ-Nr4fT60V7NpD7qCztHCVYb5A6gSo3eTWsAgpcFdKK0uSjncbclzxAp4_klSNh4KnpksyhLym4X_8cWGruw9Kb-3D3WTf1SDnbzyGl39BvWBjOPpPATET9Gwcq6Ky3NhCaeLJw5QHo/s1600/comment.gif" />

If you haven't found an image on your tastes, you can use your own image instead. Just upload your picture on Blogger, switch to Edit HTML tab, copy the image code and replace <data:postCommentMsg/> with your code.

UPDATE! Step 5. The first steps will replace the 'Post a Comment' text only when there are no comments available. To show the image each time new comments are added, add the code of the image after the 4th of the below code (you'll find it in more than one location):

<p><data:blogCommentMessage/></p>

Also, if you want to center the picture, just place the code in between the <center></center> tags like this:

<center><img src="Image-URL"/></center>

Step 6. Click the 'Save Template' button and you are done.

So this is how we can change Blogger 'Post a Comment' message or text. Hope you enjoy your new comment form!

• Twitter
• Facebook
• Google
• Tumblr
• Pinterest