Zeppelin StudioOpaline
  1. Docs
  2. Sections
  3. Storytelling

Storytelling

Sticky story

A story in steps: the text scrolls while the image beside it stays in place and changes from one step to the next.

25 section settings1 block type · 2 settingsAvailable on every template
The making ofa timeless piece010203123
  1. 1Intro that stays in place
  2. 2Chapter list
  3. 3Images that scroll past

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 Sticky story. Click the section in the sidebar to open its settings.
  5. Click Save in the top right corner when you are done.

Settings#

Text column

Overline
Text

The text shown in this place.

Heading
Rich text

Formatted text: bold, italic and links are kept.

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.

Media side
Dropdown
Default: RightLeft

Media column

Default image width
Slider
Default: 100%From 40 to 100%, in steps of 5
Default image format
Dropdown
Default: PortraitTall portraitSquareLandscapeWideOriginal
Image 1
Image

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

Heading 1
Rich text

Formatted text: bold, italic and links are kept.

Caption 1
Text

The text shown in this place.

Image 2
Image

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

Heading 2
Rich text

Formatted text: bold, italic and links are kept.

Caption 2
Text

The text shown in this place.

Image 3
Image

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

Heading 3
Rich text

Formatted text: bold, italic and links are kept.

Caption 3
Text

The text shown in this place.

Layout

Background
Gradient

A CSS background, for example a gradient.

Color scheme
Color scheme

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

Default: Scheme 1
Top padding
Slider
Default: 120pxFrom 0 to 240px, in steps of 4
Bottom padding
Slider
Default: 120pxFrom 0 to 240px, in steps of 4
Top padding (mobile)
Slider
Default: 48pxFrom 0 to 160px, in steps of 4
Bottom padding (mobile)
Slider
Default: 48pxFrom 0 to 160px, 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.

Step#

Up to 5 per section

General

Title
Text

The text shown in this place.

Text
Text

The text shown in this place.