← All projects
Project
Product Page Scroll Video
Services
Custom Shopify Section, Liquid + JS
Website
Shopify · Liquid
2026
Product Page Scroll Video
A custom Shopify section for product pages where a full bleed video scrubs and reveals as the shopper scrolls, turning a static product story into a cinematic, scroll driven moment without slowing the page down.
Liquid + JS · scroll synced
The challenge
Product pages needed a richer way to tell a story than a row of static images, but the section had to stay lightweight, work on any theme and never add weight to the page on mobile.
Skills
Custom Shopify SectionLiquidJavaScriptFront-End Design
What I did
- 1Built the section in Liquid with merchant editable settings for the video, copy and scroll behavior.
- 2Synced playback to scroll position in vanilla JS so the clip reveals smoothly as the shopper moves down the page.
- 3Lazy loaded the video and added a poster frame so the section adds zero weight until it scrolls into view.
Results
- A premium, scroll driven product moment on any theme
- Fully merchant editable in the theme customizer
- Lazy loaded so it adds no extra weight in the critical path
Want your key page working this hard?
The 14-day sprint fixes the buying friction on one product or landing page, implemented in your theme, documented before and after.