Templates

Templates define the structure of each page type in your store. Hyprism ships with 13 templates pre-configured with sensible defaults — they work out-of-the-box, but you can customize section arrangements freely.

This chapter covers what each template includes by default, and any template-specific behavior.

How Shopify templates work

Each template is a JSON file in templates/ describing what sections live on that page type. When a visitor lands on a page, Shopify renders the appropriate template:

• / → templates/index.json (home)
• /products/{handle} → templates/product.json
• /collections/{handle} → templates/collection.json
• /blogs/{blog}/{article} → templates/article.json
• /cart → templates/cart.json
• And so on

You customize templates through the Shopify theme editor — you don’t edit JSON directly (though you can if needed for advanced cases).

11.1 Home (index.json)

The home page. Most-trafficked landing page in any store.

Default sections (out-of-the-box)

The shipping templates/index.json has 7 sections in this order:

1. Hero — full-width hero image with brand statement
2. Pretext Banner — animated ASCII/binary banner strip
3. Featured Collection — curated product grid
4. Image with Text — brand story snippet with CTA
5. Rich Text — flexible text section (paragraph + buttons)
6. Bento Grid — modern bento layout of mixed tiles
7. Newsletter — full-width signup

Recommended customizations

• Brand-led store → swap Hero for Hero Video (cinematic intro) or Hotspot Image (shoppable lookbook)
• Catalog-heavy store → add Bento Grid showcasing top collections after the hero
• Editorial store → start with Pretext Banner + Hero + Featured Article
• Social-proof-led store → add Testimonials between Featured Collection and Newsletter

11.2 Product (product.json)

Single-product detail page. The conversion engine.

Default sections (out-of-the-box)

1. Product section with the standard block stack inside (vendor, title, price, variant picker, buy buttons, pickup, wishlist, description, share — see §7.3 for the default block-arrangement)
2. Related Products — 4 products powered by Shopify Recommendations API
3. Complementary Products — “Pairs well with” recommendations from Shopify’s Search & Discovery relationships (self-hides when none are configured)

Note: Recently-viewed is NOT in the default template. Add it manually after Related Products if desired.

See chapter 7 for the full block-level customization.

11.3 Collection (collection.json)

Lists products in a specific collection.

Default sections (out-of-the-box)

1. Collection section with filter sidebar (desktop) / drawer (mobile), product grid, sort dropdown — all in one monolithic section.

No banner / featured-collection sections by default. Add a collection-banner BLOCK inside the Collection section if you want a hero band at the top of the collection page (banner is a block, not a separate section — see §8.6). Add Featured Collection / Recently Viewed sections below the Collection section for cross-sells.

See chapter 8.

11.4 Search (search.json)

Search-results page (/search?q=query).

Default sections

1. Search section with results grid + filter sidebar
2. Sort dropdown
3. Pagination

The search section uses the same UI as collection page — same filter API, same product grid. The only difference is the data source (search-results vs. a specific collection).

Search section settings

Header

Setting	What it does
🔧 Heading size	H1 / H2 (✅ default) / H3. For the “Search results for ‘X’” heading.
🔧 Search type	Products only (product) or Products + articles + pages (✅ default product,article,page). Only two options — no “Products + articles” middle option.
🔧 Enable filtering	✅ Default on. Show filter sidebar (uses Shopify’s Search & Discovery app metadata).
🔧 Enable sorting	✅ Default on. Show sort dropdown.

Product grid

Setting	What it does
🔧 Results per page	Range 8–48, step 4. ✅ Default 24.
🔧 Columns	Range 2–5, step 1. ✅ Default 4.
🔧 Image ratio	Natural / Square / Portrait (✅ default — 3:4). No Landscape or Wide.
🔧 Show vendor	✅ Default off.
🔧 Show color swatches (show_swatches)	✅ Default on. Inline color-variant swatches under the product name on each card. Off = no swatch dots.

Card style

Setting	What it does
🔧 Card surface	Solid (✅ default) / Glass / Transparent.
🔧 Tint glass with accent (card_glass_tint)	Tints the glass cards with the scheme accent (strength = Effects → Glass tint intensity). ✅ Default off. Only visible when Card surface = Glass.
🔧 Card corner radius	Range 0–32px, step 2. ✅ Default 8px.
🔧 Card padding	Range 0–24px, step 2. ✅ Default 0.
🔧 Image corner radius	Range 0–32px, step 2. ✅ Default 0.
🔧 Card glow	✅ Default off.
🔧 Card shadow	✅ Default off.

