Offer Appearance Customization

Modified on Fri, 27 Feb at 4:45 AM

When setting up how your offer looks on the storefront, there are two key things you need to pay attention to. Understanding these will help you get the exact design you want—without confusion.

1. Choose how the offer is displayed (Offer creation page)

When you’re creating or editing an offer, look at the right-hand side of the screen.
There you’ll find the “Select display offer type” section.

This is where you choose the structure of your offer layout.

Available display types:

List

Card list
Organized list

Best for a clean, simple presentation.

Grid

Detailed grid
Grid range
Detailed grid with each price
Grid range with each price

Best when you want to show more details or multiple price levels.

Banner

⚠️ Important:
Banner layout is only available for Collection and Cart offer types.

⚠️ Important to know about List & Grid layouts

The grid/list layout selection is for preview purposes only.
The final layout is selected on the offer page.

All advanced appearance settings are applied based on the layout selected on the offer page, not the preview.

This helps you visualize the offer while creating it, but the actual layout decision happens later.

2. Customize the appearance (Settings → Display settings)

After choosing the display structure, go to:

Settings → Display settings

This is where you control how the offer actually looks on your storefront.

Here you can customize:

Fonts
Colors
Text styles
Borders
Overall style and spacing

All display types (List, Grid, Banner) can be customized here.
The settings you configure will be applied to the display type selected in your offer.

You can also preview how the offer will look on your storefront directly from this section.

Design inheriting option

You can enable Design inheriting if you want the offer to automatically match your store’s existing design.

⚠️ When enabled, Design inheriting overrides other appearance settings.

This option is useful if you want a consistent look without manual customization.

Read more about offer appearance and language customization here and here.