Tuesday, March 24, 2009

Give your SideBar A looks

First of all Goto Blogger's Edit Html Page (Sign in->Dashboard->Layout->Edit HTML).After that Paste the Following code Between <head> and </head> Tags in that Page.If you find the Code with .sidebar h2 { then replace that whole code .

.sidebar h2 {
background: #CCCBB9 url(http://img133.imageshack.us/img133/3540/h2bgwn2.png) top center no-repeat;
padding: 5px 10px;
margin-bottom: 0;
color: #333;
}
This code is for the Original Minima with Sidebar 220px which gives style to Sidebar Title.The Image used is of 220X10 size. If you have got Sidebar more than this then Make a picture Like this or Edit This to the width equal to your Sidebar.Then Upload that Image to Image host like Photobucket,Imageshack and replace the above Image Url with that Uploaded Image Url.

Now the second and the Last Step.Paste the following code with the above code in your Template.
.sidebar .widget-content {
border-left: 3px solid #CCCBB9;
border-right: 3px solid #CCCBB9;
border-bottom: 3px solid #e0d5c2;
padding: 10px;
}
.sidebar .widget {
margin: 0 0 20px 0;
padding: 0;
}
This code gives style to Sidebar Content.After you complete this tep Save your Template and see the result.






Comments :

0 comments to “Give your SideBar A looks”


Post a Comment