Hello,
I was wondering if anyone could help me. I’m trying to make my media images sticky so that as you scroll down the product images will follow.
website: gripmags.com
A user seeks help making product images remain fixed (sticky) on their ecommerce site as customers scroll down the page.
Solutions Proposed:
Two app support teams offered CSS-based approaches:
GemPages Team suggested:
</head> tagPageFly Team recommended:
.Product .Product__Wrapper .Product__Gallery with position: sticky !important and top: 0 !importantBoth solutions involve theme code customization. The discussion remains open with no confirmation from the original poster on which approach was implemented or successful.
Hello,
I was wondering if anyone could help me. I’m trying to make my media images sticky so that as you scroll down the product images will follow.
website: gripmags.com
Hello @GripMags ,
It’s the GemPages Support Team and we are glad to assist you today!
I would like to give you the recommendation to support you so kindly follow the steps below:
Open your theme.liquid theme file
Paste the below code before
Let us know how it works for you.
Best regards,
GemPages Support Team
Hi @GripMags
This is Victor from PageFly - Shopify Page Builder App, I’d like to suggest this idea:
Online Store ->Theme ->Edit code
Assets ->Theme.scss.css
@media (min-width: 1200px){
.Product .Product__Wrapper .Product__Gallery {
position: sticky !important;
top: 0 !important;
}
}
Hope you find my answer helpful!
Best regards,
Victor | PageFly