Thursday, September 22, 2011

How Do I Add Border Around My Blogger Blog?

Firstly, assigning borders to your blogger blog is fairly an easy task to do. Before we get into the process, I want you to know some things about borders. You can change border styles as you like and also border colors too. On the other hand, you definitely can add borders not just around your blog but also around your sidebars or content body, as well.

HTML border styles:


In my examples, I will naturally use solid as default. And the border color will be sort of black. 


Adding Border Around the whole Template:

Simply, go to your blogger's Edit HTML page, and find #wrapper, or #main-wrapper, or something like that which represents to main wrapper of your template. See the code below as an example, which is copied and pasted from my template.

/* wrapper */
#wrapper{width:1060px;padding:10px 0 0 0;
margin:0 auto;
overflow:hidden;
background:#fff;
border: 6px solid #333333;}


Here, 6px is the thickness of the border, solid is the type of  the border, and #333333 is the color of the border. You can increase or decrease the thickness of border, and change the type & color. More precisely, you can change the text solid to ridge, double, groove, as you like and also whatever color you like. 

Tip: To change colors you have to find the specific color's html code. I use GIMP - The GNU Image Manipulation Program, to find html code of any color. There are many other options also. 


Adding Border in Particular:

You can use particular border style (if you wish) for your blogger template. All you'll have to do is: use more specification to your HTML code. We will split up this border: 6px solid #333333; code into as many we need.




border-left: 2px solid #535353;border-right: 2px solid #535353;border-top: 2px solid #535353;border-bottom: 2px solid #535353;





This time I have used four specification for my four sides rather than using one as a whole. Here, you are completely free to organize. You can change every sides color, border types, and thicknesses,  as you'll like it. :)

You can use the same procedure for your post wrapper, or sidebar wrapper too. But don't do anything too fancy that your blog may look to weird. :p

Happy blogging with blogger. :)