Home › Forums › WoodMart support forum › Product Tab Background

Product Tab Background

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • September 30, 2021 at 2:27 pm #322346

    mht24
    Participant

    Hi,

    I just planned to make my product tab background to black colour. Just only on the product tab. Other remain default colour which white.

    Example at screenshot attached.

    It is possible to do that, if yes could please assist from white to black.

    Attachments:
    You must be logged in to view attached files.
    September 30, 2021 at 10:53 pm #322400

    Elise Noromit
    Member

    Hello,

    Please add this code to the Theme Settings > Custom CSS > Global:

    body .product-tabs-wrapper {
background-color:red;
}

    Please set your color.

    Best Regards

    October 1, 2021 at 3:07 am #322431

    mht24
    Participant

    Hi,

    Ok now i can change background with my color.

    But how change a color for product tab name to white? And font color of description to white also.

    Attachments:
    You must be logged in to view attached files.
    October 1, 2021 at 7:41 am #322478

    Elise Noromit
    Member

    Hello, 

    body .product-tabs-wrapper {
background-color:black;
}
body .tabs-layout-tabs .tabs li a {
color:white;
}
body .tabs-layout-tabs .tabs li a:hover {
color:white;
opacity:0.7
}
body .tabs-layout-tabs p {
color:white;
}

    If you have any questions please feel free to contact us.

    Best Regards

    October 1, 2021 at 8:37 am #322487

    mht24
    Participant

    Hi,

    It working great on the desktop view.

    But on the mobile version, it doesn’t work.

    Is any CSS needed for mobile view?

    October 1, 2021 at 10:10 am #322511

    Elise Noromit
    Member

    Hello,

    Please replace the code with this one, I have added styles for the list as well: 

    body .product-tabs-wrapper {
background-color:black;
}
body .tabs-layout-tabs .tabs li a {
color:white;
}
body .tabs-layout-tabs .tabs li a:hover {
color:white;
opacity:0.7
}
body .tabs-layout-tabs p {
color:white;
}
body .tabs-layout-tabs li {
color:white;
}
body .wd-accordion-title:hover{
color:white;
  opacity:0.7;
}
body .wd-accordion-title{
color:white;
  opacity:0.7;
}
body .woocommerce-Tabs-panel .title {
color:white;
}
body .woocommerce-Tabs-panel p {
color:white;
}
body .woocommerce-Tabs-panel li {
color:white;
}

    Best Regards

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)