Do you wish to have so as to add a full-screen welcome mat on your web page?

A welcome mat is a full-screen, dynamic overlay that let you get extra e-newsletter subscribers, eBook downloads, gross sales on your merchandise, and extra.

On this article, we’ll percentage the best way to create a welcome mat to your WordPress web page, along side some nice welcome mat examples to be informed from.

How to create a welcome mat for your WordPress

Why a Welcome Mat Can Spice up Your Conversions

Greater than 70% of tourists leaving your WordPress web page won’t ever go back except you change them into electronic mail subscribers or consumers.

A welcome mat is a huge, full-screen interstitial that blocks the view of the remainder of your web page’s content material to seize the person’s consideration.

That may sound like a nasty concept, however it’s an effective way to get your message in entrance of tourists instantly.

If guests don’t need what you’re providing, then they are able to merely shut the welcome mat.

In fact, you’ll need to give folks a excellent reason why to enroll should you’re appearing a welcome mat as an alternative of an exit-intent popup, comparable to a cut price code or perhaps a freebie.

For instance, you’ll have observed widespread eCommerce retail outlets be offering a distinct cut price the use of a full-screen welcome mat with gamification.

Gamified Spin a Wheel Campaign

In different circumstances, you’ll have observed widespread bloggers the use of a full-screen welcome mat to develop their electronic mail e-newsletter.

Goins writer welcome screen mat

That being stated, let’s check out the best way to simply upload a welcome mat on your web page.

Easy methods to Create a Welcome Mat for Your Web page

One of the best ways of constructing a welcome mat in WordPress is the use of OptinMonster. It’s the perfect lead era instrument on the earth and lets you simply create optin bureaucracy, together with welcome mats.

First, you’ll wish to consult with the OptinMonster web page and signup for an account. You’re going to want a minimum of the Elementary plan to create fullscreen overlays.


Subsequent, you’ll wish to set up and turn on the OptinMonster WordPress plugin. For extra main points, see our step by step information on the best way to set up a WordPress plugin.

The plugin connects the OptinMonster app on your web page. If you’ve activated the plugin, you’ll see the setup wizard for your WordPress dashboard. Pass forward and click on the ‘Attach Your Current Account’ button.

Connecting an OptinMonster account to WordPress

Subsequent, a brand new window will open.

Merely click on the ‘Hook up with WordPress’ button.

Connect OptinMonster to WordPress

Now, you’re waiting to create your welcome mat.

Making a Welcome Mat for Your Web page

You’ll head to OptinMonster » Campaigns to create a brand new marketing campaign.

Pass forward and click on the ‘Create Your First Marketing campaign’ button to start out developing your welcome mat.

Create first OptinMonster campaign

A brand new window will now pop up the place you’ll make a selection pre-built templates or make a choice ready-to-use campaigns and lead magnets, impressed via a success manufacturers. OptinMonster additionally will give you the method to rent a expert to customise your campaigns.

For this educational, we will be able to use the ‘Templates’ choice.

Choose a template or playbook

This may occasionally take you to the OptinMonster marketing campaign builder.

Subsequent, make a choice ‘Fullscreen’ to your marketing campaign sort.

Select fullscreen template and campaign

You’ll want to make a choice a template to your marketing campaign. We can use the ‘Front’ template, however you’ll select a distinct one if you wish to have.

If you’ve decided on a template, pass forward and input a reputation to your marketing campaign and click on the ‘Get started Development’ button.

Click start building

Subsequent, you’ll customise your marketing campaign the use of the drag-and-drop builder. You’ll alternate anything else you prefer right here.

There are other blocks that may be added to the marketing campaign, like photographs, textual content, buttons, and extra. You’ll additionally need to edit the textual content to correspond on your be offering.

Customize your fullscreen campaign

Merely click on on any component, and also you’ll see that you’ll edit it within the left-hand pane.

As an example, we will be able to alternate the headline of the full-screen welcome mat for our demo marketing campaign.

Edit the text of welcome mat

The next move is to let your welcome mat slide in. You’ll do that via clicking the Settings tools icon at the backside left-hand facet.

From right here, you wish to have to toggle the ‘Show a Web page Slide?’ method to permit it.

Display a page slide

This implies your welcome mat will slide down from the highest of the display as an alternative of fading into view.

Subsequent, you wish to have to modify to the ‘Good fortune’ view of your welcome mat. That is what your customers will see once they carry out the specified motion. If you wish to have, you’ll customise the luck view or use the default template.

View the success view of welcome screen mat

If you’re glad along with your welcome mat, you’ll arrange how it’s going to show in your web page.

Showing the Welcome Mat on Your WordPress Web site

You’ll set the best way to show your welcome mat popup via switching to the ‘Show Laws’ tab in OptinMonster.

There are many personalization and focused on choices like customers’ location, what pieces they have got of their eCommerce cart, what they have got performed prior to now in your web page, go out intent, and extra.

