How to set up your home page: hero, sliders and product grids
Open Online Store → Theme Settings on the Home page and build it from Hero, Slider, Product List and Categories blocks. Product List decides which products appear (newest, trending, exclusive, a category or a custom pick).
Steps
- Open Online Store → Theme Settings; the page selector should show Home.
- Hero — from Pre-made sections (layout icon) drop a Hero (3 designs). It has no settings of its own: click its heading, paragraph, button and image children to edit them.
- Slider — from Add Blocks add a Slider (6 designs). Per slide set Desktop image and Mobile image, title and description, and the call to action (Button text, Button URL, Open in new tab, colours). Turn on Auto Slide and set Delay in milliseconds (1000 or more recommended). Some designs add Number of items in grid / mobile / Tablet, Speed and Direction.
- Product grid — add a Product List (11 designs). In Settings choose the Type: Newest, Trendings, Exclusive (products marked as exclusive offer), Category (then Select category) or Custom. Set Products number (default 4; around 12 works well) and the toggles: Show Add to Cart Button, Show Wishlist Button, Show Product Category, Show Product Ratings (+ Rating Color), Show Compare Price, Show Discount, Show notification on success, Apply image hover animation. Some designs add a Badge card and per-device grid counts.
- Categories — add a Categories block (7 designs) and set Categories number (default 4); one design also has card colours and a Button text (default "Discover").
- Reorder sections with the toolbar arrows or in Design Layers, click Save, and keep the page Published.
Common problems
- The grid shows the wrong productschange Type; for a hand-picked set use Custom, for one collection use Category.
- The Exclusive grid is emptymark products with Mark as exclusive offer in Products → Manage Products.
- Only 4 products appearraise Products number.
- The slider image is cropped on phonesupload a separate Mobile image per slide.
- Too many cards per row on mobileon designs that offer Number of items in grid / mobile / Tablet, lower the mobile value in the block's Settings.