Do you want to create a coupon popup on your WordPress website?

Coupon popups are a great way to convert your website visitors into paying customers. There are several different ways to create and display coupon popups. However, showing the coupon at the right time makes a huge difference in converting abandoning visitors into customers.

In this article, we’ll take a look at how to add a coupon popup to your WordPress or WooCommerce site.

Why Should You Offer Visitors a Coupon?

Often new business owners are concerned that coupons will eat into their profits. However, established business owners know that offering discounts is a powerful way to get visitors to make up their minds instead of sitting on the fence.

Offering coupon codes helps you recover abandoned cart sales, convert visitors into customers, and make more sales.

Most eCommerce platforms like WooCommerce allow you to easily create coupon codes. However, sharing these coupon codes with your customers makes all the difference.

That’s why in this article, we will share two different ways to share coupons with your visitors. These include a coupon exit popup and a coupon spin-a-wheel optin.

Let’s take a look at how to create a coupon popup in WordPress or WooCommerce.

How to Create Your Coupon Popup in WordPress

The best way to create a coupon popup is by using OptinMonster. It is the best WordPress popup plugin and lead generation software in the market.

First, you need to visit the OptinMonster website to create an account. Simply click the ‘Get OptinMonster Now’ button to get started.

You will need at least the Growth plan because it includes Coupon Wheel Campaigns and advanced targeting rules for your popups.

After that, you need to install and activate the OptinMonster plugin on your WordPress site. For more details, see our step-by-step guide on how to install a WordPress plugin.

The plugin acts as a connector between your OptinMonster account and your WordPress website.

Upon activating the plugin, you’ll see the OptinMonster setup wizard. Go ahead and click on the ‘Connect Your Existing Account’ button.

A new window will now open where you’ll need to connect your WordPress site with OptinMonster.

Simply click the ‘Connect to WordPress’ button to continue.

You can also connect your WooCommerce store with OptinMonster. Just make sure that you’ve set up an eCommerce store in WordPress.

First, you will need to go to OptinMonster » Settings from your WordPress admin panel.

Afterward, head to the ‘General’ tab and click on the ‘Auto-Generate Keys + Connect WooCommerce’ button.

WooCommerce will now generate keys automatically and connect to your OptinMonster account.

Now, you are all set to create your first coupon popup campaign.

Creating Your Coupon Popup Campaign

To create a campaign, you can go to OptinMonster » Campaigns from your WordPress dashboard and then click the ‘Create Your First Campaign’ button.

On the next screen, OptinMonster will show different campaign types and templates.

First, you’ll need to choose a campaign type. We’re going to use ‘Popup,’ which should be the default selection.

After that, you will be asked to select a template.

OptinMonster has a vast range of templates you can choose from, with lots of different layouts and color schemes. The ‘Coupon’ template is perfect for creating this popup. Although, you can select a different template if you prefer.

You can use the search box to find the Coupon template or scroll down the page.

Next, hover over the template and click the ‘Use Template’ button.

The final step before building your coupon popup is to name the campaign. After entering a name, click the ‘Start Building’ button.

Designing your Coupon Popup

Once you’ve clicked ‘Start Building,’ you’ll see the drag-and-drop campaign builder.

You can use it to add different blocks to your template and change the text, colors, and design of the coupon in whatever way you like.

You can also click on any element of the design to change it further. Here, we’ve edited the text and made it a different color.

As soon as you make your changes, you’ll see real-time updates in the coupon popup template.

You might want to experiment with different fonts and colors to make your text stands out in the popup or matches your brand.

Outside of the text and elements within the popup, you can also change the background color, add an image to your coupon, set the border color, change the border style, and more.

Once you’re done with the changes, please ensure you store your campaign by clicking the green ‘Save’ button at the top of the screen.

Decide How to Deliver Your Coupon Code

Now that you’ve set up your coupon popup, you need to decide how you’ll actually deliver the coupon code to your visitor.

