Build your homepage

Your homepage is built from sections — stacked blocks like a hero banner, product grids, and category showcases. Add the ones you want, arrange them in any order, and hide the rest. All of this happens in the Theme Builder.

Steps

1. Open the Theme Builder and switch to the Pages tab, with Home selected.
2. Click Add Section and pick a block. Common homepage sections include:
   • Hero Banner — a large top area with a slider and optional banners.
   • Product Grid — products by source: Featured Products, New Arrivals, From Category, or By Tag.
   • Category Showcase — a grid of your categories with images.
   • Banner / Banner Row — promotional images with a link.
   • Image Slider — a rotating carousel of images.
   • Rich Text — your own headings and text.
3. Click any section to open its settings on the right and edit its content and layout.
4. Drag sections to reorder them. Use the visibility toggle to hide a section without deleting it, or remove it entirely.

Managing the top banner slider

In the Hero Banner or Image Slider section, add images under Slides. The recommended size is shown beside the field (for example, 1600×600px). You can turn on Slides change automatically and set how long each slide shows.

Tip: Mark products as Featured when adding them so a Product Grid set to Featured Products fills automatically.

Category Showcase styles

Add a Category Showcase and open its settings to choose how your categories look. Under Style, pick one of:

• Grid — categories laid out in rows and columns.
• Carousel — a single scrolling row.
• Circle Icons — round category images in a row.
• Pill Row — compact text pills that wrap onto multiple lines.

More options let you shape each style:

• Categories to show — leave it empty to show every category, or pick specific ones to display.
• Row behavior (Grid and Circle Icons) — Exact rows keeps the same number of rows on every screen size; Flexible shows all items and lets the rows adapt.
• Columns and Rows — set separate values for desktop and mobile.
• Auto-scroll (Carousel and Circle Icons) — the row drifts continuously in a loop, like a marquee. It pauses when a visitor hovers over it, and shoppers who prefer reduced motion see a normal scrollable row instead. When it’s on, set the Scroll speed to Slow, Normal, or Fast.
• Max Categories (Carousel and Pill Row) — cap how many categories appear.
• Show Product Count — display how many products each category holds.

Product card buttons

You can decide which action buttons appear on every product card across your store. In the Theme Builder’s global settings, open Product card buttons and choose under Buttons on each card:

• Add to Cart + Buy Now
• Add to Cart only
• Buy Now only
• No buttons (card links to product)

Turn on Reveal buttons on hover to keep cards clean and show the buttons only when a shopper points at a card. This is a desktop-only effect — on mobile the buttons always show and stack neatly under the product.

Note: The choice above is your store-wide default. Individual sections that show products have their own Card Buttons setting, which is set to Use global default unless you override it for that one section.

What’s next

Set up your header, footer & menus.