Section chrome (universal v7)

Color scheme + dark/light pair, surface (transparent / glass / glass tint / glow / shadow), layout (full width + mobile, radius), padding (desktop + custom mobile), visibility. See chapter 3 for canonical descriptions.

Blocks accepted: heading · text · button · image · video · icon · group · spacer · divider · recently-viewed-grid · wishlist-grid · collection-banner · @app

11.5 Article (article.json)

Single blog article page.

Default sections (out-of-the-box)

1. Article section with the block stack (breadcrumb, title, meta, featured_image, content, tags, share, comments — see §11.5 settings + block list below).

No Related Articles or Newsletter section by default. Add a Featured Article (§11.14.2) for cross-promotion, or a Newsletter section (§10.4) for email capture at the bottom of articles.

Article section settings

Setting	What it does
🔧 Content width	Range 500–1400px, step 50. ✅ Default 750px — comfortable reading width.
🔧 Fill viewport	✅ Default off. When on, the article extends edge-to-edge instead of respecting the content column.
🔧 Heading alignment	Left (✅ default) / Center / Right.

Plus standard v7 chrome (color scheme, surface, layout, radius, visibility).

Per-article blocks

Inside the Article section, the schema accepts these blocks:

Block	Content
breadcrumb	Home › Blog › This Article navigation
title	Article title rendered as an H1
meta	Author + date + read-time
featured_image	The article’s featured image
content	Rich-text from Shopify article body
tags	Tag list with links
share	Social share buttons
comments	Comments thread (if comments are enabled in Shopify Admin)
@app	Compatible app blocks

SEO

Each article emits a JSON-LD Article schema (or BlogPosting if categorized) with:

• Headline (article title)
• Published time
• Modified time
• Author (Person)
• Image
• Word count
• Article-section (the blog name)

See chapter 13 — SEO.

11.6 Blog (blog.json)

The blog index page — list of articles in a single blog.

Default sections (out-of-the-box)

1. Blog section with article grid + pagination (pagination is inside the section, not a separate section).

Blog section settings — header

Setting	What it does
🔧 Heading size	H1 / H2 (✅ default) / H3. The blog title.
🔧 Heading alignment	Left (✅ default) / Center / Right.
🔧 Show tags	✅ Default on. Clickable tag-filter row above article grid.

Blog section settings — article grid

Setting	What it does
🔧 Articles per page	Range 3–24, step 3. ✅ Default 9.
🔧 Columns	Range 2–4, step 1. ✅ Default 3.
🔧 Image ratio	16:9 (✅ default) / Landscape 4:3 / Square 1:1 (schema value: 1) / Portrait 3:4. 4 options total — no separate Wide (use 16:9).
🔧 Show date	✅ Default on.
🔧 Show author	✅ Default on.
🔧 Show excerpt	✅ Default on.

Blog section settings — card style

Setting	What it does
🔧 Card surface	Solid (✅ default) / Glass / Transparent.
🔧 Card glass tint	✅ Default off. Tints glass with the active accent (visible when card surface = glass).
🔧 Card corner radius	Range 0–32px, step 2. ✅ Default 8px.
🔧 Card padding	Range 0–24px, step 2. ✅ Default 0.
🔧 Image corner radius	Range 0–32px, step 2. ✅ Default 0.
🔧 Card glow	✅ Default off.
🔧 Card shadow	✅ Default off.

Blog section settings — chrome (universal v7)

Standard v7 chrome — Color scheme + dark/light pair, surface (transparent / glass / glass tint / glow / shadow), layout (full width + mobile, radius), padding (desktop + custom mobile), visibility. See chapter 3.

Blocks accepted: heading · text · button · image · video · icon · group · spacer · divider · recently-viewed-grid · wishlist-grid · @app

Atom feed

Hyprism emits a link to the blog’s Atom feed (/blogs/{handle}.atom) in the <head>, so RSS readers can subscribe.

11.7 Page (page.json)

Generic content page for static content — About, FAQ, Shipping info, etc.

Default sections

The default page template is a thin shell with a single Page section that renders the page’s title + content. Add any sections you want above or below for richer content pages.

Page section settings

Title + content

Setting	What it does
🔧 Show title	✅ Default on. Render the Shopify page title as a heading.
🔧 Heading size	H1 (✅ default) or H2. Only two options — no H3 at this level.
🔧 Heading alignment	Left (✅ default) / Center / Right.
🔧 Content width	Range 500–1400px, step 50. ✅ Default 800px — comfortable reading width (~65ch).
🔧 Blocks position	Before page content or After (✅ default). Whether @theme blocks render above or below the Shopify page content.