There are several ways to do this in OptinMonster, but the best way is to deliver the coupon code straight away through OptinMonster’s Success view and send it by email newsletter.

That way, if the visitor isn’t ready to buy immediately, they’ve got the coupon code in their email inbox for easy reference later.

By default, your coupon popup is already designed to use ‘the Success view’ as soon as the button is clicked. To check, you can click on the button and then see the ‘Go to View’ option on the left-hand side of your screen.

If you want a different button action, you can change that here. For your first coupon, though, we recommend sticking with the default.

Integrating OptinMonster With Your Email List

To send your coupon code out by email automatically and for the visitor to be added to your email list, you’ll need to integrate OptinMonster with an email marketing service.

Constant Contact is a great service to use with OptinMonster, and WPBeginner readers can get 20% off their first 3 months by using this coupon.

However, if you use a different email service, OptinMonster integrates with pretty much every major provider.

Simply go to the ‘Integration’ tab and click the ‘+ Add New Integration’ button to add your email marketing service.

Once you’ve done that, you can set up an automated email to go out whenever someone signs up for the email list through your coupon popup.

Bonus Tip: Edit the Success View Template

You can view and change the ‘Success View’ template by going back to the Design tab of your campaign and clicking the ‘Sucess’ option at the bottom of the screen.

The default looks like this, but you can edit it in any way you want, just like you edited your coupon popup.

Change Your Coupon Popup’s Display Rules

By default, your coupon popup will appear to visitors after they’ve been on any page of your site for 5 seconds.

If you want to change this, go to the ‘Display Rules’ tab.

You can set whatever display rules you like, but a great one to try out is Exit-Intent®.

This special OptinMonster technology can tell when a visitor is about to leave your site and show them your coupon popup at just the right moment.

You can add exit intent by selecting the ‘exit detected’ from the dropdown menu and choosing which devices to show the campaign on. By default, it will be set to display on all devices.

There is also an option to control the sensitivity of exit intent.

After that, scroll down and choose the pages where you’d like to show your campaign.

For example, you can use the default setting of ‘current URL path’ and select the ‘is any page’ option. This way, your campaign will appear on your entire website.

After adding the display rules, you can click the ‘Next Step’ button.

OptinMonster also offers options to play a sound effect and show animation when the coupon popup appears.

Now, you can click the ‘Next Step’ button.

On the next screen, you will see a summary of your display rules. Don’t forget to click the ‘Save’ button to store your settings.

Once you’re happy with your coupon popup, you can go to the ‘Publish’ tab at the top.

After that, simply make sure that ‘Publish’ is checked under the ‘Publish Status’ section.

Don’t forget to click the ‘Save’ button at the top and close the campaign builder.

You can now visit your website to see the coupon popup in action.

Creating a Spin-to-Win Coupon Wheel

A spin-to-win coupon wheel is a great way to make your coupons more interesting and fun for your site’s visitors. It’s like a mini-game that visitors can play to win a discount or another bonus.

Your spin-to-win options could include things like 10% off, 20% off, free shipping, a free trial, or whatever you want to offer.

OptinMonster offers a ‘Gamified’ campaign type that lets you create spin-the-wheel popups.

After that, scroll down and select one of the Wheel templates.

The plugin has different spin-to-win templates. Simply hover over a template and click the ‘Use Template’ button.

Next, go ahead and edit any aspect of your coupon wheel.

To edit the options on the coupon wheel itself, you’ll need to click on the ‘Customize Wheel Sections’ button on the left-hand side.

You can then type in any text as the Label for each option and add in the coupon code for each winning option.

Note that the ‘Win Chance’ is automatically determined. If you change the toggle on one or more of the ‘Can Win’ options, OpinMonster will recalculate the winning chances

If you need more help creating your coupon wheel and adding it to your site, check out our post on how to add spin-to-win optins in WordPress and WooCommerce, which goes through the process in more detail.

