E-commerce
VÉRANO
A complete footwear storefront with an editorial look — shop with filters, product pages, cart, four-step checkout and order tracking, all working with no backend. Men's and women's ranges ship with original photography and film, and the whole catalogue lives in typed data files.
Want it set up for your store? Ask for setup — your products, photos, brand colours, domain and launch, done for you.
Overview
A complete footwear storefront with an editorial look — shop with filters, product pages, cart, four-step checkout and order tracking, all working with no backend. Men's and women's ranges ship with original photography and film, and the whole catalogue lives in typed data files.
What's Included
- Full shopping flow — filters, cart, wishlist, promo codes, checkout, tracking
- 17 styles with original photography, men's and women's sizing
- Cursor-driven showcase hero and scrubbable campaign film
- Config-driven — rebrand colours, fonts and copy from src/config
- Image importer that crops your own photos into every slot
- Stripe and PayPal integration points documented
- Structured data, sitemap and per-product SEO metadata
- Eleven documentation guides and a commercial licence
Watch the Walkthrough
Every section of VÉRANO in one video, and the desktop and mobile layouts side by side.
Section by Section
Every section of the template, where it sits and what moves — recorded from the running demo.
- Home — Showcase hero — live recording
01Home
Showcase hero
Four featured styles, each with its name, price and colour. On desktop the screen is split into four bands — move the cursor across and the shoe follows it; on touch screens it advances on its own.
MotionChanges every 3 seconds; cross-fades shoe and copy together, pauses on hover.
- Home — New season — live recording
02Home
New season
An editorial block rather than a uniform grid — a large lead product, a tall second pick and three supporting cards.
MotionBlocks rise and fade in as they scroll into view, staggered one after another.
- Home — Shop by category — live recording
03Home
Shop by category
Seven category tiles in an asymmetric layout, each with its own photography — men, women, sneakers, formal, boots, casual and accessories.
MotionTiles zoom slowly on hover under a soft gradient.
- Home — Craft sequence — live recording
04Home
Craft sequence
Four stages of how a pair is made. The image stays pinned while the text for each stage scrolls past it.
MotionScroll-pinned; each stage fades in and out as it reaches the centre.
- Home — Best sellers — live recording
05Home
Best sellers
A product rail with price, sale badge and colour swatches on every card, plus quick view straight from the grid.
MotionHovering a card swaps to its second photograph.
- Shop — Filters and grid — live recording
06Shop
Filters and grid
Filter by category, size, colour, collection, price and availability. Every filter is written to the URL, so any view can be shared or bookmarked.
MotionLight rays drift across the header; cards fade in again whenever the filters change.
- Everywhere — Search — live recording
07Everywhere
Search
One search box across products, collections and journal articles, with results as you type.
MotionOverlay slides down; results update on every keystroke.
- Women — Category page — live recording
08Women
Category page
Every category has its own photographic header and a filtered grid — here, the seven women's styles.
MotionHeader image settles as the page opens; product cards rise into place on scroll.
- Product — Product detail — live recording
09Product
Product detail
Gallery with thumbnails, hover zoom and a fullscreen lightbox; colour and size selection, a size-guide modal, specifications and care.
MotionImage zooms under the cursor; adding to bag slides the cart drawer in.
- Checkout — Four-step checkout — live recording
10Checkout
Four-step checkout
Contact, delivery, shipping method and payment, with validation and an order summary that follows you down the page. Works end to end with no payment keys.
MotionFields validate as you type; each step slides open when the last one is complete.
- Collections — Collection page — live recording
11Collections
Collection page
Five collections, each rendered with one of three layouts — split, stacked or immersive — so no two read the same way.
MotionImmersive header image with editorial blocks that reveal as you scroll.
- About — Campaign film — live recording
12About
Campaign film
The about page opens on a full-screen film of the collection being worn, with the brand line set over it.
MotionMove the cursor right and the film plays forward; move left and it plays in reverse. The layers shift with depth.
- Journal — Journal — live recording
13Journal
Journal
Editorial stories built from structured content blocks, under a looping film header, with category filters.
MotionFilm header loops; story cards reveal on scroll.
Pages
- Home
- Shop with filters
- 7 category pages (Men, Women, Sneakers, Formal, Boots, Casual, Accessories)
- Product Detail
- Collections — 3 layouts
- Cart & Wishlist
- Checkout — 4 steps
- Order Confirmation & Tracking
- Account
- Journal & Articles
- About, Contact, FAQ, Size Guide
- Shipping, Returns, Privacy, Terms, Cookies
- 404
Inside the Template
Screens from the live demo — nothing mocked up.
Responsive Preview
Perfect For
- — Shoe and footwear brands
- — Fashion and accessories boutiques
- — Brands moving off marketplaces to their own store
- — Developers building an e-commerce client site
Requirements
- — Node.js 20 or newer
- — Any Next.js host — Vercel, Netlify, or a Node server
- — No database, payment or API keys needed to run the demo
License
Each purchase includes a standard license covering one end product, personal or commercial, including client work. Redistribution or resale of the template files themselves is not permitted. Read the full license.
Frequently Asked Questions
Build your next website without starting from zero.
Order This WebsiteNot a developer? Have it set up for you.