Creating a Post Divider

So today, I decided to do my first DIY Blog Design: How to create your own post divider. Creating one is actually VERY easy, and you will be pleased by the end of it! If you have no idea how to use HTML codes (as I don't), you're in luck! This blog design aspect is literally just copying and pasting!

What is a post divider?

It's exactly what it sound like, an image that is interested into the layout of your blog with the purpose of visually dividing your post!

Why have a post divider?

For a sophistical answer, it helps other bloggers see the send of a post, and the beginning of a new one, especially if your post have A LOT of text and few pictures.

Other than that... it ultimately looks pretty! (which is why I have one!)

So you want one? Let's begin! ; You can use any programs, I like using Picmonkey!

Step 1: Create a custom image* sized approx. 150px less than the width of your post section by 50px.

For example: the width of my post section is 880px, so the dimension of my divider should be approximately 730px x 50px.

Calculate the width of your post section by going to TEMPLATE, click on CUSTOMIZE, then go to the section ADJUST WIDTHS.  

Step 2: Upload your image somewhere that allows you to obtain the image location - you're only going to need the image URL.

Most people use photo bucket or picasa! As long as your able to get the image URL, it will be fine wherever you post it.  I post mine onto my private separate blog that I use only for designing my blog.

Step 3: Copy and paste this code into your Custom CSS section (Template --> Customize --> Advance --> CSS)

.post{
margin: 0 0 40px 0;
width: 90%;
background: url(YOUR IMAGE URL HERE);
background-repeat: no-repeat;
background-position: bottom center;
margin:.5em 0 1.5em;
padding-bottom:3.5em;
}

The image URL (or Image Address) you copies goes where "YOUR IMAGE URL HERE" says.

Step 4: Click Apply to Blog to save. And tada! There you have it! 

Hope this helped!