as you can see sliding arrows are not at center how can we fix this? it is also showing slice of previous image as you can see.
Topic summary
A user seeks to add navigation arrows for swiping between product images on their Shopify store using the Dawn 11.0.0 theme. The theme settings only allow arrows for thumbnails, not the main product image when using the “Thumbnails Desktop Layout.”
Solution Provided:
Another user (DRAWandCARE) successfully implemented custom arrows and shared a detailed step-by-step guide:
- Set Desktop layout to “Thumbnail Carousel” in theme customization
- Add specific code to
product-media-gallery.liquidfile to enable desktop slider - Insert CSS code for arrow styling (desktop and mobile)
- Optionally add a third code snippet related to arrow functionality
The solution references tutorial resources from jabwebsolution.com, though some original video links are no longer available.
Reported Issues:
- Some users experienced arrow positioning problems (not centered, showing image slices)
- Numbers appearing below images with incorrect counts and non-functional arrows
- Mobile view arrow functionality issues
- Compatibility questions with Dawn version 15
- The CSS code portion in the detailed solution appears incomplete/missing in the forum post
Status: Multiple users confirmed the solution works perfectly for Dawn 12.0.0 and even the Spotlight theme, though implementation challenges and display issues persist for some.