Skip to main content

Banner v5

demo image

Steps to use this section:
  1. In the Theme Editor (Customize), click Add section
  2. Locate [Section Name]
  3. Click to add, then Save

Section Settings​

1. Layout Settings​

  • Container type: Determines the width of the banner container.
  • Gap/Spacing: Sets spacing between items inside the section (if applicable)
  • Image hover effect (if available): Applies dynamic effect on hover — may affect image dimensions.

layout settings

2. Content Settings​

  • Text: Add content for sections. Leave blank to hide.
  • Image: Upload image(s) used in the section.
  • Items: For sections like sliders or collections, you can add multiple blocks/items here.

content settings

3. Button settings​

You have the flexibility to modify the label displayed on the button right here. Additionally, you can custom the button by selecting the Button mode, Button style, Button size option, Custom Border radius, Button padding

button demo

4. General settings​

Section color scheme: lets you select a predefined color scheme for the section, which applies to the text and background.

Background image The priority is higher than Background color

Use parallax enables a parallax scrolling effect for the background image (if one is set)

Section Padding allows you to specify spacing before or after sections or both

general demo

Block Settings (if available)​

Some sections allow you to add blocks (e.g. slides, collection items, feature cards). Each block usually has its own set of options:

  • Image: Upload the image for the block (e.g. slide image)
  • Heading / Text: Add title or short content per block
  • URL / Button: Optional links or CTA
  • Custom Style: (if supported) such as overlay color, alignment, animation, etc.
Example:

In the Slideshow section, each block = one slide.
To add a new slide:

  1. Click Plus Icon
  2. Customize content per slide