A reference content model for an online store powered by Contentful and Shopify.

Top of the page banner for displaying promotional messages across the website or on selected pages

Internal name

Body text

Color palette

💎 Top banner component

Full-width container for displaying images and snappy copy; can include an optional CTA

Headline

CTA text

Target page

Image

Focal point

Image style

Hero size

Intent Tags

💎 Hero banner component

A container for managing store information

Title

Slug

Featured image

Store Address

Top section (optional)

Contact information

Opening hours

Description

Location

Bottom section (optional)

SEO metadata

📄 Store info

Container entry that enables editors to publish a page, define its slug, select & arrange its content

Page content

Extra section (optional)

📄 Landing page

Name

Top banner

Bottom component

Landing pages

Collections

Products

Country

Start

🎛 Campaign

A container for highlighting selected products that can be embedded on any page.

Slider alignment

💎 Product slider

Configuration panel controlling website settings and microcopy

Site name

Base URL

Logo

Default SEO

Default CTA

Footer label (optional)

🎛 Site configuration

Container for organizing the top & footer navigation

Internal title

Top navigation

Footer navigation

Payment methods

Target country

🎛 Navigation

Question

Answer

#️⃣ FAQ Item

Container for organizing links to SHOPIFY pages within the mega menu

Section header

Target URL

Links

🎛 Nav Section (Shopify) (L2)

Container for organizing promotional cards within the mega menu

targetCollection

🎛 Nav Section (Promo) (L2)

Container for organizing links to CONTENTFUL pages within the mega menu

🎛 Nav Section (Contentful) (L2)

Container for organizing tabs and mega menus in the global navigation bar

Highlighted?

Menu sections

[DEPRECATED] Target Page

🎛 Nav Tab (L1)

Components

⚛️ Personalization container

Container for ever-green content like About us, Career pages, FAQ, Knowledge base & more

Short description

Body

#️⃣  Topic

Simple wrapper enabling the use of external apps to serve images, videos, products, files, playlists & more

External asset

External app

External URL

🎀 External asset wrapper

Full-width container for displaying side-by-side image and copy, includes multiple layout options

Container layout

CTA Text

[DEPRECATED] Image style

[DEPRECATED] Image alignment

💎 Duplex component

Constrained-width component for displaying ad-hoc paragraphs of text (disclaimers, intros, descriptions)

Subline

💎 Text block component

Full-width component for quotes, reviews and testimonials, includes multiple layout options

Quote

Quote alignment

Image position

💎 Quote component

Full-width container for displaying short bits of generic information with optional icons/visuals

Block 1 image

Block 1 body

Block 2 image

Block 2 body

Block 3 image

Block 3 body

💎 Info block component

A container for highlighting selected collections, can be used on any page.

Anchor

Color Palette

💎 Collection mosaic

A container for augmenting product detail pages (PDPs) with editorial content

Product detail

Editorial section

📄 Product page

SEO title

Hide page from search engines (noindex)

Exclude links from search rankings (nofollow)

📈 SEO

Container for augmenting a product listing page (PLP) with editorial content

Collection

Top section

Bottom section

📄 Collection page

Full-width container for creating visually distinct Calls-to-Action (CTAs)

Byline

💎 CTA component

File

Asset

Contentful Lifestyle (eCommerce)

artas.bartas