How To Add a Post Divider Or Separator In Blog

There are many methods and key techniques that should be used to entertain your visitors with both joy and ease. These techniques or factors may be the background image, color, music, fonts, fonts color, division’s shadows, hyperlink colors and fonts and separators or dividers. All of the above described have their importance that cannot be neglected. But the last one, divider or separator is the most needed one. The presence or absence of the divider can fully change the meaning and idea of the website or blog.

There are hundreds and thousands of blog and websites out there that don’t use any separators between their post and elements. This creates not only an annoying effect on the viewer but also creates difficulty in interpreting the data on the website or the blog, defined and described by the author.

The blogger post usually does not use any divider by default. This results a difficulty in understanding the end point of the post. As for the solution of the problem, a divider can easily be added at the end of the post. That will not only separate it from other posts on the page but also give the finish line for it.

The code given below is the simplest code for the installing of the divider or separator at the end of the posts in the Blogger blog. To install it you have to go to the Dashboard then Template of your blog and then to Edit HTML. Once there paste the code above the “]]>”. If you are using custom CSS then paste the code anywhere in the custom CSS file. Save and you are done.

Code

.post {
margin: 0 0 40px 0;
width: 100%;
background: url(Divider Image URL);
background-repeat: no-repeat;
background-position : bottom center;
margin : .5em 0 1.5em;
padding-bottom : 2.5em;
}

Change the “Divider Image URL” in the above code with the URL of your divider or separator image URL.

Fancy Separator Images

For your convenience some fancy divider images are given below with their URL. Chose the one you like most or use your own.

http://4.bp.blogspot.com/_JwD5r652h00/SuttjmoES2I/AAAAAAAAANw/ bidxxyqfxwg/s1600/barsnake.gif

http://3.bp.blogspot.com/_JwD5r652h00/SuttjcXA_4I/AAAAAAAAANo/ w2BZApq6Jn4/s1600/bar54.gif

http://4.bp.blogspot.com/_JwD5r652h00/SuttjFcWXkI/AAAAAAAAANg/ Ex99MFx60sY/s1600/bar48.gif

http://4.bp.blogspot.com/_JwD5r652h00/SuttiqsszII/AAAAAAAAANQ/ raAoX-EHDUY/s1600/astarl7s.gif

http://1.bp.blogspot.com/_JwD5r652h00/Sutu7XMmvBI/AAAAAAAAAOY/ 8XQyk53329Y/s1600/dividers_129.gif

http://2.bp.blogspot.com/_JwD5r652h00/Sutu7TjXFHI/AAAAAAAAAOQ/ IQlWtZrB5SI/s1600/dividers_96.gif

http://3.bp.blogspot.com/_JwD5r652h00/Sutu7DaxOSI/AAAAAAAAAOI/ Q3okL8VTVQ4/s1600/clipart-heart-border.jpg

http://1.bp.blogspot.com/_JwD5r652h00/SutwFArTx_I/AAAAAAAAAPg/ RlKs6tTx_Mw/s1600/resfileszcp.gif

http://3.bp.blogspot.com/_JwD5r652h00/Sutu65IKnaI/AAAAAAAAAOA/ UJuKQP29vtg/s1600/chain.gif

http://2.bp.blogspot.com/_JwD5r652h00/SutwEnMKk3I/AAAAAAAAAPY/ pz3dI5GhTGY/s1600/resfiles_output.php.gif

http://2.bp.blogspot.com/_JwD5r652h00/Sutv3RFLl9I/AAAAAAAAAPA/ e7VXY-5er8A/s1600/ivy.gif

http://4.bp.blogspot.com/_JwD5r652h00/Sutv28LLgLI/AAAAAAAAAOo/ 3ykBTaQOofw/s1600/flowerbar.gif

http://1.bp.blogspot.com/_JwD5r652h00/Sutv3EVHqdI/AAAAAAAAAO4/ jKfcf3u4IJ4/s1600/irish-border1.gif

http://3.bp.blogspot.com/_JwD5r652h00/SutwEO1pNLI/AAAAAAAAAPI/ FAmwFnDEASw/s1600/irish-border4.gif

http://1.bp.blogspot.com/_JwD5r652h00/Sutu6mRBnpI/AAAAAAAAAN4/ 82pbOVmnl1Y/s1600/bloodrose.gif

http://1.bp.blogspot.com/_JwD5r652h00/SutwFSJ2_LI/AAAAAAAAAPo/ WMkQ9bAcVn0/s1600/resfiles_sdfp.gif

http://3.bp.blogspot.com/_JwD5r652h00/Sutv2gVPVII/AAAAAAAAAOg/ w1Wh7KancXM/s1600/drawing-separator.gif