Hero gallery

Display multiple hero images or videos with thumbnail navigation

Key features

Hero images and autoplay videos

Gallery thumbnail navigation

Flexible overlay content

Custom layout and styles

Section height


You can set the section height in pixels to be the exact same height on all devices or as a percentage to adapt to the section height of the screen height.

Click Slide block to find settings

Section height

Adapt to screen height (50 - 100%) Fixed height (300 - 800px)

Mobile section height

Adapt to screen height (50 - 100%) Fixed height (300 - 800px)

Slide thumbnails


The Slide thumbnails show a small image of each slide, which visitors can click through to navigate the gallery.

In the section settings, change the size and position, and choose to enable the corner radius from global styles.

Click Section to find settings

Media ratio

Portrait (2:3) Portrait (4:5) Square (1:1) Landscape (5:4) Landscape (4:5) Custom

Media width

60 - 200px

Position

Left Center Right

Mobile position

Left Center Right

Corner radius

Slide blocks


Add slide blocks with an image or autoplay video (without sound).

Media

Click Slide block to find settings

Media type

Image Video

Image

Custom mobile image

Video

Video focal point

Custom mobile video

Content

Add overlay headings and text.

Click Slide block to find settings

Overline

Overline size

1 - 4

Heading

Heading size

1 - 6

Text

Text size

1 - 4

Buttons

Add a primary and secondary button.

Click Slide block to find settings

Link

Label

Size

XS S M L

Style

Solid Outline Text

Color scheme

Default Primary Secondary Soft Overlay Overlay soft

Overlay colors

Click section to find settings

Overlay opacity

0 - 100%

Color scheme

Default Inverse Soft Accent Accent inverse Overlay Color scheme 1 Color scheme 2

Section styles


Customize general style options for the section and content area. Settings for Content area allow you to adjust the width, borders, and dropshadow of the container of the section content.

Click section to find settings

Content area

Width

Full width Full width padded Page width

Full width on mobile

Available for Full width padded option.

Set content to page width

Available for Full width padded and Page width options.

Section

Top padding

0 - 27

Bottom padding

0 - 27

Dividers

None Top only Bottom only Both

Force dividers full width

Color scheme

Default Inverse Soft Accent Accent inverse Overlay Color scheme 1 Color scheme 2

Anchor ID

Link directly to the section on any page. Learn more