Enable a transparent header when this banner section is placed as the first section on the page.
Image
Upload the main desktop banner image. Recommended size depends on your layout preference for best quality display.
Mobile Image
Upload a separate image optimized for mobile devices for better responsiveness and performance.
Image position
Cover: Fills the entire banner area while maintaining image proportions.Fit: Displays the full image inside the container without cropping.
Media height
Controls the height of the banner section.Extra small: Compact banner height.Small: Smaller banner display.Medium: Balanced default banner height.Large: Taller banner layout for more visual impact.Adapt: Automatically adjusts height based on the uploaded image ratio.
Mobile height
Set a separate banner height specifically for mobile devices for better responsiveness.
Size
Controls the width of the section layout.Full width: Expands the banner across the full screen width.Page width: Keeps the banner aligned within the page container width.
Layout Direction
Choose how the content and media are arranged inside the section.Vertical: Stack content vertically.Horizontal: Display content side-by-side horizontally.
Alignment
Controls the horizontal alignment of the content.Left: Align content to the left side.Center: Align content to the center.Right: Align content to the right side.
Position
Controls the vertical positioning of the content inside the banner area.
Gap
Adjust spacing between content elements inside the section.
Color scheme
Select a predefined color scheme for the section appearance.
Media overlay
Add a color overlay on top of the image or media for better text readability and styling.
Overlay color
Choose a custom overlay color for the media background.
Overlay style
Select the overlay style.Solid: Uses a single solid color overlay.Gradient: Applies a gradient overlay effect.
Gradient direction
Choose the direction of the gradient overlay effect.
