Skip to main content
Addons for Elementor Documentation

Search for answers or browse our knowledge base.

< All Topics

Coupon

Boost your conversions with the Coupon widget! It’s designed to display discount codes in a stylish way, featuring a “Click to Copy” function that makes it easy for customers to save.

This widget comes free with WPMozo Addons Lite. To use it, simply install and activate the free version of plugin.

Overview

Promotions are a powerful way to drive sales. This widget allows you to create professional coupon sections that look great on any device. With built-in functionality to copy the code to the clipboard, you remove friction from the customer’s journey.

How to use

  • Drag the “Coupon” widget onto your page.
  • Enter your coupon code and the discount details (e.g., “20% OFF”).
  • Customize the “Copy” button text and success message.
  • Style the coupon card to match your website’s promotional theme.

Content settings

  • Coupon Info: Add your coupon title, a brief description, and the actual promo code.
  • Discount Badge: Enable the offer discount label and enter the percentage or fixed amount.
  • Expiration Info: Set an expiry date and choose the format to display it to your users.
  • Copy Logic: Toggle “Copy on Click” functionality and set the success message text.

Style settings

Title and description

Customize the typography and colors for the coupon’s main headings.

  • Heading Level: Select the appropriate HTML tag (H1-H6) for the title.
  • Color & Typography: Individual controls for Title and Description text.
  • Text Shadow: Add a shadow to the text for a more stylized look.
  • Alignment: Align text elements collectively or individually.

Coupon code

Style the promo code box to make it stand out from the rest of the card.

  • Color & Background: Set the text color and background color/gradient for the code area.
  • Typography: Use a distinct font (like monospace) for the coupon code.
  • Border & Radius: Add dashed or solid borders and control corner roundness.
  • Box Shadow: Apply a shadow to make the code box appear elevated.

Discount and label

Make your offer visible with vibrant styling for the discount amount.

  • Text Color: Choose high-contrast colors for the discount percentage.
  • Background Color: Apply a background to the discount badge/section.
  • Typography: Increase font size and weight for the offer text.

Expiry message

Style the “Valid Until” or “Expired” message.

  • Color & Typography: Customize how the expiration date is presented.
  • Text Shadow: Add subtle styling to the date text.
Table of Contents