The Hero Home section is the primary banner area located at the top of the Homepage template. It displays a split layout featuring structured text content on one side and a high-resolution image on the other.
️Section Blocks
You can customize the layout by adding, removing, and reordering the following blocks:
- Heading:
* Displays the main title of your storefront.
* Includes checkbox options to automatically highlight the first or last word of the title using a custom brand color or gradient.
- Paragraph:
* Displays the description content under the heading.
- Button:
* Link buttons. Supports solid, secondary, outline styles, and custom color variables.
- Image:
* Displays a secondary supporting graphic inside the text column.
️Key Settings
Configure these options by selecting the Hero Home section header:
- Height: Slider control adjusting the section height from 400px to 1000px on desktop screens.
- Content Position: Set content alignment to Left, Center, or Right.
- Container Width: Choose between Full Width, Standard, or Narrow container limits.
- Colors: Assign a specific color scheme (e.g. Background 1, Accent 1) to the section background.
Recommended Image Dimensions
- Visual Aspect Ratio: Square (
1:1) or Standard Landscape (4:3). - Recommended Resolution:
1200px × 1200pxor1200px × 900px(PNG format with transparent background is recommended if using colored backgrounds).