You can then visit your website to see the spin-to-win coupon popup in action.

We hope this article helped you learn how to create a coupon popup in WordPress. You might also want to look at our pick of the best WooCommerce plugins or our guide on how to add push notifications to your WordPress site.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

The post How to Create a Coupon Popup in WordPress (Step by Step) first appeared on WPBeginner.

WordPress 6.1 Beta arrived a few days ago, and it is expected to be released on November 1st, 2022. It will be the last major release of 2022 and will come with many new features and improvements.

We have been closely monitoring the development and trying out new features on our test sites.

In this article, we’ll give you a sneak peek into what’s coming in WordPress 6.1 with features and screenshots.

Note: You can try out the beta version on your computer or on a staging environment by using the WordPress Beta Tester plugin. Please keep in mind that some of the features in beta may not make it into the final release.

New Default Theme:  Twenty Twenty-Three

As per the WordPress tradition, the last release of the year will ship with a new default theme called Twenty Twenty-Three.

Featuring a minimalist style, Twenty Twenty-Three is a block theme with full site editing capabilities.

It will come with ten style variations that users can choose inside the Site Editor.

It will also ship with four fonts that are used in different styles. You can also select these fonts when writing posts and pages.

Overall, Twenty Twenty-Three provides a beautiful canvas to create a website using the design tools available in the site editor.

Block Editor Improvements

WordPress users spend most of their time creating posts and pages for their websites using the block editor.

Each WordPress release comes with a ton of improvements to the editor. WordPress 6.1 will include changes introduced in the Gutenberg (code name for the block editor project) releases from 13.1 to 14.1.

The major focus during these Gutenberg releases was to bring consistency to the availability of design tools for different blocks.

Following are some of the more noticeable changes in the block editor

Dimensions in More Blocks

WordPresss 6.1 will bring dimensions to more blocks like Paragraph, List, Columns, Table, and more.

This will allow users to set padding and margin for more blocks and have a much finer control over the design and layout.

It will also help users visualize the changes when adjusting padding and margins for a block.

Improved Border Options

With WordPress 6.1, users can add borders to more blocks. They will also be able to adjust the top, right, bottom, and left borders separately.

The image block, which previously only allowed you to select border radius, will now also allow you to add actual borders.

Featured Image in Cover Block

Our users often ask about the difference between featured image and cover block in WordPress. Many users wanted to use the cover block as featured image for their site.

WordPress 6.1 will allow users to select their featured image for a cover block. Users can then just set the featured image and it will start appearing inside the cover.

Using cover will allow users to display featured images anywhere they want.

Note: Depending on your theme, if this option is not used correctly, then your featured image may appear twice on the screen.

Quote and List Blocks with Inner Blocks

Ever wanted to move an item up or down in a bulleted list without actually editing it?

WordPress 6.1 will introduce inner blocks for List and Quote blocks.

For instance, items in a list block will be their own blocks. This would allow you to simply move them up and down without editing.

Similarly, when using the Quote block, users can style quote and cite blocks differently.

Improved Navigation Block

WordPress 6.1 comes with an improved navigation block that allows you to easily create and select a menu from the block settings.

Users will also be able to use design tools for submenus and style them differently than the parent menu item.

Editor Design Enhancements

WordPress 6.1 will also come with several changes to the Editor screen design. These changes will improve the user experience on the block editor screen.

Following are some of those enhancements:

Preview Button is Now Labeled View

The Preview button is now called View.

In Site Editor, the View button now also includes a link to simply view your website in a new tab.

Status & Visibility Panel is now Called Summary

The status and visibility panel under the Post settings will be renamed Summary.

Permalink and Template Options Under Summary Panel

Permalink and Template options has their own panels under Post settings. With WordPress 6.1 these panels are merged under the Summary panel.

Just click to expand the Summary panel, and you’ll find the option to change ‘URL’ (permalink) and choose template.

