Shopify themes, liquid, logos, and UX
Hello everyone,
I want to make the product image sticky on mobile in the Dawn theme. I tried multiple codes and CSS, but nothing worked.
Can someone help?
Thank you in advance!
Solved! Go to the solution
This is an accepted solution.
Hi Ivana749,
Can you please try the below css? Thanks!
.product__media-wrapper {
padding-left: 0;
position: sticky;
top: 0;
z-index: 1000;
}
Hello there @Ivana749 welcome to the community. I came across a thread with a reply marked as a solution here https://community.shopify.com/c/shopify-design/product-images-sticky-on-mobile-dawn-theme/m-p/192291... for an issue similar to yours and I want you to confirm if you’ve tried out the whole process there yet.
I tried variations of that one. First I can't find anything related to thumbnails in the theme.liquid file.
I think some change needs to be here: assets/section-main-product.css
I used this one (doesn't work):
.product__media-wrapper { position: sticky; top: 0; }
Please share with the community.
1. I’m using Dawn 15.0.0
2. I have a few changes in the code. I added the code for Google Tag Manager, and some changes about subscription button for newsletters. Also, added some code for title tag-not to show my store name.
3. Honestly, I tried everything I found here on forum.
This is an accepted solution.
Hi Ivana749,
Can you please try the below css? Thanks!
.product__media-wrapper {
padding-left: 0;
position: sticky;
top: 0;
z-index: 1000;
}
Thank you @Code-Crafting
This seems to work, but is there a way that just the main image stays sticky?
I just used z-index: 1 because with 1000 my main menu was also behind the image.
For thumbnail images below the main image, I found a solution in the app I use for personalization.
Thanks again, everyone!
Hi @Ivana749
Please share your store URL
Best,
Daisy
Learn how to expand your operations internationally with Shopify Academy’s learning path...
By Shopify Feb 4, 2025Hey Community, happy February! Looking back to January, we kicked off the year with 8....
By JasonH Feb 3, 2025Expand into selling wholesale with Shopify Academy’s learning path, B2B on Shopify: Lau...
By Shopify Jan 28, 2025