Hey friends I have brought a cool sidebar hack which makes your blogs sidebar looks like Woork and Bloggerbuster Sidebar.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.If you like this post then please link love us .This helps us to do more good works in future.
comments
0 Responses to "Sidebar with rectangular Border and Round Header"Speak Your Mind
Tell us what you're thinking...
and oh, if you want a pic to show with your comment, go get a gravatar!