Improved Information Panel

In WordPress 6.1, the information popover will also display the time to read information.

Site Icon will Replace the WordPress Logo

If you have set the site icon for your website, then it will be used as the View Posts button in the top left corner of the screen.

New Preferences Options

The preferences panel now includes two new options.

First, there is ‘Always open list view’ which allows you to display list view when editing posts.

The second new option is to ‘Show button text labels’, which shows text instead of icons on buttons.

Create More Templates in Site Editor

In the classic WordPress themes, users could create templates using template hierarchy and extend their WordPress theme by writing code.

With WordPress 6.1, users will be able to do the same using the block editor and without writing code.

The upcoming release will unlock the following templates regardless of which block theme you are using.

Single pageSingle post Indivdual term in a taxonomyIndividual category Custom template (can be used for any post or page)

Simply go to Appearance » Editor and then select templates from the left sidebar. After that click on the Add New button to see the available options.

If you choose a template that can be applied to an individual item, then you will see a popup.

From here, you can choose the item where you want the new template to be used.

For instance, if you choose the Category template, then you’ll see a popup.

Now you can select if you want to apply your new template for all categories or a specific category.

Quickly Search and Use Template Parts

WordPress 6.1 will also make it easier to quickly search and use template parts.

For instance, if your theme has multiple header template parts, then you can quickly find and apply one of them.

Simply select click on the template part options and select Replace.

This will bring up a modal popup where you can look for available template parts that you can use.

Under The Hood Improvements

Classic themes can now use template parts (Details)Fluid typography allows theme developers to dynamically adjust font sizes. (Details)Post types can now have their own starter patterns (Details). Filters to hook into theme.json data (Details)

Overall, WordPress 6.1 beta contains more than 350 enhancements and 350 bug fixes for the block editor, this also includes 250+ tickets for the core.

We hope this article provided you a glimpse of what’s coming in WordPress 6.1.

Comment below to let us know what features you find interesting and what you’d look to see in a future WordPress release!

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

The post What’s Coming in WordPress 6.1 (Features and Screenshots) first appeared on WPBeginner.

Have you ever wanted to reduce the number of WordPress plugins you’re using on your website?

Wouldn’t it be nice if there was an easy way that allowed you to add future-proof WordPress customizations through code snippets WITHOUT breaking your website?

If you’re like me and most other smart website owners, then you have at least wished for this solution a couple times in your WordPress journey.

Today, I’m excited to share the launch of my free WPCode plugin which will transform the way you think about WordPress customization.

We built this tool to help you save time and hassle when managing your website customizations. This is like the ultimate Swiss-Army knife tool that will help you replace dozens of existing WordPress plugins while making your website faster.

Background Story

In 2012, I created a free plugin called Insert Headers and Footers.

The goal of this plugin was to make it easy for me and other WPBeginner readers to add code to our WordPress site’s header and footer area without editing theme files!

This would include things like Google Analytics script, custom CSS code, Facebook Pixel, AdSense code, and more.

Over the last decade, this simple plugin grew to over 1 million active installs.

In the same time period, WordPress grew a lot too with tons of new features and plugins.

Every month, I would get requests from our users to add more functionality such as the ability to conditionally load scripts on certain pages, ability to add code snippets in other areas of the website, and so on.

After a lot of thought and consideration, we have decided to expand this free plugin and make it a full-featured code snippet management solution for WordPress with conditional logic, auto-insertion, and much more.

Using the new plugin you can:

Add tracking scripts / various webmaster tool verification meta details in your site with just a few clicks.Add banner ads or other dynamic content elements after first paragraph of every blog post, at the end of each blog post, etc.Remove WordPress features that you don’t want such as REST API, XML-RPC, Comments, etc.Easily copy & paste code snippets from tutorials in your WordPress site without errors.And really this is just scratching the surface.

All of these features are available to you for free!

If you’re a marketer, think of WPCode like a Google Tag Manager but inside WordPress.

