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(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgSx5OgtB5mwfJgFbWmZ-jnzV762o2e3_BsC7wTj4Zl6EsYd1oufhyphenhyphen8xXKl8FE-JPleHyDR5ATH_7zzX9IbquF2DNVqayY8Wa_wmkGFu_RHZNGdpmr-I08tSxUiSQ5dWczvXn7WHz3i0qpV/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(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgSx5OgtB5mwfJgFbWmZ-jnzV762o2e3_BsC7wTj4Zl6EsYd1oufhyphenhyphen8xXKl8FE-JPleHyDR5ATH_7zzX9IbquF2DNVqayY8Wa_wmkGFu_RHZNGdpmr-I08tSxUiSQ5dWczvXn7WHz3i0qpV/s1600/separater.png); background-repeat:no-repeat; background-position:center bottom; height: 50px; }
- For Changing the Divider image Change "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgSx5OgtB5mwfJgFbWmZ-jnzV762o2e3_BsC7wTj4Zl6EsYd1oufhyphenhyphen8xXKl8FE-JPleHyDR5ATH_7zzX9IbquF2DNVqayY8Wa_wmkGFu_RHZNGdpmr-I08tSxUiSQ5dWczvXn7WHz3i0qpV/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.
Nice tips bro keep it up. Hard effort keep blogging:
ReplyDeleteHey Hafeez Khan Welcome to our Blog,thanks for stopping by ;)
DeleteDo visit Again :)
Regards,
Ifti
Cool one.
ReplyDeleteHey Pareelel Blog Welcome to our Blog,thanks for stopping by ;)
DeleteDo visit Again :)
Regards,
Ifti
Amazing idea bro.. I am really happy with your blogging ideas and tips. Please keep posting such an informative posts.
ReplyDeleteHey Ankit Kumar Singla,Thanks For Stopping by :) I am agree with you,recently my exams has been started i will back Soon InshAllah,Do Visit Again ;)
DeleteRegards.
Ifti!
Wonderful blog checkout my latest post at
ReplyDeletehttp://definingwords.blogspot.com/2013/04/the-dromedary-camel.html
feel free to leave a comment and like us on facebook
Iftikhar Bhai i need your help in your this blog i have seen that you have add thumbnail images to your post but when i click on the post i do not see any image on post page. only can see images on home page. i want to know how do you add this tricks in your blog?
ReplyDeleteI am really happy with your blogging ideas and tips payudara montok . Please keep posting such an informative posts.
ReplyDeleteI am really happy with your blogging ideas and tips. Please keep posting such an informative posts.
ReplyDeleteThanks for Stopping By , Keep Visiting for more fantastic posts!
DeleteRegards,
Iftikhar
2015 hot jerseys, nike nfl jerseys,mlb jerseys,nba jerseys,nhl jerseys, Christian Louboutin shoes, sale new jerseys,cheap wholesale new jerseys,2015 new nike nfl jerseys, Christian Louboutin uk, nfl hoodies jerseys,nhl hoodies jerseys,nba hoodies jerseys, Christian Louboutin Outlet
ReplyDelete