Via default, OptinMonster campaigns show on all pages of your web page after the customer has been there for five seconds.

Select display rules

Since it is a welcome mat, you’ll most definitely need it to show right away. Simply alternate this worth to 0 seconds.

Via default, the welcome mat will show on each and every web page of your web page. You’ll simply come with or exclude particular pages via the use of OptinMonster’s personalization laws.

Choose display rules for welcome mat

You’ll click on the ‘Subsequent Step’ button while you’re performed.

Subsequent, you’ll see extra choices for showing your marketing campaign. As an example, you’ll upload an impact or play a legitimate when the marketing campaign seems on a person’s display.

For this educational, we’ll use the default settings and click on the ‘Subsequent Step’ button.

Add effects to campaign

At the subsequent display, you’ll see a abstract of your show laws settings.

You’ll edit the settings sooner than publishing the marketing campaign.

Summary of display rules

As soon as you are prepared to make your welcome mat reside, merely pass to the ‘Put up’ tab on the most sensible of the display.

Pass forward and alter the Put up Standing from ‘Draft’ to ‘Put up.’

Publish welcome screen campaign

Don’t fail to remember to click on ‘Save’ to retailer your adjustments and shut the marketing campaign builder.

Subsequent, you’ll see WordPress Output Settings to your marketing campaign. Be sure that your marketing campaign is revealed.

If it isn’t, then merely click on the Standing dropdown menu and make a selection the ‘Printed’ choice. Don’t fail to remember to click on the ‘Save Adjustments’ button while you’re performed.

Change the status of welcome mat campaign

To try your marketing campaign, you’ll consult with your web page in a brand new incognito browser window.

You will have to see your welcome mat slide in seamlessly from the highest of your display.

Fullscreen welcome mat preview

Examples of Nice Welcome Mats

Let’s check out some welcome mat examples from other industries. For every, we’ll undergo what they’re doing smartly, plus any minor adjustments we may recommend.

1. Singularity

This welcome mat from Singularity precipitated customers to enroll and watch the livestream of the Singularity College International Summit. It was once massively a success and captured over 2,000 new electronic mail signups in underneath 9 days.

Singularity fullscreen mat preview

We specifically like the good use of the brand, the transparent fonts, and the brilliant “Remind Me!” button.

2. Goins, Creator

This welcome mat from Goins, Creator provides a loose information. It’s a transparent, easy be offering, and the minimalist design is consistent with the remainder of the web page.

Goins writer welcome screen mat

We really feel that the “Sure” and “No Thank you” buttons are transparent and simple to make use of, and using numbers within the headline makes for a compelling be offering.

3. AVweb

This welcome mat has a big, transparent symbol of a small plane. It’s right away crowd pleasing.

Welcome mat example AVweb

We love the good symbol, and the transparent “Signal Me Up!” name to motion. One small conceivable tweak could be to shorten the tagline to steer clear of having it duvet the highest of the picture.

4. Loaded Landscapes

This welcome mat from Loaded Landscapes is a bit other from different examples. The background is reasonably clear.

Loaded landscape

We love the transparent be offering and the keenness of the purple name to motion button. The background of the web page underneath the welcome mat generally is a little distracting, so it could be value converting it to be totally opaque, alternatively.

5. OptimizeMyBnb

This welcome mat was once used on a particular web page, which was once incorporated as a clickable hyperlink inside of a e book the web page proprietor bought thru third-party shops. Those shops didn’t go on consumers’ main points, even though. The use of a welcome mat on this approach helped seize consumers’ electronic mail addresses.

Optimize your Airbnb thank you

We really feel the very transparent headline, subheading, and call-to-action textual content all labored smartly, and that the ‘no, thank you’ button is used smartly to present the person sense of FOMO.

There are dozens extra full-screen welcome mat examples that you’ll see, however we didn’t upload all of them on this information.

When you’re on the lookout for extra inspiration, right here are a few things you’ll do with a fullscreen welcome mat:

  • Provide a centered be offering or coupon
  • Show off new services
  • Let guests know what to anticipate from the web page
  • Win new subscribers via highlighting their perfect content material
  • Level guests to their social media profiles
  • Accumulate electronic mail subscribers as a part of a prelaunch section

When you’re fascinated with bettering your web page conversions, then welcome mat or even go out fullscreen interstitials are one of the easiest changing parts you’ll upload on your web page.

We are hoping this text helped you discover ways to create a welcome mat to your web page and that you simply discovered the examples inspiring. You may additionally need to check out our comparability of the perfect electronic mail advertising services and products, and our record of the must-have WordPress plugins.

When you favored this text, then please subscribe to our YouTube Channel for WordPress video tutorials. You’ll additionally to find us on Twitter and Fb.

The submit Easy methods to Create a Welcome Mat for Your WordPress Web site (+ Examples) first seemed on WPBeginner.

WordPress Maintenance

[ continue ]