Skip to main content
EcomWize Builder offers 70+ pre-built sections organized into 14 categories. Each category is designed for a specific purpose on your landing page, and every section within a category offers a unique layout variation. This guide covers what each category includes and when to use it.

Hero (7 variants)

Hero sections are the first thing visitors see when they land on your page. They set the tone for your entire landing page with bold headlines, compelling subheadings, and clear calls to action. What’s included:
  • Large heading and subheading text areas
  • Call-to-action buttons
  • Hero images, background images, or video backgrounds
  • Star ratings and social proof badges
  • Side-by-side and centered layout options
When to use: Every landing page should start with a hero section. Choose a side-by-side layout to showcase a product image alongside copy, or a centered layout for a more editorial feel.

Benefit (8 variants)

Benefit sections highlight the key features and advantages of your product. They use icons paired with concise text to communicate value quickly. What’s included:
  • Icon + text card grids (2, 3, or 4 columns)
  • Heading and description for each benefit
  • Customizable icons from the Phosphor icon library
  • Various card styles: minimal, bordered, with backgrounds
  • Side-by-side layouts with images
When to use: Place benefit sections below your hero to answer “Why should I buy this?” Ideal for listing product features, unique selling points, or brand values.

Testimonial (11 variants)

Testimonial sections showcase customer reviews and social proof. With 11 variants, this is one of the most versatile categories. What’s included:
  • Individual review cards with star ratings
  • Avatar images and customer names
  • Horizontal carousels for multiple reviews
  • Grid layouts for displaying many testimonials at once
  • Quote-style designs with large text
  • Video testimonial support
  • Before/after testimonial formats
When to use: Place testimonials throughout your page to build trust. Add one after your hero, after benefit sections, and before your final call-to-action. The more social proof, the higher your conversion rate.

Stats (6 variants)

Stats sections display numeric metrics and achievements that build credibility. Numbers catch the eye and communicate scale instantly. What’s included:
  • Large number displays with labels
  • Icon + stat combinations
  • Multi-column stat grids (3-4 stats per row)
  • Animated counter-style layouts
  • Stats with supporting descriptions
When to use: Use stats to communicate things like “10,000+ happy customers”, “4.9 star average rating”, “30-day money-back guarantee”, or “Founded in 2015”. Place them near the top of your page for immediate credibility. Banner sections are versatile promotional blocks. Several variants include ticker/marquee scrolling text for dynamic, attention-grabbing displays. What’s included:
  • Promotional announcement banners
  • Ticker/scrolling text banners (6 variants with continuous horizontal scroll)
  • Alert-style notification bars
  • Full-width image banners
  • Discount code and offer banners
  • Text + icon combinations
When to use: Use banners to highlight limited-time offers, free shipping thresholds, discount codes, or brand messages. Ticker banners are particularly effective for creating urgency and visual movement on the page.
Sections with a Ticker badge in the sections panel feature continuous scrolling text animation. These are great for “Free Shipping” announcements, press mentions, or repeating key selling points.

FAQ (4 variants)

FAQ sections present common questions and answers in an accordion format. Visitors can click to expand individual questions. What’s included:
  • Accordion-style expandable Q&A pairs
  • Single-column and two-column layouts
  • Customizable question and answer text
  • Section heading and subheading
When to use: Place an FAQ section near the bottom of your page, before the final CTA. Address common objections about shipping, returns, ingredients, sizing, or product usage to remove purchase barriers.

Comparison (4 variants)

Comparison sections let you visually compare your product against alternatives or show before/after scenarios. What’s included:
  • Feature comparison tables (your product vs. competitors)
  • Checkmark and X-mark visual indicators
  • Before/after split layouts
  • Side-by-side product comparisons
  • Column headers with product names
When to use: Use comparison sections when you want to position your product against alternatives. Effective for showing why your product is superior — highlight features competitors lack and value your product delivers.

Ingredients (7 variants)

Ingredients sections display product components, formulations, or materials. Originally designed for supplement and food brands, they work for any product with notable components. What’s included:
  • Ingredient cards with icons and descriptions
  • Grid and list layouts
  • Image + text ingredient spotlights
  • Dosage and quantity information
  • Ingredient category grouping
