Design Tab

The Design tab controls how your Reward widget looks, from its title and feature image to custom CSS and widget text.

Style your reward widget to match your brand.

Reward Title shows your Reward's name at the top of the widget. It uses your Reward Name by default, but you can write a different public title (up to 80 characters), or switch it off. Make it describe the offer, like "Get 20% Off at Local Supply".

Gleam interface showing the Reward Title setting

Add an image or video to the top of your widget with Feature Media.

  • Images: upload up to 4 images (5MB max each). One image shows as a feature image, more than one becomes a slideshow. We recommend 1080 x 567px for a single image and 1080 x 810px for a slideshow
  • Video: paste a YouTube, Twitch, Vimeo or Wistia URL instead
Gleam interface showing Feature Media upload and video options

Use Description to tell people what they get and how to claim it. Leave it blank and we'll write one for you based on how many actions unlock the Reward.

Gleam interface showing the Reward Description editor

Change the look of the widget itself:

  • Design: the overall widget style (Modern by default)
  • Text Alignment: left or centred text
  • Padding & Rounding: how much space and how rounded the corners are
Gleam interface showing Widget Design Options for a Reward

Every Reward gets a Gleam-hosted landing page. Styling uses your site settings by default, and you can change the background in your site settings.

Gleam interface showing Landing Page styling options for a Reward

On the Business Plan & above you can add custom CSS to style almost any part of the widget. It only affects this Reward, and you only need to add the overrides, for example .entry-method .tally { color: blue }.

Gleam interface showing the Custom Styles (CSS) editor for a Reward
Tip

To style every campaign at once, add global CSS under Site > Settings > CSS.

You can change any text in the widget. Add the key for the text you want to change and your new value in quotes (it uses YAML). Only add the lines you're changing.

Gleam interface showing the Widget Text Overrides editor for a Reward

The reference file has this:

reward_confirmation_opening_singular: "You have successfully unlocked "
reward_coupon_data_prefix: "Your coupon to redeem this reward is below:"

To change them, add this to Widget Text Overrides:

reward_confirmation_opening_singular: "Thanks for unlocking "
reward_coupon_data_prefix: "Your coupon to get 10% off your order is below"
  View Text Overrides List

See Next Article

Post Redeem Tab

The Post Redeem tab controls what happens after someone claims your Reward, from the redemption email to webhooks and tracking pixels.