Hi there,
I find this section ugly and want to remove it from my product page on mobile view.
Can someone please tell me how to remove it?
Store: https://fruitysleep.com/products/fruity-sleep-gummies
Topic summary
A user seeks to remove the image slider navigation arrows from product pages on mobile devices in the Dawn theme, finding them visually unappealing.
Solution Provided:
- Add CSS code to the end of
base.cssfile:@media screen and (max-width: 749px) { .slider-buttons { display: none; visibility: hidden; } } - If blank space remains after hiding arrows, add
!importantto thedisplay:none;property
Current Issue:
One user reports the CSS works in the theme customizer but doesn’t appear in store preview mode. They’ve shared screenshots and a preview link, awaiting troubleshooting assistance to determine why the changes aren’t reflecting properly in preview.
Status: Partially resolved - the CSS solution works for some users, but one case requires further investigation regarding preview display inconsistencies.
@harry_12345 - add this css to the very end of your base.css file and check
@media screen and (max-width:749px){
.slider-buttons {display: none; visibility: hidden;}
}
Hello Suyash,
And what about the blank space that is left from it, how can i reduce it?
Website: https://c04baf-2.myshopify.com/
Code: Diversusoficial
@HELDERWRLD - add !important to display:none; so it becomes
@media screen and (max-width:749px){
.slider-buttons{display: none !important; visibility: hidden;}
}
1 Like
Thank you so much Suyash,
It worked.
Hello! I tried your solution and it seems to work when viewing on the theme customizer, but doesn’t reflect on the store preview. Any idea why this could be? I can’t make my website live yet to check if it is simply because it is preview, but I assume it should also be reflected on preview as all other changes are as well.
Hope you can help me with this!
Here are screenshots:
@Melinda5 - can you please provide the preview link of this theme? Even if it is not live you can still check the preview
Here you go! Thanks https://1i95dtgkycywlt2y-26499285045.shopifypreview.com