When to use: Essential for supplements, food products, skincare, and any product where ingredients matter to the buyer. Also useful for showing materials in fashion or components in tech products.

Instructions (5 variants)

Instructions sections provide step-by-step guidance on how to use your product. They guide customers through a process with numbered steps. What’s included:
  • Numbered step cards with headings and descriptions
  • Icon-based step indicators
  • Horizontal and vertical step layouts
  • Image-supported steps
  • “How it works” style presentations
When to use: Use instructions to show how to use your product, how the ordering process works, or how to get started. Reducing confusion about product usage increases purchase confidence.

Timeline (4 variants)

Timeline sections display events or milestones in chronological order. They visually walk the visitor through a sequence of events. What’s included:
  • Vertical timeline with connected nodes
  • Milestone markers with dates or labels
  • Image and text combinations per timeline entry
  • Progress-style indicators
When to use: Use timelines to show your brand’s history, a product’s development journey, a “What to expect” delivery timeline, or the results customers can expect over time (e.g., “Week 1”, “Week 4”, “Week 12”).

UGC (3 variants)

UGC (User-Generated Content) sections display customer photos and videos in engaging grid layouts. They showcase real customers using your product. What’s included:
  • Photo grids with various aspect ratios
  • Video embeds from customers
  • Image gallery with captions
  • Social media-style content displays
When to use: UGC builds authenticity. Place these sections after testimonials to give visual proof that real people use and love your product. Particularly effective for lifestyle, fashion, and beauty brands.

Product (1 core + 30+ snippets)

The Product section is a special, composable section type designed specifically for displaying Shopify product data. It connects to your Shopify store and pulls in live product information. What’s included:
  • Product title, price, and description
  • Variant selectors and image galleries
  • Add to Cart button
  • Stock status and delivery dates
  • Selling plans (subscriptions)
  • 30+ modular snippets you can mix and match
When to use: Every product landing page needs a product section. It dynamically displays your Shopify product’s real data — pricing, variants, images, and availability. See Product Sections for a full breakdown.
Product sections are the only section type that connects to live Shopify product data. All other sections use static content that you edit directly.

Listicle (hero + reason variants)

Listicle sections present content in a numbered, list-style format. They combine editorial storytelling with structured layouts. What’s included:
  • Listicle hero sections for introducing the list
  • Numbered “reason” sections for each list item
  • Large text with supporting imagery
  • Editorial-style typography
When to use: Use listicle sections for “Top 5 Reasons to Try…” or “3 Things You Didn’t Know About…” style content. They work well for advertorial-style landing pages that blend content marketing with product promotion.

Advertorial (1 core)

The Advertorial section is a long-form, editorial-style content block that mimics the look and feel of a news article or blog post. It is composed of multiple sub-components (snippets) that you arrange within the section. What’s included:
  • Author blocks with avatar, name, and credentials
  • Long-form text paragraphs
  • Inline images and dividers
  • Testimonial cards embedded in the content
  • Call-to-action buttons and bullet point lists
  • Tag/label elements
When to use: Advertorial sections are designed for advertorial-style landing pages — pages that look like editorial content while promoting a product. They build trust through storytelling, expert authority, and embedded social proof.

Category Quick Reference

Hero

7 variants for page headers with headings, CTAs, and media.

Benefits

8 variants for feature highlights with icons and descriptions.

Testimonials

11 variants for customer reviews, star ratings, and carousels.

Stats

6 variants for numeric metrics and credibility indicators.

Banners

9 variants including ticker/scrolling text animations.

FAQs

4 variants for accordion-style Q&A sections.

Comparison

4 variants for feature comparison tables.

Ingredients

7 variants for product component displays.

Instructions

5 variants for step-by-step how-to guides.

Timeline

4 variants for chronological event displays.

UGC

3 variants for user-generated content grids.

Product

1 core section + 30 modular snippets for Shopify product data.

Listicles

Hero and reason variants for list-style content.

Advertorial

1 core editorial section with multiple sub-components.