Use the Design stage to create one consistent appearance across the standalone page, popup, and app block. On mobile, use Design, Preview, and Theme at the top of the stage to switch between visual controls, the live preview, and theme presets.
Theme presets
Start with a preset such as Store brand, Clean light, Bold contrast, Midnight, Forest, Ocean, Sunset, or Berry. A preset changes the visual foundation; you can still customize individual choices afterward.
Brand assets
Upload a header image and logo. Adjust the logo size until it reads clearly in both desktop and mobile previews. The Shopify Contest Popup and Contest Form blocks show the shared header image by default; turn off Show header image in a block's theme-editor settings when that placement should omit it.
See Images & Logo for image guidance.
Colors
Set the primary, background, and text colors. Keep strong contrast between text and its background and make the primary button easy to identify.
Button and core copy
Customize the primary call-to-action, entry success heading, and success message. The contest language controls built-in system text, but text you write yourself must be translated manually.
Custom text (Pro)
Pro stores can expand Custom text · Pro to override the contest's translated storefront text, including:
- Entry-page headings and accessibility labels.
- First-name, phone, and email labels and placeholders.
- Required-field and invalid-email messages.
- Entry-count, date, and bonus-action notices.
- Success copy and action buttons.
Leave an override blank to use the selected contest language. Where the editor shows a variable such as {{date}}, {{start}}, {{end}}, or {{count}}, retain it so live dates and counts still appear. Each custom field supports up to 500 characters.
The overrides apply to the standalone page, popup, and form block. A button or success-message override set directly in a Shopify theme block takes precedence for that block.
Display options
Choose whether to show prizes, dates, and the terms link. The same settings are also available while configuring the Build-stage entry form.
Preview modes
Use the controls above the preview to check:
- Desktop and mobile widths.
- Standalone page, popup, and app-block surfaces.
- Entry and success states.
The preview is the fastest way to catch cropped images, low color contrast, long translations, or a success message that does not fit. Save when you are happy with the result, then run a final customer-facing check. On desktop, use the header Preview action. On mobile, open More actions (…) and choose Preview.