Banner
Overview:
The "Banner" section is designed to create a visually striking introduction or highlight on your store’s page. This section is ideal for drawing attention to promotions, special events, or key products with the use of large images or videos, coupled with text and optional buttons.
Section Configuration:
Image and Video Settings
| Setting | Description |
| Image | Select an image for the banner. This is typically a high-resolution image that represents the main message or theme of the banner. |
| Parallax Effect | Optionally add a parallax scrolling effect to the image to create depth and enhance the visual experience. |
| Video Upload | Include a background video to add dynamic content to the banner, making it more engaging. |
Layout and Design
| Setting | Description |
| Section Height | Choose from predefined height settings (small, medium, or full window height) to determine how much screen space the banner will occupy. |
| Max Content Size | Define the maximum width percentage that the content can occupy within the banner, helping to maintain readability across devices. |
| Content Alignment | Adjust the vertical alignment of the content within the banner (top, middle, bottom) to best suit the visual layout. |
| Text Alignment | Set text alignment for both desktop and mobile views to ensure the text is positioned correctly within the banner. |
Styling Options
| Setting | Description |
| Background Overlay | Apply a color overlay on the banner image or video to improve text visibility or to match the site’s color scheme. |
| Color Scheme | Choose a predefined color scheme to apply to the text and button styles within the banner, ensuring consistency with your brand’s aesthetics. |
Blocks Configuration:
Content Customization
| Setting | Description |
| Heading | Add a main heading for the banner. This text is typically larger and more prominent. |
| Section Description | Provide additional details or context which complements the heading. |
| Content Alignment | Adjust the vertical alignment of the content within the banner (top, middle, bottom) to best suit the visual layout. |
Button Configuration
| Setting | Description |
| Button Label | Custom label for the 'View More' button, encouraging further interaction. |
| Button Type | Style the button as primary or secondary, influencing its visual prominence. |
| Button Link | URL for the 'View More' button, directing users to a detailed page or section. |
| Open in New Window | Option to open the link in a new browser tab. |