Promo item
| Setting | Description |
|---|---|
| Color scheme | Each color scheme can set different color for heading, description and link. (For example, one promo item block can have dark image and better to use color scheme with the light color for content, another promo item block can have light image and better to use color scheme with the dark color for content). |
| Switch background | When enabled, text and button follow light/dark mode. Disable to keep this color scheme in both modes. Only shown when the theme's dark/light mode feature is enabled. Enabled by default. |
| Promo position style |
Controls whether the promo item appears before or after the product at the specified grid position. Options: • Before product: The promo item is inserted immediately before the product at the chosen position. (Default) • After product: The promo item is inserted immediately after the product at the chosen position. |
| Position in grid |
Set the position of the promo item in a products grid. The promo item cannot be the last one after the products; it can be shown first before the products or between the products in the grid. Note that in some collections, the promo item may not be visible depending on the number of products on a specific collection page and the chosen position for the promo item. *On the page can be added maximum three product items blocks. |
| Item size |
• Small: The block width is the same as a single product card. • Large: The block width spans the width of two product cards. |
| Content alignment |
Aligns the promo item's text and button horizontally within the block: • Left • Center • Right |
| Background image | Add a background image to enhance the visual appeal of your section. This image will be displayed behind the content, creating a more engaging and visually appealing experience for your users. Make sure the image is high-quality and relevant to the content to ensure the best presentation. |
| Title | Enter a captivating heading for the promo item to catch the customer's attention. |
| Title size |
Controls the font size of the promo item's title: • Small • Medium • Large |
| Link label | You can add a link label to a call to action. After adding the label, the link appears automatically, and it will lead to the page you add. |
| Button style |
Choose the button's appearance: • Primary: Uses the primary button color defined in color scheme. • Secondary: Uses the secondary button color defined in each color scheme. • Outline: A button with a border and no fill. • Link: A minimal button style aligned with the text. • Link with dot: A minimal text-only link with a small dot marker next to it. |
| Link | To set a link, you can enter the link URL directly into the "Link" field or select a page from the dropdown list of options that appears when you click on the field. |
