Design & Customization
By James
By James
Customize contest colors, images, logos, buttons, and post-entry messaging.
Customizing Your Contest
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. The Design stage of the contest editor 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.
Images & Logo
Add a header image and logo from Design > Brand assets. The live preview shows how each asset will look across contest surfaces. Header image Use a wide, high-quality image that supports the campaign without placing essential text near the edges. The available space changes between desktop, mobile, popup, and app-block layouts, so review every preview mode. The Shopify Contest Popup and Contest Form blocks show this header image by default. In either block's theme-editor settings, turn off Show header image when the placement already has campaign artwork or when you want a text-first layout. The setting affects only that popup or form block; it does not remove the asset from the contest or other channels. Logo Upload a clear logo with transparent space where appropriate. Use the logo-size control to set it from 24 to 200 pixels, then check both desktop and mobile. Upload, replace, or remove 1. Open the contest editor and choose Design. 2. Expand Brand assets. 3. Upload the header image or logo. 4. Use Change to replace an asset or Remove to clear it. 5. Save the contest. Recommended preparation - Use a sharp source image and avoid unnecessary compression. - Keep the most important subject near the center of a header image. - Prefer a logo that remains legible at small sizes. - Check color contrast if the asset sits next to text or buttons. - Preview on mobile before launch. If an upload fails, confirm the file is a supported web image and below the upload limit, then retry from a stable connection. See Popup Block and Form Block for channel-specific setup.
Success Page
The success state appears immediately after a confirmed entry. Use it to reassure the entrant, explain the next step, and present any earned reward or bonus actions. Edit the message 1. Open the contest editor. 2. Go to Build. 3. Expand Success. 4. Edit the heading and message. 5. Save the contest. Use Design and switch the preview from Entry to Success to check the finished state on desktop, mobile, popup, and app-block layouts. What can appear after entry Depending on the contest configuration, the success experience can include: - Your custom heading and message. - A unique Shopify discount code for the entrant. - Bonus actions. - A unique referral link with Copy and a native Share button when supported. - Successful referral count and progress towards the maximum referral reward. - Confirmation that the entry was accepted. Copying or sharing a referral link does not award entries. The configured reward is added after a new entrant completes a valid entry through that link. See Referral Sharing. Writing effective success copy - Confirm that the entrant is successfully entered. - Explain when and how winners will be contacted. - Mention bonus-entry opportunities clearly. - If referrals are enabled, explain how many entries a successful referral earns and the maximum reward. - If a discount is provided, state its expiry and important conditions. - Keep the most important information near the beginning for mobile visitors. Built-in system text follows the selected contest language. Translate your custom heading and message yourself when running a localized contest. For per-entrant rewards, see Discount Code Rewards.
Contest Languages
Each contest can present built-in customer-facing content in English, German, Spanish, or French. The app and merchant emails have a separate language preference. App and merchant email language Choose Language during onboarding. To change it later, open Your Plan, find Language, choose an App & email language, and click Save. The app reloads in the selected language, and supported lifecycle emails use the same preference. This does not change the language of an existing customer-facing contest. Each contest keeps its own Contest language setting. Choose a language 1. Open the contest editor. 2. Go to Build > Contest settings. 3. Select the contest language. 4. Review the preview and save. For a new contest, the app chooses a sensible default from the store's primary-domain locale and falls back to the staff/admin locale when needed. What is localized The selected language controls: - Built-in form labels, validation, and system messages. - Generated template content. - Customer-facing date formatting. - Default generated terms. - Discount-code reward emails. What you must translate Text that you have written or customized is not translated automatically. Review and translate: - Contest title and description. - Custom terms and conditions. - Custom prize titles and descriptions. - Button, success, and other custom copy. - Bonus-action titles, questions, options, hints, and sharing messages. Changing the language does not overwrite your existing custom text. This protects your copy, but it also means a language switch can leave a contest with mixed-language content until you finish the translation. Before launch 1. Switch the Design preview between entry and success. 2. Check desktop and mobile layouts for longer translated phrases. 3. Preview each channel you plan to use. 4. Submit a test entry. 5. If discount emails are enabled, send a test email and review it. 6. Confirm the legal terms match the target audience and jurisdiction. One contest has one selected language. If you need separate fully customized language experiences, duplicate the contest, translate each copy, and share the appropriate link with each audience. For notification categories and unsubscribe behavior, see Merchant Email Notifications.