How can I remove the variation swatches when

This topic has 11 replies, 2 voices, and was last updated 2 weeks, 6 days ago ago by Rose Tyler

  • Avatar: Jade
    Jade
    Participant
    May 11, 2024 at 03:17

    Hello,

    I would like to remove the variation swatches on the products on any of the pages besides when viewing the product itself. I want them to stay on the single product page but when viewing products on other pages or categories I would like to hide them to make the site look cleaner and less cluttered.

    Please help me figure this out.

    Please, contact administrator
    for this information.
    Files is visible for topic creator and
    support staff only.
    10 Answers
    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    May 11, 2024 at 07:17

    Hello, Jade,

    Thank you for reaching out to us with your request. We understand that you would like to remove the variation swatches from the products on all pages except for the single product page, to achieve a cleaner and less cluttered appearance on your site.

    We can certainly assist you with this customization. Please go to Theme Options > WooCommerce > Shop elements > Variation swatches > Position > Disable.

    If you have any additional questions or concerns, please do not hesitate to reach out to us. Our support team is always available to assist you.

    Best Regards,
    8Theme’s Team

    Avatar: Jade
    Jade
    Participant
    May 15, 2024 at 00:00

    Hi Rose,

    I followed the instructions but the variations are still active on the products.

    Files is visible for topic creator and
    support staff only.
    Avatar: Jade
    Jade
    Participant
    May 15, 2024 at 00:04

    Ok never mind the variations only show on the store front but not on the other pages.

    Thank you for helping me. I also have another question. For the prices listed under the product they are displaying grey but I want them black. How can I change this, please?

    Files is visible for topic creator and
    support staff only.
    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    May 15, 2024 at 07:24

    Hello, Jade,

    We appreciate your prompt response.

    Custom CSS code can be used:

    .content-product .price {
        color: #000 !important;
    }

    https://xstore.helpscoutdocs.com/article/179-optimal-placement-for-custom-css-code

    Best Regards,
    8Theme’s Team

    Avatar: Jade
    Jade
    Participant
    May 16, 2024 at 05:13

    Hi Rose,

    So, thank you for the code it helped. However, I noticed the price and details still show in a grey tone in quick view. Shown in the attached screenshot. The category and tag are also in grey.

    Files is visible for topic creator and
    support staff only.
    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    May 16, 2024 at 07:51

    Hello, Jade,

    You’re welcome!

    Could you please update the previous code as per your earliest convenience?

    .product-content .price, .et-popup-wrapper .product-content .price, .single-tags span, .product_meta span span, .single-tags a, .product_meta span a, .product-share .menu-social-icons li a {
        color: #000;
    }

    Best Regards,
    8Theme’s Team

    Avatar: Jade
    Jade
    Participant
    May 21, 2024 at 22:20

    Hi

    So I added this code and as soon as I did it their happens to appear to be broken CSS on my site now. Im not sure how this would cause the site to display how it is now but something happened to break the CSS. Can you help me adjust this please. Attached is the image for reference.

    Files is visible for topic creator and
    support staff only.
    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    May 22, 2024 at 07:38

    Hello, Jade,

    We would like to inform you that adding custom CSS code solely to alter color settings should not cause any disruptions to your website’s functionality.

    We have successfully resolved the issue by disabling and then re-enabling the cache plugin on your site. We kindly ask that you clear your browser’s cache as well to ensure that the changes take effect.

    Best Regards,
    8Theme’s Team

    Avatar: Jade
    Jade
    Participant
    May 24, 2024 at 22:17

    Hi,

    Rose thank you so much for helping me with this! I appreciate your support patience and knowledge. Thank you again I truly am grateful for it…

    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    May 25, 2024 at 07:15

    Hello, Jade,

    You’re welcome!

    Best Regards,
    8Theme’s Team

  • Viewing 11 results - 1 through 11 (of 11 total)

The issue related to '‘How can I remove the variation swatches when’' has been successfully resolved, and the topic is now closed for further responses

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.