This topic has 18 replies, 3 voices, and was last updated 1 years, 8 months ago ago by Tony Rodriguez
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
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
Hi team,
After you change the brower width, please refresh your brower, then test it.
Thanks!
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
It’s absolutely not caused by custom styles. I have tested this way so many times before I contact your team.
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
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.
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
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
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.
I have recreated a new child theme to resolve this issue. It works.
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
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;
}
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
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.
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
Hi Team,
Thanks for your code. It works well anyway.
I appreciate your help.
Warmly,
Steve
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
Tagged: active, click twice, last thumbnail, persuasive, woocommerce, wordpress templates
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