Last thumbnail has to click twice to active

This topic has 18 replies, 3 voices, and was last updated 1 years, 8 months ago ago by Tony Rodriguez

  • Avatar: steve.li.vt
    steve.li.vt
    Participant
    March 16, 2023 at 17:51

    On product detail pages, like below
    https://mbn-nu.com/product/cell-serum-1-69-fl-oz/

    If the browser width is odd (like 1639px), I have to click twice to active last product thumbnail, please help to fix this issue.

    Thanks,
    Steve

    Please, contact administrator
    for this information.
    17 Answers
    Avatar: Tony Rodriguez
    Tony Rodriguez
    Support staff
    March 17, 2023 at 05:17

    Hello @steve.li.vt,

    Thank you for providing us with the video of your issue. We have tested your site on a browser width of 1639px and it is working perfectly for us with no issues. We have captured a detailed video for you, which you can view here: https://www.veed.io/view/b223a911-1689-4e73-bdfb-458447486e8b?sharingWidget=true&panel=share

    It appears that this is a cache issue on your end, so please try clearing the cache and checking again.

    Additionally, we have the “Disable Old Browser Support” option in our theme under XStore >> Theme Options >> Speed Optimization, which you can try using.

    Best Regards,
    8Theme’s Team

    Avatar: steve.li.vt
    steve.li.vt
    Participant
    March 17, 2023 at 15:12

    Hi team,

    After you change the brower width, please refresh your brower, then test it.

    Thanks!

    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    March 18, 2023 at 18:42

    Hello, Steve.li.vt,

    Upon initial inspection, it appears that the issue is caused by your custom styles from the child theme. We recommend that you comment out all the styles in xstore-child/style.css and then check to see if this resolves the problem. If it does, then you can begin to investigate any potential issues with the styles. If not, then please provide us with temporary wp-admin and FTP access.

    Kind Regards,
    8theme team

    Avatar: steve.li.vt
    steve.li.vt
    Participant
    March 19, 2023 at 21:43

    It’s absolutely not caused by custom styles. I have tested this way so many times before I contact your team.

    Please contact administrator
    for this information.
    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    March 20, 2023 at 16:24

    Hello, Steve.li.vt,

    1/ we removed custom styles from your child-theme/style.css
    2/ clicked “Purche OG cache”
    3/ tested and everything works as expected, so please check your css of child-theme.

    Kind Regards,
    8theme team

    Please contact administrator
    for this information.
    Avatar: steve.li.vt
    steve.li.vt
    Participant
    March 20, 2023 at 18:58

    I tested again, It doesn’t work.

    I saw your videos and found that the max-width should be changed actual width value to even(so the actual width is not odd). This is why you can get the expected result.

    Please remove the max-width or change the value to odd.

    Avatar: steve.li.vt
    steve.li.vt
    Participant
    March 20, 2023 at 19:05

    It takes so much time and can’t move forward. Via forum to solve the issue is too slow. You guys can’t get the points of the issue.

    Do you have other solutions to move forward fast as you can? I don’t want to waste too much time on it.

    Thanks,
    Steve

    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    March 21, 2023 at 09:25

    Hello, Steve.li.vt,

    We apologize for the delay in responding.

    Please do the next test – change all code in your child theme/style.css to

    .swiper-container.swiper-control-bottom.second-initialized li.thumbnail-item.active-thumbnail {
      border: blue solid 5px;
    }

    and check how the border on the last thumbnail in the gallery works. You will get a blue border that appears after 1 click.
    It means that the problem is caused by your custom styles, as was already mentioned.

    We strive to provide excellent service to our customers, but please be advised that we are not responsible for custom code in your child theme.

    Kind Regards,
    8theme team

    Avatar: steve.li.vt
    steve.li.vt
    Participant
    March 21, 2023 at 14:49

    Hi Team,

    You didn’t check my above comment:

    “I tested again, It doesn’t work…”

    You want me to remove all the custom styles, it means browser width is not 1639px or odd. Because you xstore theme has max-width, it changes browser width. It absolutely works well.

    Your are not responsible for custom code, but you should responsible for full width theme work.

    I removed all the custom code, and only keep the below code. you can test it now.

    .single-product .content-page.container {
    max-width: 100%;
    padding-left: 0;
    padding-right: 0;
    }

    .swiper-container.swiper-control-bottom.second-initialized li.thumbnail-item.active-thumbnail {
    border: blue solid 5px;
    }

    I am very disappointed with your support service.

    Avatar: steve.li.vt
    steve.li.vt
    Participant
    March 21, 2023 at 15:50

    I have recreated a new child theme to resolve this issue. It works.

    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    March 21, 2023 at 16:05

    Hello, Steve.li.vt,

    We are pleased that you were able to resolve the issue and thank you for informing us.

    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.

    Kind Regards,
    8theme team

    Avatar: steve.li.vt
    steve.li.vt
    Participant
    March 22, 2023 at 02:09

    It still doesn’t work well after I logged out.

    When you test this issue, please paste the below code to the child theme style.css and replace all of the code.

    .single-product .content-page.container {
    max-width: 100%;
    padding-left: 0;
    padding-right: 0;
    }

    .swiper-container.swiper-control-bottom.second-initialized li.thumbnail-item.active-thumbnail {
    border: blue solid 5px;
    }

    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    March 22, 2023 at 09:56

    Hello, Steve.li.vt,

    Thank you for the reply.

    You find out that the code that stretches container – max-width: 100%; causing the problem, it is what we told you before. Your custom code causes the problem, so would not recommend to use this code:
    .single-product .content-page.container {
    max-width: 100%;
    padding-left: 0;
    padding-right: 0;
    }
    As a workaround, edit single-product.php (xstore/woocommerce folder) via child theme. Keep only content-page class of this div -> https://prnt.sc/fcRkmNkWC3mo
    and test without your custom CSS
    It means that container styles will not be applied to your single products and the page will be stretched on the first load initially without any CSS additions.

    Kind Regards,
    8theme team

    Avatar: steve.li.vt
    steve.li.vt
    Participant
    March 22, 2023 at 15:06

    I have implemented your suggestion, but it doesn’t help.

    It means your javascript doesn’t work well on odd width.

    I have removed all custom code, you can test it again.

    Keep in mind, logged out to test. If you logged in, you can’t find this issue.

    Please contact administrator
    for this information.
    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    March 22, 2023 at 16:29

    Hello, Steve.li.vt,

    We hardly tested many different areas where could the issues comes from but only found that it is only if the Elementor plugin is active.
    It means that something in the combination of our code and their one makes such conflicts. So especially for you, we created the next js snippet -> https://prnt.sc/31409jVOrhzn , which was added to your child-theme/woocommerce/single-product.php and after other tests seem to be ok now.
    Please, check now!
    P.S. We have exhausted all efforts to recreate the same situation with our locals and have been unsuccessful, which indicates that everything is functioning properly.

    Kind Regards,
    8theme team

    Avatar: steve.li.vt
    steve.li.vt
    Participant
    March 22, 2023 at 20:15

    Hi Team,

    Thanks for your code. It works well anyway.

    I appreciate your help.

    Warmly,
    Steve

    Avatar: Tony Rodriguez
    Tony Rodriguez
    Support staff
    March 23, 2023 at 06:47

    Hello steve.li.vt,

    Welcome! We would be grateful if you could leave a 5-star rating for our theme and customer and technical support on ThemeForest at http://themeforest.net/downloads. Doing so would help us to provide more updates and dedicated support in the future. Your support would be greatly appreciated.

    Thank you for contacting us. Have a great day!

    Please note that for any new issues, you should create a new ticket on the support forum.

    Topic closed.

    Best regards,
    8Theme’s Team

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

The issue related to '‘Last thumbnail has to click twice to active’' has been successfully resolved, and the topic is now closed for further responses

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