If you’re a regular business owner, think of this as a swiss-army knife for your website. It will help you do what you want to do – nothing more, nothing less.

WPCode is by far the MOST POWERFUL plugin you’ll install on your WordPress site, and I’m not exaggerating.

Just give me 5 minutes of your attention, and I’ll show you — keep on reading.

Video Version

What is WPCode?

WPCode is a powerful WordPress code snippet plugin that makes it easy for you to add custom WordPress features using code snippets without editing your theme’s functions.php file.

It comes with a built-in code snippets library where you can find some of my most popular WordPress code snippets that will help you eliminate the need of separate plugins.

For example, there are ready-made snippets that will help you:

Disable XML-RPC – this is good for WordPress securityAllow SVG File Upload – eliminates the need for separate pluginDisable Gutenberg – eliminates the need for separate pluginDisable Comments – eliminates the need for separate pluginAdd Tracking Scripts for Google Analytics, Facebook, AdSense, and other platforms

And there are currently over two dozen other code snippets that you can use to add custom functionality while reducing the number of plugins on your site.

For an average website owner, this plugin will help you reduce at least 6 – 8 other plugins that you might be using right now with just the ready-made snippets that are there.

My plan is to continue to add more custom code snippets there to cover popular use-cases. If you have suggestions, please let us know by filling out the form here.

If you’re a WordPress developer / freelancer that wants to contribute code snippets, please send us your snippet using the form above.

Future-Proof Site Customization & Code Management

Most WordPress customization tutorials will ask you to add code snippets to your theme’s functions.php file. This old way simply makes managing code snippets messy, and it also prevents you from updating your theme.

If you ever update your theme or switch to another theme, then you will lose all custom code functions that you added in your functions.php file.

WPCode solves this by providing you an easy way to insert header and footer scripts along with other code snippets directly from your WordPress dashboard. These code snippets actually run as if they were in your theme’s functions.php file, but we make your customizations future-proof.

You can safely update themes or switch to another theme without ever losing your important website customizations.

Another problem with adding custom code snippets on your theme’s functions.php file was that even the smallest mistake can break your website and make it inaccessible.

So we created our smart code snippet validation. This helps you prevent common code errors to ensures you never break your website when adding code snippets or header and footer scripts.

You can manage all your header and footer scripts as well as other custom code snippets from a single screen. We even make it easy for you to organize code snippets using Tags and add reminder notes with each code snippet.

Built-in WordPress Code Generators

Aside from our growing code snippets library, we also have WordPress code generators to help you quickly get ready-to-use custom code using the latest WordPress coding standards and API’s.

Examples of Custom Code Generators with Admin UI include:

Custom Post Type Generator – Create custom code snippet for Post Types.Custom Taxonomy Generator – Get custom code snippet for Taxonomies.WP Query Generator – Get custom code snippet for WP_Query to load posts.Custom Sidebar Generator – Create custom code snippet to register custom sidebars or widget-ready areas.Custom Widget Generator – Custom code snippet to register custom widgets.Navigation Menu Generator – Custom code snippet for registering new navigation menu locations in your theme.

Aside from the above, we also have code snippet generator for scheduling a cron job, registering scripts & stylesheets, adding custom post status, and more.

In the past, beginners and intermediate users would use WordPress plugins to create custom post types, taxonomies, etc with an admin UI. The problem is that those are one-time use plugins that in the background are just generating custom code snippets.

Now with WPCode free generators, you can cut out those plugins while still adding the custom functionality that you want with an admin UI.

This will be a huge time-saver for new WordPress developers and web professionals who’re building websites for clients.

Conditional Logic for Code Snippets + Auto Insertion Priority

My goal with WPCode was to create a WordPress code snippets plugin that’s both EASY and POWERFUL.

That’s why aside from our global header and footer scripts, we added advanced features like conditional logic for code snippets and made it easy.

