Support » Plugin: Custom Product Tabs for WooCommerce » Change styling tabs

  • Resolved reputations

    (@reputations)


    Hi,

    I’ve set up some custom tabs for different products. I’ve noticed the colors of the tabs were automatically generated (I believe via the settings of the theme I used, Bridge from Qode).

    Now weirdly enough, the colors used, are a bit off compared to the actual style guide colors I’ve set throughout the website.

    Is it possible to provide me some code to change the styling of the tabs? I would like to change the background color of the inactive tabs to #F29D50 and the text color of the inactive and active to white.

    Thanks!

Viewing 5 replies - 1 through 5 (of 5 total)
  • @reputations,

    Every theme implements tabs differently do you have a link to a product so I could see what your tabs look like?

    – Freddie

    Thread Starter reputations

    (@reputations)

    Hi,

    You can find an example on this page: https://viewworks.be/product/100-meter-soudal-sws-vario-extra-70mm-doos-6st/

    You’ll see the difference between colors when you compare the buttons ‘in winkelmand’ en ‘terug naar de webshop’ with the custom tabs.

    Your buttons have this class button wc-backward which is where it gets that color from as well as the width.

    The tabs are getting their styles from some sort of accordion plugin so if you want to match the styles go to Appearance > Customize > Additional CSS and add the following:

    h6.title-holder.clearfix.ui-accordion-header.ui-helper-reset.ui-state-default.ui-corner-top.ui-corner-bottom {
        color: #ffffff;
        border-color: #ef8526;
        background-color: #ef8526;
        border-radius: 0px;
    }

    – Freddie

    Thread Starter reputations

    (@reputations)

    Thanks, that code works great!

    Awesome, glad it worked out for you!

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Change styling tabs’ is closed to new replies.