Product Slideshow transforms a standard product gallery into an immersive visual experience. Instead of static thumbnails, products exist within a responsive image array that allows users to interact, zoom, and navigate fluidly.
When a user clicks on a product image, it scales up smoothly, drawing attention and creating visual hierarchy. Users can then move through products in a carousel-style flow while maintaining focus on the active item.
Each product slide includes structured information:
Product Name
Description
Price
Action Button (linked to purchase or external page)
The component is built to balance presentation and conversion—combining product storytelling with clear call-to-action functionality.
It is ideal for e-commerce showcases, fashion collections, digital product previews, and landing page highlights.
1. Add Products
Inside the settings panel, you can create product entries by adding:
Product image
Product name
Product description
Price
Button link (external or internal URL)
Each entry becomes a slide in the carousel array.
Products are displayed in a horizontal carousel layout.
Clicking on a product image triggers a scale-up (zoom) animation.
Users can continue navigating between products while the active one remains visually emphasized.
This creates a layered browsing experience:Browse → Click → Focus → Navigate → Purchase
You can customize:
• SpacingAdjust the gap between product items.
• Scale-Up SizeControl how large the active image expands when clicked.
• Image PositioningDefine alignment and placement within the container.
• Backdrop TitleAdd a large background title or contextual heading behind the slideshow for added visual impact.
• Button CustomizationEdit label text and attach destination links
Ecommerce product highlights
Fashion lookbooks
Limited edition drops
Featured collections
Digital product previews
Campaign landing pages
Isaac Alipoe