Background

Setting	What it does
🔧 Background image	Section-specific background image (independent of theme global).
🔧 Overlay color	✅ Default #000000. Tint over the background image.
🔧 Overlay opacity	Range 0–90%, step 5. ✅ Default 0%.
🔧 Min height	Range 0–100%, step 5. ✅ Default 0. Viewport-height percentage — useful for short pages so content fills the viewport.

Section chrome (universal v7)

Color scheme + dark/light pair, surface (transparent / glass / glass tint / glow / shadow), layout (full width + mobile, radius), padding (desktop + custom mobile), visibility. See chapter 3.

Blocks accepted: heading · text · button · image · video · icon · group · spacer · divider · recently-viewed-grid · wishlist-grid · countdown-timer · @app

Sub-templates

Hyprism includes two specialized page templates:

• page.contact.json — for contact pages. Renders a Contact Form section by default.
• page.wishlist.json — for the Wishlist page. Renders the Wishlist grid (auto-populates from localStorage).

To use a sub-template, in Shopify Admin → Pages → Edit Page → Theme Template, select “contact” or “wishlist”.

For embedding a Page’s content on another template (e.g., your About page snippet on the home page), see 11.14 — Featured content embeds.

11.8 Cart (cart.json)

The cart page (/cart).

Default sections (out-of-the-box)

1. Cart section. The cart-promo bar (free-shipping progress) is a BLOCK inside the cart section, not a separate section — see §12.3.

See chapter 12 — Cart experience for full detail.

11.9 404 (404.json)

The “Page not found” page.

Default sections (out-of-the-box)

1. 404 section with heading + message + CTA to home — all composed from atom blocks inside the section.

No Featured Collection by default. Add one after the 404 section if you want a “you might like” recovery row.

404 section settings

Setting	What it does
🔧 Show search	Render a search input on the 404 page so the visitor can find what they were looking for
🔧 Heading alignment	Left / Center / Right for the 404 message
🔧 Card glass	Apply glass surface to the “page not found” message card
🔧 Card glass tint	Tint the glass with the active accent color
🔧 Card radius	0–48px corner radius on the message card
🔧 Card glow / shadow	Theme effects on the card
🔧 Color scheme + dark/light pair	Per-section scheme override
🔧 Transparent / Glass / Glass tint / Glow / Shadow	Standard v7 surface modes
🔧 Full width / Full width mobile	Edge-to-edge toggles
🔧 Padding top / bottom	Vertical spacing
🔧 Custom mobile padding	Override padding per mobile viewport
🔧 Corner radius (section)	Section-level radius
🔧 Hide on mobile / desktop	Visibility

Heading and subheading text are edited via the heading + text blocks nested inside the section (using atom blocks — see chapter 5a).

Excluded from SEO indexing automatically (HTTP 404 status).

11.10 Password (password.json)

The pre-launch password page — shown when the store is “password-protected” in Shopify Admin.

Default sections

1. Password section with logo + heading + newsletter capture + social links

Password section settings

Content

Setting	What it does
🔧 Heading	✅ Default Opening soon. Main message shown on the password card.
🔧 Heading alignment	Left / Center (✅ default) / Right.
🔧 Show newsletter	✅ Default on. Render an email-capture form on the password card.
🔧 Newsletter text	✅ Default Be the first to know when we launch.
🔧 Email placeholder	✅ Default Your email address.
🔧 Newsletter button label	✅ Default Subscribe.
🔧 Show social	✅ Default on. Display social icons (pulled from Social media tab — §2.11).

Background

Setting	What it does
🔧 Background image	The page-wide background image.
🔧 Overlay color	✅ Default #000000.
🔧 Overlay opacity	Range 0–90%, step 5. ✅ Default 40%.

Card style

Setting	What it does
🔧 Card glass	✅ Default on. Frosted-glass surface on the password card.
🔧 Card glass tint	✅ Default off. Accent-tints the glass.
🔧 Card corner radius	Range 0–48px, step 2. ✅ Default 24px.
🔧 Card glow	✅ Default off.
🔧 Card shadow	✅ Default on.

X-Ray effect (password-page-specific)

Setting	What it does
🔧 Enable X-Ray	✅ Default off. Enables the cursor-tracking X-Ray spotlight effect on the password page (independent of the theme-wide X-Ray setting in §2.8).
🔧 X-Ray size	Range 100–600px, step 20. ✅ Default 300px.

