Promotion banner
Overview:
The Promotion Banners section allows you to display a grid of promotional banners with images, text, buttons, and customizable layouts. These banners are great for showcasing featured collections, products, announcements, or sales in a visually engaging way.
Section Configuration:
Grid & Layout Settings
| Setting |
Description |
| Desktop Row Height |
Sets the height of a row on desktop. Range: 200–580px. Default: 250px. |
| Mobile Row Height |
Sets the height of a row on mobile. Range: 150–300px. Default: 200px. |
| Full-Width Section |
Expands the banners to full width or keeps them contained. Default: true. |
Spacing Settings
| Setting |
Description |
| Top Padding |
Adds spacing above the section. Range: 0–100px. Default: 36px. |
| Bottom Padding |
Adds spacing below the section. Range: 0–100px. Default: 36px. |
Block Configuration:
Banner Block
Each Banner Block represents a single promotional banner within the grid.
Content Settings
| Setting |
Description |
| Image |
Upload an image for the banner. |
| Tag Label |
Displays a small tag (e.g., "New" or "Featured"). |
| Tag Background Color |
Sets the background color of the tag. |
| Tag Text Color |
Sets the text color of the tag. |
| Heading |
Main text for the banner. |
| Heading Size |
Choose between h2, h3, h4, or h5. Default: h3. |
| Heading Weight |
Font weight options: bold, semi-bold, medium, or normal. Default: bold. |
| Description |
Add a short description below the heading. |
| Description Size |
Choose small, medium, large, or extra-large text. Default: small. |
| Description Weight |
Font weight for the description. Default: normal. |
| Setting |
Description |
| Button Label |
Text displayed on the button. Default: "BUTTON LABEL". |
| Button Link |
The URL where the button redirects. |
| Button Type |
Choose between primary or secondary button styles. Default: primary. |
| Make Banner Clickable |
Makes the entire banner a clickable link. Default: false. |
| Banner Link |
Add a URL to make the entire banner a clickable element. |
| Open in New Window |
Opens the link in a new tab. Default: false. |
Alignment & Positioning
| Setting |
Description |
| Content Position |
Determines where the text appears on the banner. Options: Top Left, Top Right, Top Center, Center, Bottom Left, Bottom Right, Bottom Center. Default: Bottom Left. |
| Text Alignment |
Align text left, center, or right. Default: left. |
Grid Layout Settings
| Setting |
Description |
| Columns |
Number of columns for the banner. Range: 1–6. Default: 3. |
| Rows |
Number of rows for the banner. Range: 1–4. Default: 2. |