Home Forums WoodMart support forum Styles and colors -> Carousel does not affect product page carousel

Styles and colors -> Carousel does not affect product page carousel

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #642309

    bstert
    Participant

    I want to improve the look of the carousel on the product page. However, the setting Theme settings -> styles and colors -> Carousel does not affect the product page carousel.
    I would have expected that this would affect that as well.

    Where are those settings available for the product page?

    #642510

    Aizaz Imtiaz Awan
    Keymaster
    Xtemos team

    Hello,

    Sorry to say that, Can you please share some screenshots where you want to change the carousel effect, so I can check and give you a possible solution?

    Also, share the wp-login details of your site so I can check and give you a possible solution.

    Best Regards,

    #642556

    bstert
    Participant

    Hi Aizaz,

    I have paid to extend support for this question. I think the default, can you please share wp-login details, is quite exhausting. There is no reason to get my logon details for this topic. This is perfectly reproducible anywhere.

    With respect to the carousel. The settings I tried changing was:
    Theme settings -> Styles and colors -> Carousel

    These settings however do not affect the carousel of the images gallery product pages (both desktop and mobile). This is the class of the carousel on the product page <div class=”wd-carousel-container wd-gallery-images”>

    #642673

    Aizaz Imtiaz Awan
    Keymaster
    Xtemos team

    Hello,

    These settings are for the carousel arrow. For these arrows, you need to use the custom css code. add the below Custom CSS code to Theme Settings > Custom CSS > Global Custom CSS.

    .single-product .woocommerce-product-gallery .wd-arrow-inner {
        background-color: #333;
        color: #fff;
    }
    .single-product .woocommerce-product-gallery  .wd-arrow-inner:hover {
        background-color: #333;
        color: #fff;
    }

    If you have any questions feel free to contact us.

    Best Regards,

    #643002

    bstert
    Participant

    THanks. How do increase the size of the arrow? and the size of the backround of the arrow?

    #643073

    Aizaz Imtiaz Awan
    Keymaster
    Xtemos team

    Hello,

    Please remove the previous code and add the below Custom CSS code to Theme Settings > Custom CSS > Global Custom CSS. change the value as per your requirements.

    .single-product .woocommerce-product-gallery .wd-arrow-inner {
        background-color: #333;
        color: #fff;
        width: 40px;
        height: 40px;
     --wd-arrow-icon-size: 30px;
    }
    .single-product .woocommerce-product-gallery  .wd-arrow-inner:hover {
        background-color: #333;
        color: #fff;
    }

    Best Regards.

    #643443

    bstert
    Participant

    Thanks. It worked:)

    #643680

    Aizaz Imtiaz Awan
    Keymaster
    Xtemos team

    Hello,

    You’re very welcome! I’m glad I could help. If you need anything else, feel free to reach out!

    Thanks for contacting us.
    Have a great day.

    Topic Closed.
    Best Regards,

Viewing 8 posts - 1 through 8 (of 8 total)

The topic ‘Styles and colors -> Carousel does not affect product page carousel’ is closed to new replies.