The alignment of the product slider appears to be inconsistent when a rating is given.

This topic has 22 replies, 3 voices, and was last updated 1 years, 7 months ago ago by Rose Tyler

  • Avatar: Catholicans
    Catholicans
    Participant
    April 12, 2023 at 16:31

    The alignment of the product slider appears to be inconsistent when a rating is given. Is there a way to fix the height of the product section to address this issue?
    The screenshot of Kunjucatholicans
    https://snipboard.io/kObI1R.jpg

    And screenshot of demo section
    https://snipboard.io/8uv7VT.jpg

    21 Answers
    Avatar: Tony Rodriguez
    Tony Rodriguez
    Support staff
    April 13, 2023 at 05:29

    Hello, @Catholicans,

    We have identified that the alignment issue is due to the responsive content and the content underneath it. To resolve this, we suggest that you use Custom CSS. Please copy and paste the following code to XStore >> Theme Options >> Theme Custom CSS >> Global CSS and then clear your browser cache.

    .custom-block03 .content-product {
    height: 500px !important;
    }

    Note: You can adjust the value in the code as per your requirements.

    Best Regards,
    8Theme’s Team

    Avatar: Catholicans
    Catholicans
    Participant
    April 13, 2023 at 05:33

    Thankyou for your reply.
    How can I add white space above the product image in this slider?
    Screenshot given below
    https://snipboard.io/v78odl.jpg

    Avatar: Tony Rodriguez
    Tony Rodriguez
    Support staff
    April 13, 2023 at 09:56

    Hello, Catholicans,

    We apologize for not being able to view the image stuck at the top of the container on your website’s home page.

    Could you please provide us with a complete screenshot of the section containing the product image, as well as the page URL? This will allow us to investigate the issue and provide assistance accordingly.

    Best Regards,
    8Theme’s Team

    Avatar: Catholicans
    Catholicans
    Participant
    April 18, 2023 at 04:51
    Avatar: Tony Rodriguez
    Tony Rodriguez
    Support staff
    April 18, 2023 at 09:50

    Greetings Catholicans,

    We are pleased to inform you that your issue has been resolved. Please clear your browser cache and check your site again. We have added the Custom CSS for the padding on your home page, and you can adjust the padding values as per your requirements. Please refer to the screenshots listed below:

    https://postimg.cc/bsYxLh8c
    https://postimg.cc/94ywC8VY

    Best Regards,
    8Theme’s Team

    Avatar: Catholicans
    Catholicans
    Participant
    April 25, 2023 at 13:29

    I am experiencing alignment issues with product ratings on a specific category page. What steps can I take to address this problem?
    Screenshot : https://snipboard.io/EVWdbB.jpg

    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    April 25, 2023 at 14:28

    Hello, Catholicans,

    Please try to use code from this topic – https://www.8theme.com/topic/is-there-anything-that-can-solve-this-carousel-problem-just-because-the-number-of-reviews-appeared/#post-348728

    Best Regards,
    8Theme’s Team

    Avatar: Catholicans
    Catholicans
    Participant
    April 26, 2023 at 12:40

    When a product has only one line in its product name, the ‘add to cart’ button displays alignment issues when hovering over it. Specifically, the button moves upwards. Therefore, I would like to set the alignment of the ‘add to cart’ button to be static
    Screenshot : https://snipboard.io/y2j1uA.jpg

    Avatar: Tony Rodriguez
    Tony Rodriguez
    Support staff
    April 27, 2023 at 05:15

    Hello, Catholicans,

    We have conducted a review of your site and the Add to Cart feature is properly aligned when hovering over the product. We have captured a video of your site in incognito mode and it is functioning correctly. Please watch it here: https://www.veed.io/view/ec6a7aff-899e-46a4-8940-211a4294214b?sharingWidget=true&panel=share

    We suggest that you clear the cache of your site, plugin cache and browser and check back again.

    Best Regards,
    8Theme’s Team

    Avatar: Catholicans
    Catholicans
    Participant
    April 27, 2023 at 05:39

    This issue caused when I use
    .content-product:hover {
    –product-title-lines: ”;
    }
    the above code.

    Avatar: Tony Rodriguez
    Tony Rodriguez
    Support staff
    April 27, 2023 at 06:22

    Hello Catholicans,

    We are pleased to hear that you have identified the cause of the issue. If you do not require the CSS, then it can be removed as we have provided a video in our last reply which demonstrates that the feature is now working correctly on your site.

    Best Regards,
    8Theme’s Team

    Avatar: Catholicans
    Catholicans
    Participant
    April 27, 2023 at 07:04

    But I want this feature to display the product name in 2 line and full name on hovering.

    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    April 27, 2023 at 12:44

    Hello, Catholicans,

    There is no other solution for you.
    For this time we provided you few possible solutions but no one is perfect for you, unfortunately.
    1/ With only next custom CSS

    .content-product:not(:hover) .product-title a {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    2/ With setting option of Product title limit type → lines and choosing the amount of lines you would like to see at once. And adding the next custom CSS then:

    .content-product:hover {
    –product-title-lines: ”;
    }

    As you know additional customization is out of our scope, according to our support policy → https://prnt.sc/_bGbLLhiz5iv . We really tried to help you but it seems you need to contact the company that provides additional customization service such as https://wpkraken.io/?ref=8theme
    Thanks for understanding our position!

    Best Regards,
    8Theme’s Team

    Avatar: Catholicans
    Catholicans
    Participant
    April 28, 2023 at 05:57

    How can I Correct the alignment for the product slider as shown below:

    Screenshot: https://snipboard.io/KpUtwF.jpg

    This issue also in shop page.
    Screenshot: https://snipboard.io/dqN2n8.jpg

    How can we make static for whole site?

    Avatar: Tony Rodriguez
    Tony Rodriguez
    Support staff
    April 28, 2023 at 06:49

    Hello, Catholicans,

    We are pleased to inform you that your issue has been resolved. Please clear your browser cache and revisit your site to confirm the changes. We have added CSS code under XStore > Theme Option > Theme custom CSS > Global CSS.

    For further reference, please refer to the images provided at the link below. https://postimg.cc/5YhSrRCZ and https://postimg.cc/TpCCdCMW

    We thank you for your patience and understanding.

    Best Regards,
    8Theme’s Team

    Avatar: Catholicans
    Catholicans
    Participant
    April 28, 2023 at 08:38

    By checking it is not solved.
    Screenshot https://snipboard.io/6nPW3t.jpg
    https://snipboard.io/OxszRE.jpg

    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    April 28, 2023 at 09:33

    Hello, Catholicans,

    Thank you for your response.

    By checking it is solved – https://prnt.sc/-ySdUV9Y8lO6 https://gyazo.com/39980708a39f118f36b3415770c27d4d

    Please clear the cache one more time and check, or test it from another browser/device.

    Best Regards,
    8Theme’s Team

    Avatar: Catholicans
    Catholicans
    Participant
    April 28, 2023 at 10:11

    As you’re fixing the alignment of the section mentioned earlier, another part is causing layout modifications. Can you please align it without impacting the layout of other sections on the page?
    Screenshot:
    Before – https://snipboard.io/xIUybj.jpg
    After – https://snipboard.io/pV9neZ.jpg

    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    April 28, 2023 at 13:23

    Hello, Catholicans,

    Thank you for your response.
    Please describe your request in more detail. Right now, it is a bit unclear to us.

    Best Regards,
    8Theme’s Team

    Avatar: Catholicans
    Catholicans
    Participant
    May 2, 2023 at 04:45

    The modification of the alignment of the product slider has resulted in a change in the appearance of the section depicted in this image: https://snipboard.io/xIUybj.jpg. Specifically, the bullets in this section have become hidden. This issue can be attributed to the CSS code responsible for aligning the product slider. How can I solve this?

    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    May 2, 2023 at 12:05

    Hello, Catholicans,

    Thank you for your response.

    Please add the next custom CSS code:

    .swiper-container .swiper-pagination {
        flex-basis: 100%;
    }
    .swiper-container {
        flex-wrap: wrap;
    }

    Kind Regards,
    8theme team

  • Viewing 22 results - 1 through 22 (of 22 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.