Zeppelin StudioOpaline
  1. Docs
  2. Sections
  3. Products & collections

Products & collections

Colorways

Shows one product range in each of its finishes. Visitors click a swatch and the photograph, background wash and glass panel change together.

12 section settings1 block type · 5 settingsAvailable on every template
Two shades & two charactersBeige1234
  1. 1Heading and text
  2. 2Large photo of the range
  3. 3Glass card: color name and link
  4. 4Swatches switch the photo

Add the section#

Available on every template.

  1. From your Shopify admin, go to Online Store > Themes, then click Customize next to Opaline.
  2. Use the page selector at the top of the editor to open the template you want to change.
  3. In the sidebar, click Add section where you want it to appear.
  4. Select Colorways. Click the section in the sidebar to open its settings.
  5. Click Save in the top right corner when you are done.

Settings#

General

Overline
Text

The text shown in this place.

Heading
Rich text

Formatted text: bold, italic and links are kept.

Visual size
Dropdown
Default: ContainedEdge to edgeFull screen
Visual height
Slider

Applies to the edge-to-edge and full-screen sizes.

Default: 85vhFrom 50 to 100vh, in steps of 5
Heading size
Slider
Default: 100%From 60 to 180%, in steps of 5
Text
Rich text

Formatted text: bold, italic and links are kept.

Link label
Text

The text shown in this place.

Link
Link

Where the link leads: a product, a collection, a page, or any web address.

Color scheme
Color scheme

The color scheme of the section. Schemes are set under Theme settings > Colors.

Default: Scheme 1
Top padding
Slider
Default: 140pxFrom 0 to 240px, in steps of 4
Bottom padding
Slider
Default: 140pxFrom 0 to 240px, in steps of 4
Heading typeface
Dropdown

Theme default follows the section heading font chosen in Theme settings > Typography.

Default: Theme defaultHeading fontBody fontSans-serif heading font

Blocks#

Click Add block under the section in the sidebar to add one, then drag blocks to reorder them.

Colorway#

Up to 6 per section

General

Image
Image

Select an image from your Files, or upload a new one.

Name
Text

The text shown in this place.

Note
Text

The text shown in this place.

Swatch
Color

Pick a color, or type its hex code.

Default: #E8E3DA
Background wash
Color

The section background tints towards this color.

Default: #EFEAE1