Instead of learning WordPress conditional logic queries, you can use visual conditional logic to decide when a certain snippet would load.

Examples use-cases of WPCode conditional logic:

Load code snippets for logged in users onlyLoad PHP code snippets for specific user rolesLoad PHP code snippets only on specific page URLsInsert header and footer pixel scripts on specific pagesShow code snippets based on type of pageRun code snippet only on certain post typesLoad header and footer code snippet based on referrer sourceand more…

We also added both automatic code insertion and manual output using shortcodes. This way you can add features using a custom shortcode, or simply automatically add certain features on area that you want.

Our Auto Insert feature allows you to run the code snippet everywhere or choose from custom options like:

Run code snippet only on frontendRun code snippet only in WordPress admin areaAdd header and footer scripts sitewideInsert PHP code snippet before or after post contentInsert code snippet before or after specific paragraphInsert code snippet on specific archive pages

Aside from that, we also added a visual code snippet priority system, so you can choose the order for your custom functions to avoid code conflict.

What are Some Example Use Cases + Plugins You Can Replace?

WPCode is the one plugin that helps you get rid of dozens of other plugins without losing functionality.

Here are some of the top use-cases :

Insert Headers and Footers scriptsInsert Google Analytics Tracking Code in Header and FooterInsert PHP Code Snippets or JavaScript code snippet without modifying theme’s functions.php fileInsert Facebook Pixels code, Google Conversion Pixels code, and other Advertising Conversion Pixel Scripts in WordPress header and footer with conditional logicInsert Google AdSense Ads code, Amazon Native Contextual Ads code, and other Media Ads codeInsert Custom JavaScript, CSS, and HTML codeInsert Site Verification Meta tags for Social Media, Google Search Console, and other Domain verification in the header and footer of your siteInsert re-usable custom content blocksInsert Ads code in content after specific paragraphsShow or hide custom code snippets based on conditional logicDisable XML-RPC, Disable Rest API, disable comments, allow SVG file uploads, disable Gutenberg and enable Classic Editor without adding extra plugins

Just with our current features and ready-made code snippets library, you can replace several popular plugins including:

WPCode comes with a ready-made code snippets library that allows you to replace several popular plugins including:

Disable Comment pluginsDisable XML-RPC pluginsDisable Rest API pluginsDisable Gutenberg pluginsClassic Editor pluginAllow SVG File Upload pluginsDisable RSS feed pluginsDisable Search pluginsDisable Automatic Updates pluginsDisable Admin Bar pluginsDisable Widget Blocks pluginClassic Widgets pluginRemove WordPress Version Number pluginsFacebook Pixel pluginsGoogle AdSense pluginsCustom Post Types UI pluginsOther WordPress Generator plugins

On average, I believe you can easily replace 6 – 8 existing plugins on your website because a typical website often installs these one-off feature plugins.

Now you can remove those plugins, clean up your admin area, and simplify your website management.

What’s Coming Next in WPCode?

Since the Insert Headers and Footers plugin had over 1 million users, getting all these new features for free was a surprise for everyone.

I’m extremely pleased with the community response so far, as everyone is loving the new features.

We have an exciting roadmap ahead of us to make this plugin even more powerful. Some of the things that we’re working on:

A larger list of Code Snippet library that is vetted by our WordPress expertsSave custom snippets to cloud – this will be great for those creating & managing multiple websites as you can build your personalized snippet library inside the pluginand much more…

We’re truly building something special here. If you have ideas on how we can make the plugin more helpful to you, please send us your suggestions.

As always, I want to thank you for your continued support of WPBeginner, and we look forward to continue serving you for years to come.

Yours Truly,

Syed Balkhi
Founder of WPBeginner

P.S. Want us to acquire or invest in your WordPress business? Learn more about the WPBeginner Growth Fund.

The post Introducing WPCode – Easy WordPress Code Manager to Future-Proof Your Website Customizations first appeared on WPBeginner.