Blocks accepted: heading · text · button · image · video · icon · group · spacer · divider · recently-viewed-grid · wishlist-grid · countdown-timer · @app

Use atom blocks for any custom content beyond the heading + newsletter (e.g. a countdown-timer for a launch date).

What’s NOT in the section

• No password form setting. Shopify renders the password input automatically — you can’t toggle it off (visitors need a way to enter the password).
• No “subheading” setting. Use a text atom block below the heading for subtitle text.

⚠️ Development stores show Shopify’s default password page (green “Eingeben”/“Enter” button), regardless of theme customization. Custom password pages render on paid stores and Shopify reviewer demo stores.

11.11 Customer accounts (Classic Customer Accounts)

Seven customer-account templates (in templates/customers/):

Template	Path	Purpose
Account	customers/account.json	Logged-in account home — order history, account links
Login	customers/login.json	Sign-in form + register link
Register	customers/register.json	Create-account form
Reset password	customers/reset_password.json	”Forgot password” flow
Activate account	customers/activate_account.json	First-time activation link from email
Addresses	customers/addresses.json	Shipping/billing address book
Order	customers/order.json	Single-order detail page

Customer section settings (shared across all 7 customer templates)

Each of the seven templates binds to its own section file (sections/customer-{name}.liquid); all seven sections share an identical 25-setting surface (5 form-card settings + 20 v7 chrome settings). The only difference is the content each one renders (login form / address book / order detail / …). Configure each template independently in the customizer — settings made on Login do not propagate to Register, Account, etc.

Per-template section files:

• customer-account.liquid (account.json)
• customer-login.liquid (login.json)
• customer-register.liquid (register.json)
• customer-reset-password.liquid (reset_password.json)
• customer-activate-account.liquid (activate_account.json)
• customer-addresses.liquid (addresses.json)
• customer-order.liquid (order.json)

Form-card settings (5 unique settings)

Setting	What it does
🔧 Heading alignment	Left / Center (✅ default) / Right — section heading position.
🔧 Card glass	✅ Default on. Frosted-glass surface on the form card.
🔧 Card glass tint	✅ Default off. Tints the glass with the accent color.
🔧 Card corner radius	Range 0–48px, step 2. ✅ Default 16px.
🔧 Max width	Range 360–1200px, step 20. ✅ Default varies per template (Login/Register/Reset/Activate ~480; Account/Addresses/Order ~720).

Universal v7 chrome (20 settings)

Standard pattern: Color scheme + dark/light pair, surface (transparent / glass / glass tint / glow / shadow), layout (full width + mobile), padding (top + bottom + custom mobile padding + mobile padding top/bottom), radius (use global + custom), visibility (hide on mobile + hide on desktop). See chapter 2 and chapter 3 for canonical descriptions.

Per-template configuration tips

The settings are identical across templates, but the use-cases differ. Reasonable defaults per template:

• Login + Register + Reset / Activate — minimal pages with a centered form. Recommended: Heading alignment: center, Max width: 480 px, Card glass: on, generous Padding top/bottom: 80–120 px.
• Account (home) — denser, list-of-orders layout. Recommended: Max width: 800 px, Card glass: off (cleaner table reading), Heading alignment: left.
• Addresses — multiple card-rows. Recommended: Max width: 700 px, Card glass: on to visually separate each address.
• Order detail — long line-item table + totals + shipping info. Recommended: Max width: 900 px, Card glass: off, Heading alignment: left.

