< All Topics
Print

WooCommerce Tabs as Accordion

Paste this code into the child themes style.css
NOTE: This Code won’t work without the JS File and the Code in functions.php
				
					.wc-prd-accordion {
    margin: 36px 0;
}
.wc-prd-accordion-button {
    border-bottom: 1px solid #e5e5e5; /* Change the border color */
    color: #3a3a3a; /* Change the font color for Label */
    cursor: pointer;
    font-family: "Quicksand",sans-serif; /* Change the font-family | Default: "Quicksand",sans-serif; */
    font-size: 14px; /* Change the font size for the Label*/
    font-weight: 400;
    letter-spacing: 1.5px;
    padding-bottom: 3px;
    margin-bottom: 15px;
    text-transform: uppercase;
}
.wc-prd-accordion-pm {
    float: right;
    font-size: 20px; /* Change the size for + to the right of Label  */
    line-height: 1;
    margin-right: 10px;
}
.wc-prd-accordion-content {
    display: none;
    margin-bottom: 20px;
}
.woocommerce div.product .woocommerce-tabs {
    border: 0px solid #ffffff!important;
    margin-bottom: 2em;
}