How can I make rounded corners on the product image?

This topic has 2 replies, 2 voices, and was last updated 1 years, 10 months ago ago by Tony Rodriguez

  • Avatar: anton
    anton
    Participant
    February 12, 2023 at 17:39

    Hello,thank you for the assistance you provide here,i’d like to ask how could I make the product images on my website have round corners? I mean the image on the store page (where all the products are listed) but also on the product page (when you open the product).


    By the way, how could I make the grid in the last picture have rounded corners?

    Thanks

    Please, contact administrator
    for this information.
    1 Answer
    Avatar: Tony Rodriguez
    Tony Rodriguez
    Support staff
    February 13, 2023 at 06:56

    Hello @anton,

    We kindly ask that you copy and paste the following CSS code into XStore >> Theme Options >> Theme Custom CSS >> Global CSS. After clearing your browser cache, please check back to your site.

    .etheme-product-grid-image img {
        border-radius: 10px !important;
    }
    .woocommerce-product-gallery__image {
        border-radius: 10px !important;
    }
    @media (min-width: 993px)
    .woocommerce-product-gallery.images-wrapper {
        border-radius: 10px !important;
    }
    .content-product .product-content-image img {
        border-radius: 10px !important;
    }
    .products-bordered-layout.with-ajax .ajax-content>div, .products-bordered-layout:not(.with-ajax)>div {
        border-radius: 10px !important;
    }
    .products-bordered-layout.with-ajax .ajax-content, .products-bordered-layout:not(.with-ajax) {
        border-radius: 10px !important;
    }

    Best Regards,
    8Theme’s Team

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

You must be logged in to reply to this topic.Log in/Sign up

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