Thursday 19 April 2012

Adding a background image to tabs menu in Blogger


Add the following CSS to Template -> Layout -> Advanced -> Add CSS

 #PageList1 ul {  
 background-image: url(<url_to_image>);  
 }  

Where <url_to_image> is the URL to the image you wish to use.

P.S! Are you looking to improve your blog? I recommend you check out Bloggers Boot Camp  and Google Blogger For Dummies. Of course, you can also browse the bookstore for other inspiration!

6 comments:

  1. cant get this to work!?

    ReplyDelete
  2. What issues do you have? Be careful with your spellings, and check that your image url is valid. If you're getting any CSS type errors, feel free to post them here.

    ReplyDelete
  3. me too, I cant make it work?!

    ReplyDelete
    Replies
    1. That's odd - things must have changed since I last looked at this. I'll check it out and update this post as soon as I can.

      Delete
  4. it worked for me, I had to adjust the height of my image to get it to show:

    #PageList1 ul {
    background-image: url();
    height:172px;
    }

    but now the actual page sits above the banner... not sure why.

    ReplyDelete
  5. Thank you so much for the tip! I spent hours trying to find a solution and, boom. Problem solved in 1 minute thanks to you! :)

    ReplyDelete

Please leave a comment if you find this blog helpful or interesting! I'd love to hear from you!