Home › Forums › WoodMart support forum › How to hide the cart icon on products on mobile?

How to hide the cart icon on products on mobile?

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • January 22, 2024 at 1:46 am #531994

    tretyakov-daniil32
    Participant

    I would like to hide this icon on mobile devices, leaving only the option to add a product to a wishlist. Is this possible?

    Attachments:
    You must be logged in to view attached files.
    January 22, 2024 at 3:56 pm #532241

    Aizaz Imtiaz Awan
    Keymaster

    Hello,

    Can you please share the page URL I will check and give you a possible solution.

    Best Regards.

    January 22, 2024 at 4:14 pm #532259

    tretyakov-daniil32
    Participant

    Check, please

    January 23, 2024 at 10:39 am #532533

    Aizaz Imtiaz Awan
    Keymaster

    Hello,

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

    .product-grid-item .wd-add-btn {
    display: none;
}

    Best Regards.

    January 23, 2024 at 1:09 pm #532618

    tretyakov-daniil32
    Participant

    Can we do this icon square? 🙂

    January 23, 2024 at 1:13 pm #532620

    tretyakov-daniil32
    Participant

    And can you write code to resize this element in PX?

    January 23, 2024 at 5:13 pm #532749

    Aizaz Imtiaz Awan
    Keymaster

    Hello,

    Please add the following Custom CSS code to Theme Settings > Custom CSS > Custom CSS for desktop:

    .product-grid-item:hover:not(:is(.product-swatched,.quick-shop-shown,[class*="wd-loading)"])) .wd-buttons[class*="wd-pos-r"] {
    height: 60px;
    border-radius: 40px
}

    Best Regards

    January 23, 2024 at 9:49 pm #532853

    tretyakov-daniil32
    Participant

    This code does not produce any result. It just breaks the icon.

    Please note that I only need this for the mobile version of the site.

    The previous code with the circle icon works fine.

    January 24, 2024 at 1:11 pm #533066

    Aizaz Imtiaz Awan
    Keymaster

    Hello,

    Add below Custom CSS code to Theme Settings > Custom CSS > Custom CSS for mobile

    .wd-buttons .wd-action-btn>a {
    width: 60px;
    height: 60px;
    font-weight: 900;
}
.wd-buttons .wd-action-btn>a:before, .wd-buttons .wd-action-btn>a:after {
    font-size: 30px;
}

    Change the value as per your requirements.

    Best Regards.

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