This is a neat trick to spice up your comment section on Blogger.In this post i will show you how to replace the ‘Post A Comment’ text we see above the comment form with a cool image.I will also give you a few images you can use or you can add your own image.I have some screenshots to show you exactly what we will be changing so lets get started.
Default Comment Message
Image Comment Message
So Lets add an image to your Comment section
Step 1. Click ‘Layout’ > ‘Edit html’for your blog.
Tick the ‘Expand widget templates’ box
Step 2. Find the following code in your blogs html :
<data:postCommentMsg/>
Important – This code will be in your template more than once, you need to find the code wrapped in heading tags (Example – h2, h3, h4).So it will look similar to this :
<h4 id='comment-post-message'><data:postCommentMsg/></h4>
Step 3. Pick an image below and Replace the code you found above with the image code.
Samples – Here is a list of images you can use :
Image Preview :
Image code :
<a href='http://www.spiceupyourblog.com'><img alt='Best Blogger Tips' src='http://3.bp.blogspot.com/_rKG-ziTSNUQ/TQ5eV0U0EiI/AAAAAAAACik/xo2eFaDbfrE/s1600/best+blogger+tips.png'/></a><img alt='Comment here' border='0' src='http://1.bp.blogspot.com/_rKG-ziTSNUQ/TNre4f2TKXI/AAAAAAAACEI/hJTaA5PkDkk/s1600/comments+encouraged+card.jpg'/>
Image Preview :
Image code :
<a href='http://www.spiceupyourblog.com'><img alt='Best Blogger Tips' src='http://3.bp.blogspot.com/_rKG-ziTSNUQ/TQ5eV0U0EiI/AAAAAAAACik/xo2eFaDbfrE/s1600/best+blogger+tips.png'/></a><img alt='Comment here' border='0' src='http://4.bp.blogspot.com/_rKG-ziTSNUQ/TNre5kA-dzI/AAAAAAAACEM/zwpewBceVJ0/s1600/animated+comment+arrow.gif'/>
Image Preview :
Image code :
<a href='http://www.spiceupyourblog.com'><img alt='Best Blogger Tips' src='http://3.bp.blogspot.com/_rKG-ziTSNUQ/TQ5eV0U0EiI/AAAAAAAACik/xo2eFaDbfrE/s1600/best+blogger+tips.png'/></a><img alt='Comment here' border='0' src='http://2.bp.blogspot.com/_rKG-ziTSNUQ/TNre7OZCEzI/AAAAAAAACEQ/oNyvoWQOCuY/s1600/colored+comment+text.png'/>
Image Preview :
Image code :
<a href='http://www.spiceupyourblog.com'><img alt='Best Blogger Tips' src='http://3.bp.blogspot.com/_rKG-ziTSNUQ/TQ5eV0U0EiI/AAAAAAAACik/xo2eFaDbfrE/s1600/best+blogger+tips.png'/></a><img alt='Comment here' border='0' src='http://2.bp.blogspot.com/_rKG-ziTSNUQ/TNre828gxXI/AAAAAAAACEU/_fudrS2N6VA/s1600/comment+cloud.png'/>
Image Preview :
Image code :
<a href='http://www.spiceupyourblog.com'><img alt='Best Blogger Tips' src='http://3.bp.blogspot.com/_rKG-ziTSNUQ/TQ5eV0U0EiI/AAAAAAAACik/xo2eFaDbfrE/s1600/best+blogger+tips.png'/></a><img alt='Comment here' border='0' src='http://4.bp.blogspot.com/_rKG-ziTSNUQ/TNre-ON_RUI/AAAAAAAACEY/oqOWegVu0HA/s320/comment+here+blue.gif'/>
Image Preview :
Image code :
<a href='http://www.spiceupyourblog.com'><img alt='Best Blogger Tips' src='http://3.bp.blogspot.com/_rKG-ziTSNUQ/TQ5eV0U0EiI/AAAAAAAACik/xo2eFaDbfrE/s1600/best+blogger+tips.png'/></a><img alt='Comment here' border='0' src='http://2.bp.blogspot.com/_rKG-ziTSNUQ/TNre_Q_HYQI/AAAAAAAACEc/iCmYoeUHYy8/s1600/comment+here+flowers.png'/>
You can use your own image instead if you need help doing this let me know and i will help.
Once you have replaced <data:postCommentMsg/> with the image code save your template and the image has been added.
Now to add your message above the comment form.
This is very easy simply, Click ‘Settings’ >’Comments’ for your blog as seen in the image below:
Now scroll down to ‘Comment Form Message’ put the message you want in the box provided scroll to the bottom of the page and click save.
Your message has now been added.
Thats it i hope you like your new comment form ! Check out more of our Tips for Blogger Comments.
Leave your comments, Views and Questions below.
Similar Posts
Change Post A Comment Message On Blogger With Text Or Image
How To Add A Fixed Floating Merry Christmas Banner To Your Blog
Make A Rollover Image Effect – Image Changes On Hover
Fix The Sharing Is Caring / Sexy Photobucket Images
Change Post A Comment Message On Blogger With Text Or Image
This is a neat trick to spice up your comment section on Blogger.In this post i will show you how to replace the ‘Post A Comment’ text we see above the comment form with a cool image.I will also give you a few images you can use or you can add your own image.I have some screenshots to show you exactly what we will be changing so lets get started.
Default Comment Message
Image Comment Message
So Lets add an image to your Comment section
Step 1. Click ‘Layout’ > ‘Edit html’for your blog.
Tick the ‘Expand widget templates’ box
Step 2. Find the following code in your blogs html :
Important – This code will be in your template more than once, you need to find the code wrapped in heading tags (Example – h2, h3, h4).So it will look similar to this :
Step 3. Pick an image below and Replace the code you found above with the image code.
Samples – Here is a list of images you can use :
Image Preview :
Image code :
Image Preview :
Image code :
Image Preview :
Image code :
Image Preview :
Image code :
Image Preview :
Image code :
Image Preview :
Image code :
Lightbox Image Overlay Effect Is Now Default On Blogger Blogs
You can use your own image instead if you need help doing this let me know and i will help.
Once you have replaced <data:postCommentMsg/> with the image code save your template and the image has been added.
Now to add your message above the comment form.
This is very easy simply, Click ‘Settings’ >’Comments’ for your blog as seen in the image below:
Now scroll down to ‘Comment Form Message’ put the message you want in the box provided scroll to the bottom of the page and click save.
Your message has now been added.
Thats it i hope you like your new comment form ! Check out more of our Tips for Blogger Comments.
Leave your comments, Views and Questions below.
Similar Posts