Background image for tabs

[sklaw]

Hi there,

Is it possible through a control or css to set a different background image for the tab panel associated with each tab?

appreciate any help

thanks

[christian]

Hey Stacey,

Regretfully, there is no background image option for the tabs so custom CSS is needed. I will record the process to achieve this but it is important to understand that custom coding is not a part of our support service. Fixing and enhancement of the custom code that I’ll post here should be continued by you or your developer.

Please follow the steps from this screencast (just pause and play to follow along if you find it fast). Just also note that we could not also do a recording all the time. I made the recording to show users how to customize using CSS because it often requested.

#panel-5 {
  background-image: url(IMAGE_URL)
}
#panel-6 {
  background-image: url(IMAGE_URL)
}

#x-legacy-panel-1 {
  background-image: url(IMAGE_URL)
}

If you wish to continue on your own, you can learn CSS from this site.

To aid you in finding the right selector’s, you can check out this guide for Chrome.

Hope that helps.