Skip to main content

Banner v3

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: Specifies the width of the header content

    • Options: Full width, Box, Wide, etc.

  • Image left:
    Upload an image to be displayed on the left side.

    • Supported formats: .jpg, .jpeg, .png, .svg, .gif

  • Image mid:
    Upload an image to be displayed in the center.

    • Supported formats: .jpg, .jpeg, .png, .svg, .gif

  • Image right:
    Upload an image to be displayed on the right side.

    • Supported formats: .jpg, .jpeg, .png, .svg, .gif

  • Title:
    The main heading text for the banner.

    • Example: Find Balance and Bliss on the Mat
    • Use <br> to break lines.

  • Sub:
    A subtitle or short description below the main title.

    • Example: Discover High-Quality Blocks, Straps, and Bolsters to Enhance Balance, Comfort, and Inner Peace
    • Use <br> to break lines.

  • Link image:
    Choose a link to apply to the banner (or images).

    • Example: All Products

collection demo

2. 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

slideshow demo

3. 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