Adding a Side bar header image to a Imageless Side bar header

One reader asked me , whether there is a way to add a side bar header image to a side bar that dose not contain a image. After few trials I found out the way. It is really simple. I tried this trick for few of my blogs that haven't a image for it's side bar and it works well. There will be a problem with resolution. Yet , no error was found.


1. Edit your Template
2. Now find out


sidebar h2


( press 'Ctr
l' + F to open your browser's search box)

Now you will find out some code lines Very similar to these


.sidebar h2,.rsidebar h2, .lsidebar h2{
color: #515151;
font-size: 16px;
font-family: Lucida sans unicode,Arial, Tahoma, Verdana;
font-weight: normal;
text-transform: titlecase;
margin: 0px 0px 5px;
padding: 3px 5px 5px 5px;
border: 1px solid #DEDBD1;
background: #EBE9E1;


Remember , codes lines can be slightly different from above because code lines varies from template to template.


Now replace


background: ( a color code );


with


background: url( URL of your Image) top repeat-x;



Ex:-

background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7wMeysuxulfJIIPdRQv-57yVIloMNEEJW7y__Y6EbSsPN2zgOmERTEK4V7Ysj7bDoRcY_m9xbOBoZMRThFXtYY6S-1CfJBa5hHLmZ6er_jR7f4tXUTJKksNWd7YGFP0FJ8SNjvWIvHVc/s1600/sidebar.jpg) top repeat-x;


Before



After



Now follow the Safety Saving Steps.

And



Some Header Images for you

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi8m2U2VJL3Rc9CEUBpMSS-mu7_EyHZWC2NCujDC5nupDKrkBqRGyoS4iZyDfhF6BTL84D0_K3WZy92Di8pA_JpUYwmDC_xrR-e-IXEBaHXTtID79UT_v13dj-_lcpeRb3ssziwcKbz0oM8/s1600/bg_sb_title.jpg

Image URL :- https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi8m2U2VJL3Rc9CEUBpMSS-mu7_EyHZWC2NCujDC5nupDKrkBqRGyoS4iZyDfhF6BTL84D0_K3WZy92Di8pA_JpUYwmDC_xrR-e-IXEBaHXTtID79UT_v13dj-_lcpeRb3ssziwcKbz0oM8/s1600/bg_sb_title.jpg


https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEia9NgZYdgUfkuxIf0-vV4hE7EP-WYpd9D9YMDho2FpHHFZe9DTde2B5beOhXVyDOCzHsJstiPZvEYoJ-oXITXYzC7oEgN9xVFTFiw7HaUvMURSFwuQ8ZPkN8APM-t3a0FOrVsAX99eZILX/s1600/sidebar-h.jpg

Image URL :- https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEia9NgZYdgUfkuxIf0-vV4hE7EP-WYpd9D9YMDho2FpHHFZe9DTde2B5beOhXVyDOCzHsJstiPZvEYoJ-oXITXYzC7oEgN9xVFTFiw7HaUvMURSFwuQ8ZPkN8APM-t3a0FOrVsAX99eZILX/s1600/sidebar-h.jpg

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJieGABAjFQ0QO4DIW6RWrA-wad4R5aDvbqEKtrZx6sX9FcWbd_qpm2WwO8sHjPOqT24JL-wvWuVeqEGj2nx-W5Ffbh9Vq0B4fD_pk6h8fgL7i8rCogAmB08VrLRYZBIy64Duw2qYQ1qR5/s1600/bg_sb1_g.gif

Image URL :- https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJieGABAjFQ0QO4DIW6RWrA-wad4R5aDvbqEKtrZx6sX9FcWbd_qpm2WwO8sHjPOqT24JL-wvWuVeqEGj2nx-W5Ffbh9Vq0B4fD_pk6h8fgL7i8rCogAmB08VrLRYZBIy64Duw2qYQ1qR5/s1600/bg_sb1_g.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVsavft5Jw_JRtB4d57A4anHRbx_-0YL1SELEKMm1HsOS2vbMgKhAdeiNsXtk4X5dC1M6uymThVupZwaMRzh5gzx3s_uINogRdn_XYkS_Ofg4Ouj7JbD-by9G2OuuQ2T0PqQvqe3vUy-c/s1600/bg_sb1.jpg

Image URL :- https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVsavft5Jw_JRtB4d57A4anHRbx_-0YL1SELEKMm1HsOS2vbMgKhAdeiNsXtk4X5dC1M6uymThVupZwaMRzh5gzx3s_uINogRdn_XYkS_Ofg4Ouj7JbD-by9G2OuuQ2T0PqQvqe3vUy-c/s1600/bg_sb1.jpg

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnkbrUEZLU4CHl-76RKMl8IjIf8ufojXvwYmU3lBwi7xQpB1jVBXJ2cobvqUK9woiXpKk8PsoHVtEDZ23DJIyjKGXmOVFo1DSNTL4DPWmHxPY-ltASsnmnpF0HftIdCCBDTnChw6rd2l4/s1600/bg_sb2.jpg

Image URL :- https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnkbrUEZLU4CHl-76RKMl8IjIf8ufojXvwYmU3lBwi7xQpB1jVBXJ2cobvqUK9woiXpKk8PsoHVtEDZ23DJIyjKGXmOVFo1DSNTL4DPWmHxPY-ltASsnmnpF0HftIdCCBDTnChw6rd2l4/s1600/bg_sb2.jpg


Posting Komentar

0 Komentar