We came across the free WooCommerce Coupon Shortcodes plugin plugin recently, and it’s a super powerful free plugin. This lets you display coupon information, and even lets you conditionally display content based on whether a coupon applies, doesn’t apply, or has been applied by a customer. You can also list any or all coupon codes available.
However, it can be a bit tough to use, even with the documentation, so we’ve created a quick guide on using the different shortcodes it offers.
I recommend adding the conditional content shortcodes to your cart page above the
[woocommerce_cart] shortcode unless otherwise noted.
There are 3 coupon details shortcodes that should be used inside of the conditional content shortcodes listed below rather than alone on the cart page. These are
[coupon_code] shortcode will display the relevant coupon code, while
[coupon_description] will display the coupon description set by the admin. You can specify the coupon code that each of these should apply to if needed.
[coupon_code code="10off"] and
[coupon_description code="10off"] will show the information for the
10off coupon. You can display multiple codes by using a comma-separated list of codes, but I don’t find this particularly helpful.
You can display both the code and description by using the
prefix attribute in the
[coupon_description] shortcode. Using
[coupon_description code="10off" prefix="code"] will show: “10off description” (using whatever the description is for this code).
You can also add the
element_tag attribute to wrap this content in an HTML tag (
li work – li is best if you’re enumerating coupons as described below), and you can add the
prefix_separator attribute to add something between the prefix and description.
[coupon_description code="10off" prefix="code" prefix_separator=" - " element_tag="div"]
will display: “10off – description” wrapped in
[coupon_discount] shortcode is slightly different – this shortcode will display the discount amount or percentage the code will yield, as well as the product(s) the coupon applies to if it’s limited to particular products (only for the Product Discount types). You can optionally show the coupon code here and separators as you can with the
[coupon_discount element_tag="div" prefix="code" prefix_separator=": "]
will display: “10off: 10% Discount on Happy Ninja, Ninja Silhouette” and link to these products. If the coupon isn’t a product discount tied to specific products, then only the discount amount or percentage is displayed.
The 3 shortcodes are all probably best used within the conditional content shortcodes.
You can choose when to display messages or coupon information to customers using some of the shortcodes below. For each of these, you can use an all indicator (*) for codes rather than targeting them to a specific coupon code. This will display your content for all coupon codes, not just specific codes.
[coupon_is_valid] shortcode can be used to display content to a customer if the cart contains an item for which there is a discount. For example, if the
10off code we’ve been using only applies to the Happy Ninja or Ninja Silhouette products, the content enclosed in this shortcode will display if one of these products is in the cart. If the coupon applies to all products, this message will always be displayed.
[coupon_is_valid code="10off"] to target this coupon code, then write a message wrapped in this shortcode. We can use any of the coupon details shortcodes as part of our message, and don’t need the
code attribute since it’s already specified:
[coupon_is_valid code="10off"] We've got a discount for this product, yay! Use the coupon: [coupon_discount element_tag="div" prefix="code" prefix_separator=": "] [/coupon_is_valid]
This message will only be displayed if a coupon for which the product applies is in the cart:
If no products in the cart can use the coupon, then the message is not displayed.
[coupon_is_not_valid] will display any enclosed content if the cart does not contain an item for which the selected code is valid. This can be really handy to encourage customers to add a product for which their is a promotion to the cart by showing the available coupon and discount information.
For example, we can show the message if the the product for our coupon is not yet in the cart, and show the coupon information to encourage customers to get it.
[coupon_is_not_valid code="10off"] Did you know we have a coupon available? You haven't added the product to your cart yet, but we don't want you to pass this up! Here's what you need for the [coupon_code] coupon: [coupon_discount element_tag="div" prefix="code" prefix_separator=": "] [/coupon_is_not_valid]
This will show the message only if a product for that coupon is not present in the cart:
You don’t have to do this for coupons limited to particular products – it’s really helpful to show coupons for quantities, free shipping coupons, and more! This encourages customers to add this item for a nice little upsell.
[coupon_is_applied] shortcode can wrap content that you only want to display when a coupon has been used. This is a great way to personalize the shopping experience for your customers to thank them for using a coupon, or to include a message about the coupon.
Let’s assume that the
10off coupon was included in a blog post: we may want to thank customers for reading. We can add a message that is only displayed when this code is used.
[coupon_is_applied code="10off"] You've applied the <code>[coupon_code]</code> coupon - you must be one of our blog readers ;). Thanks for reading our posts! [/coupon_is_applied]
Our message will display once this coupon has been applied to the cart:
You can use this shortcode to display the same message for all coupon codes code if desired. You simply replace the code with an “all” indicator (*):
[coupon_is_applied code="*"] You've applied the <code>[coupon_code]</code> coupon - you must be one of our blog readers ;). Thanks for reading our posts! [/coupon_is_applied]
[coupon_discount] works well instead of the
[coupon_code] shortcode if you want to display more details.
This is a code that works really well on it’s own page, and if used right, can give your conversions a boost. When we wrote about improving eCommerce conversions, we noted that coupon fields are dangerous, and customers tend to leave your site to go coupon hunting and you run the risk of them not returning or being unhappy with their purchase.
We showed you how to hide or rename coupon fields to help reduce the risk of customers leaving to coupon-hunt, but KISSmetrics mentioned a cool trick that Macy’s uses to avoid this – they list all available coupons to keep customers on-site. You can do the same thing with the
[coupon_enumerate] shortcode – I recommend using this on a separate page on your site rather than on the cart page.
This shortcode will loop through available coupons and list them based on your criteria. Want to list every coupon? Use the
[coupon_enumerate code="*"] shortcode around whatever you’d like to display for the coupon: code, description, and/or discount info.
Let’s show all coupons, and provide the discount information with the code. I’m going to put these into a list of codes using the element_tag:
[coupon_enumerate code="*"] [coupon_discount element_tag="li" prefix="code" prefix_separator=": "] [/coupon_enumerate]
This will list every single available coupon code (including expired coupons) along with discount information for customers wherever it’s placed. However, you can also limit this to certain coupon types using the
type= attribute and any of the following:
recurring_percent. Let’s limit this display now to only percent and product percent discounts:
[coupon_enumerate code="*" type="percent, percent_product"] [coupon_discount element_tag="li" prefix="code" prefix_separator=": "] [/coupon_enumerate]
Now only percentage discounts are displayed:
Simple! This is a great way to show any available promotions to keep customers happy and in your store.
Try it out
I haven’t covered all of the possiblities for the WooCommerce Coupon Shortcodes plugin here (you could definitely see the documentation if you want to take it further), but this should get you started! You can combine these shortcodes in some pretty interesting ways, and add several conditional messages to your cart page.
Want to try WooCommerce Coupon Shortcodes yourself? You can download it for free from WordPress.org: