Ads Top

How To Add Beautiful Divider(image) Between Each Comment in Blogger

The Comments Section of a Blog is the most important section,Actually readers ideas about the blog Contents are reflected in this Section.Keeping in view this thought you should make your Blogger Comment Section more accessible and neat.To make your Comments Section navigative you should add a divider between each comment,otherwise it just become a jumble of letters and makes the visitors flee away.So be Professional and make your Comments Outlook attractive and Stylish,now How to do,Follow the below steps.

How To Add Beautiful Divider(image) Between Each Comment in Blogger

  • Go To Blogger Dashboard
  • Click On Template
  • Now Click On Edit HTML
  • Now Search for This Tag ]]></b:skin>
  • Now Copy the Below Script and just paste it above ]]></b:skin> tag
Note:- The Below Script is for New Style Comments i.e threaded comments(with reply option)
.comment-block {
background-image:url(http://2.bp.blogspot.com/-Hjv1gf9jTdc/UYDrKFxpU_I/AAAAAAAAAfo/0vsiHYKlZM0/s1600/separater.png);
background-repeat:no-repeat;
background-position:center bottom;
padding-bottom:30px;
margin-top: -10px;
}
.comments .continue {
border-top: 0px solid $(widget.alternate.text.color);
}
Note:- The below script is for old commenting system(with no reply option)

#comments-block .comment-footer { background-image:url(http://2.bp.blogspot.com/-Hjv1gf9jTdc/UYDrKFxpU_I/AAAAAAAAAfo/0vsiHYKlZM0/s1600/separater.png); background-repeat:no-repeat; background-position:center bottom; height: 50px; }

  • For Changing the Divider image Change "http://2.bp.blogspot.com/-Hjv1gf9jTdc/UYDrKFxpU_I/AAAAAAAAAfo/0vsiHYKlZM0/s1600/separater.png" with your Own image url.
  • For changing the height of the image in Old Commenting System change the value 50.
  • Increase or decrease the padding in threaded comments by changing the value of 30px.
  • And Now just hit Save Template and that's it ;)

So What's up

Making Changes in Blogger Template is not easy,but it is interesting ;),make your comment style more beautiful by adding a divider image,stay Blessed Happy Blogging.

Categories

adsense adsense optimization adsense tips Animation Announcement Apps Background backlinks Basic blog Blog Design blogger Blogger Design Blogger Hack blogger pages blogger posts Blogger Security Blogger Special Tricks Blogger Templates Blogger Tips Blogger Tips & Tricks Blogger tools blogger tricks Blogger Widgets Blogger Widgets and plugins Blogging Basic Tips Blogging ethics Blogging tips Blogging Tools Blogging Tricks Btemplates 2013 Btemplates 2014 Bugs and Errors click bombing Comments css CSS and HTMLTricks CSS3 Cursors custom domain Design Drop Down Menu Earning Tips Editing emoticons Events Facebook Facebook tricks Featured Content Slider firebug Flash Free Coupons Free Recharge Gadget Generator Google Google AdSense Google Analytics Google Plus Google Plus Tricks Guest Posts Horizontal Menu How To HowTo Tuts HTML Image Image Effects Increase traffic instagram Interesting invalid clicks Java Script javascript jQuery Label labels Link Building Links LOGO Makers Make Money Make Money Online Marketing Menu bar menus Menus for Blogger Multi Tabbed Navigation navigation menu News Numbered Page Optimizing Other Tricks Page Photoshop Pop Out popular posts Post posts presentations Pure CSS Menu recent comments recent posts related posts Responsive Blogger Templates robots Rss Search box SEO SEO Strategy SEO Tips & Tricks sitemap Slide Show slideshows Social Media social media plugins statcounter static pages Style your Blog swf Tab Menu Template Template Designing Template Tricks Templates templates 2016 threaded comments Tips tools Traffic Tips Twitter Unlock modems Vertical bar Video Wallpapers Web Designing web hosting Webmaster Tools Widget Widget Generators Widgets wordpress WordPress Plugins WordPress Themes WordPress Tricks WP Tips
Powered by Blogger.