💡 If you want all seven templates to look identical (one consistent brand-treatment), configure the Login template first, then copy the seven settings blocks across in templates/customers/*.json — faster than re-doing it seven times in the UI.

⚠️ Classic vs New Customer Accounts

Shopify introduced “New Customer Accounts” in 2024 — Shopify-hosted, passwordless (6-digit email codes), no theme customization possible. Stores activated since then default to New Accounts.

Hyprism’s customer templates only render on stores using Classic Customer Accounts. On New Accounts stores, Shopify routes account pages to its own UI, ignoring theme files entirely.

Most existing stores are still on Classic; Theme Store reviewer-stores test against Classic. Hyprism ships these templates as a Theme Store submission requirement + for the (large) Classic-account market. If your store is on New Accounts, these settings have no live effect — but the templates must exist in the theme for submission to pass.

⚠️ Dev-store testing limitation

Shopify development stores force “New Customer Accounts” since 2024 — even if you toggle Classic in Settings → Customer Accounts, dev-stores ignore the theme files for these templates. To preview customer pages live during development you need either (a) a Theme Store reviewer-grade Partner demo-store, or (b) a paid live store on Classic. The customizer preview works on dev-stores; the live storefront does not.

11.12 Gift Card (gift_card.liquid + gift_card.json not supported)

The gift-card recipient page (where someone redeems a gift card).

⚠️ Shopify limitation: templates/gift_card.json is not supported. Only gift_card.liquid works. This means you can’t use a JSON template here.

Hyprism’s dual-file pattern

Hyprism works around this with a creative pattern:

• templates/gift_card.liquid — a minimal Liquid wrapper with {% layout none %} + custom <html>/<head>/<body> shell. Inside: {% section 'gift-card-main' %}.
• sections/gift-card-main.liquid — a full section with {% schema %} and ~20 settings. Customizable in the theme editor under “Templates → Gift card”.

This makes the gift-card page editor-customizable despite Shopify’s limitation. Most themes (Dawn, Horizon) leave this hardcoded; Hyprism’s approach is unique.

What you can customize

Content

Setting	What it does
🔧 Logo override	Override the theme logo just for this page. Leave empty to use the theme-wide logo from §2.1.
🔧 Custom heading	Override the default “Your gift card” heading.
🔧 Subtext (use at checkout)	Optional secondary hint shown beneath the gift-card code — e.g. “Use this code at checkout”. Leave blank for the default localised string.
🔧 Footer text	Optional text rendered at the bottom of the gift-card page (e.g., expiration / customer-service contact).
🔧 Show Apple Wallet button	✅ Default on.
🔧 Show Print button	✅ Default on.
🔧 Show QR code	✅ Default on. Renders a scannable QR code (144 px) of the gift-card identifier so the recipient can redeem at checkout without typing the code. Generated client-side from gift_card.qr_identifier.

Card style

Setting	What it does
🔧 Card surface	Solid / Transparent / Glass (✅ default).
🔧 Card glass tint	✅ Default off.
🔧 Card corner radius	Range 0–48px, step 2. ✅ Default 24px.
🔧 Card padding	Range 16–80px, step 4. ✅ Default 40px.
🔧 Card glow	✅ Default on.
🔧 Card shadow	✅ Default on.
🔧 Gradient sheen	✅ Default on. Subtle animated gradient sweep across the card surface for a premium feel.

Background

Setting	What it does
🔧 Background image	The page background image.
🔧 Overlay color	✅ Default #000000.
🔧 Overlay opacity	Range 0–90%, step 5. ✅ Default 45%.

11.13 Robots.txt and llms.txt

Two special “templates” that aren’t pages but emit text content:

Robots.txt

Shopify generates a working /robots.txt automatically for every store — no theme file is required, and per Shopify’s Theme Store rules a theme must not ship a robots.txt.liquid template. Hyprism therefore does not include one out of the box.

If you want to customise crawler rules (for example, to explicitly allow AI crawlers like GPTBot / ClaudeBot / PerplexityBot for AI-search visibility), add the template yourself after install: Online Store → Themes → Edit code → Templates → Add a new robots.txt.liquid, starting from {{ robots.default_groups }} and appending your own User-agent / Allow rules. A ready-to-paste snippet is provided in chapter 13 — SEO and GEO. Deleting the file reverts to Shopify’s default. (This is an unsupported customisation — incorrect rules can deindex your store.)

llms.txt

Not a Shopify template per se — instead, you create a Shopify Page with handle “llms” and use the Page template page.llms-txt (file templates/page.llms-txt.liquid) which renders an llms.txt-formatted list of products / collections / pages / articles in your store. AI systems read this to understand your catalog structure.

See chapter 13.

11.14 Featured content embeds (featured-page, featured-article)

Shopify’s Page and Article templates can only render where you’d expect — on /pages/{handle} and /blogs/{blog}/{handle} respectively. But sometimes you want to show a snippet of a Page or Article on another template: your About page intro on the home page, your latest article preview on the product page, an FAQ excerpt on the collection page.

Hyprism ships two dedicated sections for this:

• 🧩 Featured Page (featured-page) — picks a Shopify Page and renders title + content excerpt + (optional) custom heading override.
• 🧩 Featured Article (featured-article) — picks a Shopify Article and renders featured image + title + excerpt + (optional) meta (author, date).

Both are full v7-chrome sections (transparent_bg / glass / glow / shadow / full_width / radius / visibility / dark-light pair). They accept the same atom blocks as other content sections (heading, text, button, image, video, icon, group, spacer, divider) plus a few extras (recently-viewed-grid, wishlist-grid, app blocks).

11.14.1 Featured Page

Add a Featured Page section to any template — home, collection, article, cart, etc. (available everywhere except the Page template itself, where it would create a recursion).

Settings — content source

Setting	What it does
🔧 Page	Picker — choose which Shopify Page to embed
🔧 Custom heading	Override the page’s title (leave empty to use the page’s actual title)
🔧 Custom subheading	Rich-text intro shown above the page content. Useful as an eyebrow or short context line.
🔧 Excerpt word count	Limit the embedded content to N words. ✅ Default 0 (no limit — render full content). Set to e.g. 50 for a snippet preview.

Settings — title display

Setting	What it does
🔧 Show title	✅ Default on.
🔧 Heading size	H1 / H2 (✅ default) / H3. Visible when title is on.
🔧 Heading alignment	Left (✅ default) / Center / Right.

Settings — layout

Setting	What it does
🔧 Content width	Range 500–1400px, step 50. ✅ Default 800px.
🔧 Blocks position	Before page content or After (✅ default). Same semantics as the Page section’s blocks_position.
🔧 Background image	Optional section background (separate from page-background).
🔧 Overlay color	✅ Default #000000.
🔧 Overlay opacity	Range 0–90%, step 5. ✅ Default 0%.

Plus standard v7 chrome (color scheme, surface, layout, radius, visibility).

When to use Featured Page

• ✅ Home-page “About us” intro that links to the full About page
• ✅ Product-page “Sizing guide” snippet linking to the full guide
• ✅ Collection-page “Buying guide” intro
• ✅ FAQ snippet on the cart page
• ⚠️ Avoid embedding very long pages — set Excerpt word count to 50–100 for snippet previews.

💡 Pair the embedded Page content with a CTA button block (added inside the section) linking to the full Page. Pattern: “Read more →” or “Full sizing guide →“.

11.14.2 Featured Article

Add a Featured Article section to any template (available everywhere except the Article template itself).

Settings — content source

Setting	What it does
🔧 Article	Picker — choose which Shopify Article to feature.
🔧 Custom heading	Override the article’s title.
🔧 Custom subheading	Rich-text intro shown above the article preview.
🔧 Excerpt word count	Range 0–200, step 10. ✅ Default 50 (snippet-sized).

Settings — title + image display

Setting	What it does
🔧 Show title	✅ Default on.
🔧 Heading size	H1 / H2 (✅ default) / H3.
🔧 Heading alignment	Left (✅ default) / Center / Right.
🔧 Show image	✅ Default on. Render the article’s featured image.
🔧 Image corner radius	Range 0–32px, step 2. ✅ Default 8px.
🔧 Show meta	✅ Default on. Master toggle — author + date display.
🔧 Show date	✅ Default on. Visible when meta is on.
🔧 Show author	✅ Default on. Visible when meta is on.

Settings — layout

Setting	What it does
🔧 Content width	Range 500–1400px, step 50. ✅ Default 800px.

Plus standard v7 chrome (color scheme, surface, layout, radius, visibility). Note: unlike Featured Page, Featured Article does NOT have its own background_image / overlay settings — if you need a backdrop, wrap in a Custom Section (§10.13) or use page-background (§3.10).

When to use Featured Article

• ✅ Home-page “Latest from the blog” feature
• ✅ Product-page “Buying guide” or “How to use” article callout
• ✅ Collection-page editorial pairing (“Read about our sourcing”)
• ✅ Cart-page “While you wait, read this” engagement
• ⚠️ For multiple articles, use the Blog section in a multi-article configuration instead.

💡 Combine with a button block linking to the full article. Common patterns: “Read the full story”, “Continue reading”, “Learn more →”.

Compared to Featured Collection

Hyprism has three “featured-X” sections:

Section	Source	When to use
🧩 Featured Collection	A Shopify Collection	Show a curated product subset on any template
🧩 Featured Page (above)	A Shopify Page	Embed editorial / static content (About, FAQ, guides)
🧩 Featured Article (above)	A Shopify Article	Embed blog content as a preview / lead

All three share the same v7-chrome layout pattern, so they compose visually with the rest of your page.

Next

Chapter 12 — Cart experience — the cart drawer, cart page, AJAX updates, promo bars, and express checkout.