---
title: "How to Show Promo Code in an Elementor Template?"
url: https://theplusaddons.com/docs/show-promo-code-in-an-elementor-template/
date: 2024-02-21
modified: 2026-09-22
lang: en
author: "Aditya Sharma"
description: "The plain fields on a coupon card give you a title and a line of description. That is enough for a code, and not enough for an offer. Point the..."
image: https://theplusaddons.com/wp-content/uploads/2024/02/How-to-Show-Promo-Code-in-an-Elementor-Template_-1024x536.jpg
word_count: 863
---

# How to Show Promo Code in an Elementor Template?

## 

- The Plus Addons for Elementor Pro includes the Coupon Code widget, and the free plugin contains no coupon widget at all.
- Coupon Code uses a saved Elementor template on Peel, Scratch, or Slide Out coupon types, while Standard does not show the template option.
- The template renders as a real template with its own markup and Elementor stylesheet, and editing the saved template updates every card that uses it.
- The card does not resize to fit the template, so Width and Height must match the design or the template can overflow or be clipped.

The plain fields on a coupon card give you a title and a line of description. That is enough for a code, and not enough for an offer.

Point the card at a saved Elementor template instead and the reveal can show anything you can build - images, buttons, countdowns, whatever the offer needs.

For the full settings tour of the **Coupon Code** widget, see [Coupon Code Widget: Settings Overview](https://theplusaddons.com/docs/coupon-code-widget-settings-overview/).

***Requirement - This widget is a part of The Plus Addons for Elementor Pro, make sure it's installed & activated to enjoy all its powers.***

[LIVE WIDGET LINK](https://theplusaddons.com/elementor-widget/coupon-code/?utm_source=tpae&utm_medium=docs&utm_campaign=text)

## Before You Start

- **Edition:** **Pro** — **Coupon Code** ships only in The Plus Addons for Elementor Pro. The free plugin contains no coupon widget at all, so there is nothing to fall back to.- **Prerequisite:** [Elementor](https://wordpress.org/plugins/elementor/) (free) installed and active.- **Widget to enable:** go to **The Plus Addons > Widgets**, search for **Coupon Code** and turn its toggle on. This is the **Widgets** screen, not **Extensions**.- **Prerequisite:** save the layout you want to show as an Elementor template first (**Templates > Saved Templates > Add New**, type **Section**), then publish it. The **Template** dropdown only lists templates that already exist.

## Build the template

- From the dashboard go to **Templates > Saved Templates** and click **Add New**.- Choose **Section** as the type, give it a name and click **Create Template**.- Design the offer, then publish the template. Keep it roughly the size of the card - the card does not resize itself to fit.

## Point the card at it

- Edit the page with Elementor and drag the **Coupon Code** widget onto it.- In **Content > Layout**, choose any **Coupon Type** *except* **Standard**: **Peel**, **Scratch** or **Slide Out**. The template option does not exist for **Standard**.- Fill in **Content > Front Side** as usual, or set its **Content Type** to **Template** too.- Open **Content > Back Side** and set **Content Type** to **Template**. **Title**, **Title Tag** and **Description** are replaced by a single **Template** dropdown.- Pick your template from **Template**.

![Setting the back side Content Type to Template in the Elementor panel.](https://theplusaddons.com/wp-content/uploads/2024/02/Tpae-Coupon-Code-Show-Promo-Code-With-Template.gif)

![An Elementor template rendered as the card back side.](https://theplusaddons.com/wp-content/uploads/2026/09/couponcode-result-template-back.webp)

## The fields

| Setting | Where | Notes |
| ------- | ----- | ----- |
| **Content Type** | **Front Side** and **Back Side** | **Default** or **Template**. Hidden entirely when **Coupon Type** is **Standard**. |
| **Template** | **Front Side** and **Back Side** | Lists your saved templates. Only shown when **Content Type** is **Template**. |
| **Width** / **Height** | **Content** | Size the card to the template, not the other way round. |

> *The two sides are independent. You can use a template on the back and plain text on the front, or a template on both.*

## How It Behaves

- **The template renders as a real template.** Measured on a published page: the card's back side contained the template's own markup and its Elementor stylesheet, and the heading inside it displayed exactly as designed - not as escaped text.- **The reveal is unchanged.** Peel, scratch or slide as usual; what appears underneath is simply the template instead of a title and a description.- **The template is on the page from the start**, underneath the front side. It is not fetched when the card is opened.- **Editing the template updates every card that uses it**, because the card renders the saved template rather than a copy of it.

![A coupon card revealing an Elementor template on its back side.](https://theplusaddons.com/wp-content/uploads/2024/02/coupon-code-template-demo.gif)

## Limitations

- **The Standard type cannot use a template.** **Content Type** is hidden while **Coupon Type** is **Standard**. Templates are a card feature only.- **The card does not grow to fit.** A template taller than the card will overflow or be clipped. Set **Width** and **Height** to match the design.- **Only editors and administrators can pick a template.** A user without those capabilities sees an **Unauthorized Access** notice in place of the template.- **The scratch surface is a canvas drawn from your front-side content.** It is generated in the browser after the page loads, so it appears a moment late, and the front side is rendered as a flat picture - links, videos or anything interactive in it stop being interactive.

## Not verified

So you know exactly what has and has not been checked:

- **A template on the front side.** The control exists on both sides and was read from the panel; only the back side was rendered and observed.- **Templates containing widgets that need their own scripts** (carousels, countdowns, forms). One template with a heading was rendered.- **Touch devices.** The peel, scratch and slide-out gestures were driven with a mouse on a desktop viewport. The widget binds touch events too, but a real touch device was not used.- **The Style tab.** Standard **Style 1** and **Style 3** were rendered; no colour, typography, border or popup-styling control was exercised.

## Troubleshooting

### The Template dropdown is empty

There are no saved templates yet, or the ones you have are not published. Create one under **Templates > Saved Templates** first.

### Content Type is nowhere in the panel

**Coupon Type** is still **Standard**. Switch to **Peel**, **Scratch** or **Slide Out**.

### The template is cut off

Raise **Height** under **Content > Content**, or simplify the template. The card's size comes from the widget, not from the template.

### I see Unauthorized Access instead of my design

The logged-in user does not have editor or administrator capabilities. That notice is the widget's, and it goes away once the capability is granted.

## Related Docs

- [Coupon Code Widget: Settings Overview](https://theplusaddons.com/docs/coupon-code-widget-settings-overview/)- [How to Create a Scratch Coupon Card in Elementor?](https://theplusaddons.com/docs/scratch-coupon-card-in-elementor/)- [How to Create a Peel Off Discount Code Card in Elementor?](https://theplusaddons.com/docs/peel-off-discount-code-card-in-elementor/)- [How to Create a Slide Out Discount Code Card in Elementor?](https://theplusaddons.com/docs/slide-out-discount-code-card-in-elementor/)

## Frequently Asked Questions

**Q: What do I need before I can show a promo code in an Elementor template?**
A: The setup depends on three things: Elementor is installed and active, the Coupon Code widget is enabled under The Plus Addons > Widgets, and the design you want to reveal is already saved as an Elementor template. The Plus Addons for Elementor, The Plus Addons, Plus Addons for Elementor, POSIMYTH ships the Coupon Code widget only in the Pro version, so the free plugin has no fallback widget. If the template does not already exist, the Template dropdown stays empty.

**Q: Why is the Template dropdown empty in the Coupon Code widget?**
A: An empty Template dropdown usually means there are no saved templates yet, or the templates exist but are not published. The widget only lists templates that already exist under Templates > Saved Templates. That matters because the card pulls from saved Elementor templates, not from a draft layout or a one-off page section. Publishing the template first is what makes it available to the widget.

**Q: What coupon type should I use if I want to show a template instead of plain text?**
A: Use Peel, Scratch, or Slide Out. The Standard coupon type cannot use a template, and Content Type is hidden when Standard is selected. That design choice matters because templates are a card feature only, not part of the plain text version. If you want a reveal area with images, buttons, countdowns, or other built content, switch away from Standard before looking for the Template option.

**Q: Can I use different content on the front and back of the coupon card?**
A: The front and back sides are independent, so you can mix plain text and templates however you want. One side can use a template while the other stays as default text, or both sides can use templates. That flexibility is useful when you want a simple teaser on one side and a richer offer on the other. The Plus Addons for Elementor supports that split inside the Coupon Code widget.

**Q: Why does my template get cut off inside the coupon card?**
A: The card does not resize itself to fit the template. Width and Height come from the widget, not from the saved template, so a taller design will overflow or get clipped. The practical fix is to raise Height under Content > Content or simplify the template so it fits inside the card’s own dimensions. Matching the card size to the design avoids awkward cropping.

**Q: What causes Unauthorized Access instead of my design in the coupon card?**
A: That notice appears when the logged-in user does not have editor or administrator capabilities. The widget uses those permissions to decide who can pick a saved template. In practice, this means editors and administrators can select templates while lower-privilege users see Unauthorized Access instead of the rendered design. Granting the capability removes that block and lets the template display normally.