How To Add Seperator In Blog Posts In Blogger

STEP #1
Log in to Blogger -> Layout -> Edit HTMLand select the tick-box Expand Widget Templates
Then, find (CTRL+F) this code in the template:

.post

this is the cs part that controls your post layout and style, it must contains few css properties like the following.

.post {
margin: 0 0 40px 0;
width: 90%
}

Now we want to add the separator css properties between the opening and closing tags, { and }

Here is the separator css properties :





background: url(Separator-Image-Url);

background-repeat: no-repeat;

background-position: bottom center;

margin:.5em 0 1.5em;

padding-bottom:2.5em;

And here is what you need to change in above code to customize it to your blog.
Separator-Image-Url
Change it to the separator image url,
2.5
If you found that the separator displayed behind part of your post latest line, increase this number, for example to 3.5 Or 4.5.
Now your final code should looks Like The following one.





.post{

margin: 0 0 40px 0;

width: 90%;

background: url(http://www.imagehost.com/separator.jpg);

background-repeat: no-repeat;

background-position: bottom center;

margin:.5em 0 1.5em;

padding-bottom:2.5em;

}

Free Separator Images

Now Here are some free Posts separators to use in your blog, just copy the image url and paste it in to it’s place in above code.

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7SvCO4OELAGb5PLsa7YmsW9Q8SRwbbJeQkO352V8RfNl7BdScvweWjn8PpLrA71ho_yOjogBqgJoDirSkrZ-LayPiUcvLvDmRAxTDh7KiVU4LZ4ayV5DVEVn6q0RspNhbY88vZ1b_e8wA/s1600/barsnake.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjbaR0xU9MfTm1VlEEi2iCNAtAjsZcHOiH7-whH603l8Hp7gGCOlkZANtigpvI8oH-oaB5lhG1_sorCbjyQcDVtXPP29NADOmiUiUoCSWfPYDOHAw_uOTynK5yHp9Uoga77bh-fsfBaVGNH/s1600/bar54.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgPHmLf7HWNEuYDdl5qu4DAo5XwEyUZ_LqqX2HVOrbBaKXoO5cNc9ZkfnMpQDnTSvX3xwtrXr6l_1QuNaLACA9DO5sY7Zsk8bhTi00H5WK8d7D-QIA-mWPsmJshTKmcBTbU-bYfl7nWBTVg/s1600/bar48.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwmsqLtXTa2d9pqb4P6RlZdvVQ8J-PqiJir0Xsg5DcCs4-4KWAWCXHiGecVxQCw3ALdLdGJVxg5Yx5JbFh4a1Nr_0KZvEHjQKocuBeixd3mpb57YgwhxYoKIbM3qHdIbw4waBeuc2aynj5/s1600/bar47.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3I_MlvuXinAZVkbXiUxahFkT1L0dKHfHK3BFYP8M0PtmZhWlQK6tGyXnaZc7dl-qcmArtXXisy5ibETLetNe2bcabExBX14n3ohfCAQda8G2qPD_BGZDFmiV7WYJAbBAEt9XGjXrf_UQ9/s1600/astarl7s.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgsU7-aWOA-etwPCfu82bOP6xihiUQTyg9NlAT7ySF-u7YP8ksAs5EcaYS15uTl7_OXxiRY1NPq1rjuKIyYJlv52OCJUGchSyXICbDRh94LZqfeNiGQ94xX8iYlTbKeXaV52TJviAuPM406/s1600/dividers_129.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWL9M7hrL25hDjT_jq0_i0MgKYAhKle9zZWVfj5FpJLUHVPmzC_ynikK8GpW9iRqyfaRR7yEL8b4P_o2nXh6Oko3dd48P97FnHugo3B9iy1jOh6I4HP-JCwMk9DQ9IjUITUlYoQ5EFuT8-/s1600/dividers_96.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVXaEo508FDZTmMNEnkpADBsbUpxDAIUXm83LdT6NB3XDuaZioshgPNFcDncehBBmPJpHrqNdqK07wcReswDMr1K43x9ju9kCgXju7iKSllKpldjr6xXQkWomQhnAxEoYDjnX6Pr4sQn_l/s1600/clipart-heart-border.jpg

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLEYr_fFflR5-pyxHkLx0SjyyrbLM5pwvQqQ8l8eevL_M2GLCWODTarukBIgjYaDxwMRoSASvIPUW3GL7nhyphenhyphen19uZhyfnxmDk0Yz4xvgzZ0IWZVdDCe2hyphenhyphenIkHchUO0Zz0_xlDn7ZlPLKPtB/s1600/chain.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjKrNPBInQuHuCyvvtquVHlvqJ5SqMNYLrjDQ6r5t9M3IAc4rDFu1ziON5QQbcryHekAKfB15SHaCfYNI3YWebuCjFM7Iwy26ZyF7XeIhhGdMl6ppXJwF2WP6td1j8AypahxpoJApjIY-La/s1600/bloodrose.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoJr-NLjuhKjMhpnd1yMR7D8z1dhX_S7z-lWs9zEcpIHIfMHWCqZZulmHgFARRkX8BLAc1xNcWpXwgVg4H66ItkC-7sJ9cLYQPc49K-pQTr0a-usZE14aN39QBcWNPG3ckTFDCGPHltz23/s1600/stonebar.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhaMEK-GlbVnccjlhfAf0Y6FnRVFhuuqOKwc1O4AyFRnWREq03ONn1LC-RE4OZcfzjvY3eXV-ynYH4PNTtKSN2d7c78RYAtKiOzVxPLUNGEcdKU-OdWBD_rqFC9SWEctIyzXCugdtG0UJlU/s1600/resfiles_sdfp.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjNoAtg5vHOu8_Qc2saBhJoIMfL_UkpPTfVtvXE9X5bS2EhmkqGHsoRd02H6uf_tzHU5mYgo8NGMHgo1qoBZBd39aB8HhJzKbBcAt_o8Js-nDYmk1Wym68Y2NKFIKVFjotymHPiiCwdcmMn/s1600/resfileszcp.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtCxFqUhuOVqr54agtx0XWlJfSkazEazk3hHWA-mTKgkyrVrF9gOjNCwtV1JJ2wKexf0pVG9II2nTOKDbuh9DPVVRuHRdHeHuNr3e1wFnSIhAhEDCHJKeUaw3THlXO-vzyCQSwkxEvT91m/s1600/resfiles_output.php.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjk5QLHpVOcpXdbMCkoCRAyOL1A8hFAl7taU9gcyXwntQdCqEfusBmokV8bTMbSmFa8SCbktcdugbYSg915aft9HTTxw605NaaO_snhYjHPzbszlcb78TfBfPNNOZupJOriAm4tqP8ioNPS/s1600/pumpkin-border-hth.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhuqPA3oZFivyrhNwS-MeG5OasJ2hnapAgDTCg_Npfd-5Q7SHAsj5pWyHow6MljECDlnbY5act5Xu6iEfvKEHtiW3vPG9mrLfL2o2TR_VxwqJ6v60ZhCpO66AmYi-z7MzoejKKYB7NFCIxF/s1600/irish-border4.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgSC77a-27aInQ_9JXUmKHEYW1Gf1ZcNHP4J0chT0tWdtvOtKMzNICzsWY-PICDgP_KQDQoF3NQpmZmsDwyq5QeMC7v2kC-5zqTEUr284b8tw2_V0CIBl86wN-DVZZOpQwv3pLvxclxV5G7/s1600/ivy.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhz6XVLc_-Z0Awk126naXc6CWvr7YYxz9HreBmnhYYuFdOeTPqPiF61NDG-9k68oKoMoEEw0xLdQVuIXG7Ks679Ncu-W7Fi4epKvCFUH12deL17_m0mC6NYcyOJdmh-TIe9he0n7TK53jVO/s1600/irish-border1.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEivlZQbEn2GCr5oYQ4eNwyTRuthlK_aJ4RxvtbbKMqCMw9gpCNICjFrJ2bQMmX7aUEOGE-mlsNw5o1XeEcvD8KG0EKywTkUxyttoF4OKAFY_LcXgySy_vuhlaDZPPbabkDbuciRtfrevLUA/s1600/frog54.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2NJw7NkWJJ9L4Vq-HBE2dsEW5giuI_q8dFySp_22GcAWBlR_vmGUwgmbyP70BogA_qmS7iPNscQ2i7ikgpM1162np6Jr0gTlEWAUUMtUoIDdSS1Qzj05FSPFdWVsrEC2ovCTRgdc3as5W/s1600/flowerbar.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZMGeAJvQUzykietgv1_W3QFd-Q27T1L8BRQXnjBgOyeMuMQPwb-PF7KEBBp7LkjPK6qKVC9XWW4pXidCPAkXADUkdzivMNpMi6hBdEerfb7gOFSATlEkQBDND0aSnGqP3IFpaqPXphhCA/s1600/drawing-separator.gif

Need More Separator Images

Ok, here are 3 links to great sites contains hundreds of free separators and page dividers.

leehansen.com

clipartandcrafts.com

bigoo.ws

by Jillur Rahman

Jillur Rahman is a Web designers. He enjoys to make blogger templates. He always try to make modern and 3D looking Templates. You can by his templates from Themeforest.

Follow him @ Twitter | Facebook | Google Plus

Tags: blogger / posts / Seperator

How To Add Seperator In Blog Posts In Blogger andrey понедельник, 22 июня 2015 г. No Comment

by Jillur Rahman

No Comment

How To Add Seperator In Blog Posts In Blogger andrey понедельник, 22 июня 2015 г. No Comment

by Jillur Rahman

No Comment

How To Add Seperator In Blog Posts In Blogger andrey понедельник, 22 июня 2015 г. No Comment