Tutorial - How to add your new post divider to "NEW" blogger template designer.

NOTE.

To enlarge image:

1. Right click.

2. Click "VIEW IMAGE".

1. Choose your new divider HERE and saving it to your computer.

2. Find out what size your main wrapper is. Design > Template Designer > Layout >Adjust Width. If you set the sidebar to 270 and the Entire Blog is 970. Then the main will be about 700px.

3. Resize your new divider:

A. Login to Photobucket and upload your new divider.

B. Click on "EDIT".

C. Resize.

D. Change the "1 - WIDTH" to the number your main wrapper was. Click "2 - APPLY" and then "3 - REPLACE ORIGINAL."

E. You need this later.

4. Go back to your blog. Select "DESIGN" (Upper right hand corner).



5. You are in "ADD AND ARRANGE PAGE ELEMENTS". Select "EDIT HTML".

6. And look for this.

7. Now replace with this:

background: url(http://DIVIDERADDRESS.jpg);

background-repeat: no-repeat;

background-position: bottom center;

margin:.5em 0 2.5em;

padding-bottom:6.5em;

8. This area - background: url(http://DIVIDERADDRESS.jpg);

Replace the red area shown above with the "DIRECT LINK" from Photobucket (3-E).

9. Looks like this. Preview it to see what you think and save template.

10.Tadaaaa your new post divider.

 

GOOD LUCK :).

SEA.

KEEP IN MIND THAT, DEPENDING ON YOUR SCREEN SIZE. YOU WILL PROBABLY NOT SEE THESE ENTIRE IMAGE ON YOUR BLOG.

NOTE.

To enlarge image:

1. Right click.

2. Click "VIEW IMAGE".

Click HERE to find out how to install your new blog backgrounds.

This is code for 2 column:

<style type="text/css">body {background-image: url(http://i911.photobucket.com/albums/ac315/SJB_2010/ccbbab7d.jpg); background-position: center; background-repeat: no-repeat; background-attachment: fixed; }</style><div id="tag" style="position:fixed; left:0px; top:30px; z-index:10; "><a href="http://www.freebackgroundsandmorebysjb.blogspot.com" target="_blank"><img src="http://i911.photobucket.com/albums/ac315/SJB_2010/02d14444.png" border="0"/></a></div>

This is code for 3 column:

<style type="text/css">body {background-image: url(http://i911.photobucket.com/albums/ac315/SJB_2010/e8c84de5.jpg); background-position: center; background-repeat: no-repeat; background-attachment: fixed; }</style><div id="tag" style="position:fixed; left:0px; top:30px; z-index:10; "><a href="http://www.freebackgroundsandmorebysjb.blogspot.com" target="_blank"><img src="http://i911.photobucket.com/albums/ac315/SJB_2010/02d14444.png" border="0"/></a></div>

CUPCAKES.

<a border="0" href="http://freebackgroundsandmorebysjb.blogspot.com" target="_blank"><img src=http://i911.photobucket.com/albums/ac315/SJB_2010/f930563a.jpg></a>

<a border="0" href="http://freebackgroundsandmorebysjb.blogspot.com" target="_blank"><img src=http://i911.photobucket.com/albums/ac315/SJB_2010/cb3b4ae1.jpg></a>

<a border="0" href="http://freebackgroundsandmorebysjb.blogspot.com" target="_blank"><img src=http://i911.photobucket.com/albums/ac315/SJB_2010/2f437e03.jpg></a>

<a border="0" href="http://freebackgroundsandmorebysjb.blogspot.com" target="_blank"><img src=http://i911.photobucket.com/albums/ac315/SJB_2010/79b25506.jpg></a>

<a border="0" href="http://freebackgroundsandmorebysjb.blogspot.com" target="_blank"><img src=http://i911.photobucket.com/albums/ac315/SJB_2010/10597019.jpg></a>

<a border="0" href="http://freebackgroundsandmorebysjb.blogspot.com" target="_blank"><img src=http://i911.photobucket.com/albums/ac315/SJB_2010/e4e37806.jpg></a>

HAPPY EASTER.

<a border="0" href="http://freebackgroundsandmorebysjb.blogspot.com" target="_blank"><img src=http://i911.photobucket.com/albums/ac315/SJB_2010/2a489761.jpg></a>

<a border="0" href="http://freebackgroundsandmorebysjb.blogspot.com" target="_blank"><img src=http://i911.photobucket.com/albums/ac315/SJB_2010/5cd8f72a.jpg></a>

Post Dividers.

NOTE.
All my dividers are 650 pixels wide.  
  

To enlarge image:

1. Right click.

2. Click "VIEW IMAGE".

To copy image:

1. Right click.

2. Click "SAVE IMAGE AS"

3. Add file name.

4. Save.

Click HERE to find out how to install your new post dividers.