Friday, January 18, 2013

Adding a background image to tabs menu in Blogger

Go to dashboard > Design > Edit html  and find this code:

.tabs-inner .widget li a {

And right under it.paste this code:

background-image: url("here is url of your image");

Dont forget to upload image to your bloger,upload image to your post and copy url of that image and paste it.

6 comments:

  1. Hi there!

    I think this is just exactly what I am looking for...one question though...what if I want to give each tab a different background image...how sould I do that? Gr. Debbie

    ReplyDelete
  2. Thank-you for this tutorial! It worked, but now there are gaps in between each tab title. Do you know how I can get rid of those gaps so that the background of the tabs is just one main background? If you can help me, please e-mail me.

    Thank-you!

    Jessica
    www.afternoonstyle.com
    afternoonstyleblog@gmail.com

    ReplyDelete
    Replies
    1. hii,I'll check what the problem is

      Delete
    2. Add this code
      border-left:0px;
      border-right:0px;
      below background-image:("url image");

      Delete
  3. hi, i found the code on my page source but can't find the codes in my edit html page. how do i change my tabs background using the b:widgets tags? thanks :)

    ReplyDelete
    Replies
    1. Find this code in your travel theme on line about : 217 under section /* Tabs

      .tabs-inner .widget ul {

      and after it paste code
      background-image: url("here is url of your image");

      Delete

Namecheap.com