Fragrance Helper ⎸ The Handmade Soap
Zoltan Zsamboki
Landing page for Shopify store
This Webflow-built landing page was developed as an extension for a Shopify store. The project integrates custom JavaScript with multiple Swiper.js instances to deliver a smooth and engaging user experience.
Key Features
Webflow CMS Integration
Dynamic content is powered by Webflow CMS, connected to Swiper.js for a responsive, CMS-driven slider experience.
Multiple Swiper.js Implementations
Coverflow Swiper – Interactive 3D-style slider with mousewheel, keyboard, and navigation support.
Products Swiper – Hero product showcase with synchronized navigation.
Navigation Swiper – Fading transitions to guide users through product categories.
Product Details Swiper – User-friendly detail viewer with mousewheel and keyboard controls.
FAQ Swiper – Custom FAQ slider initialized per product, each with unique selectors, pagination, and navigation.
Custom JavaScript
Advanced Swiper configurations, breakpoints, and effects.
Unique FAQ Swiper initialization per product slide, ensuring independent navigation and pagination.
Linked swiper controllers (e.g., coverflow synced with products slider).
Performance & Usability
Optimized for desktop and mobile breakpoints.
Smooth transitions (
speed: 1200ms) for a premium, brand-consistent feel.Mousewheel and keyboard navigation support for accessibility.
Live site:
Like this project
Posted Sep 17, 2025
The landing page was developed as an extension for a Shopify store. The project integrates custom JS with multiple Swiper.js instances to deliver an engaging UX
Likes
0
Views
0
Timeline
Aug 19, 2025 - Ongoing
Clients
Host Digital
