How to Use MonsterLinks™ to Load Your Popup with the Click of a Button

Do you want to trigger a pop up campaign with the click of button? It’s easy with our MonsterLinks! Follow this guide to set up a MonsterLink and load a campaign of your choice with the click of a button.

NOTE: This guide will show you how to effectively use the Display Rule: visitor clicked MonsterLink.
REQUIREMENTS: MonsterLinks require a Standard Subscription.

What are Monster Links

MonsterLink is a link on your site that loads a pop-up campaign instead of sending the user to a new page.

You can use MonsterLinks to create a better viewing experience for your users by using a Call to Action button that prompts them to trigger the campaign instead of triggering a pop-up automatically and potentially interrupting their browsing experience. You can also use MonsterLinks to show campaigns on mobile devices in a non-intrusive way.

How to Create a MonsterLink

Step 1 – Set Display Rule

Select the Display Rules tab in the campaign builder.

Display Rules Tab

In the Display Rules Conditions panel set one condition for visitor clicked MonsterLink.

Choose MonsterLink Rule

Step 2 – WordPress Settings (WordPress Plugin Users Only)

If you are using the WordPress OptinMonster API plugin, you will need to update your WordPress output settings to make sure your MonsterLink campaign loads everywhere.

  1. Go to your WordPress Dashboard > OptinMonster Menu > Output Settings (for your specific campaign).
  2. Enable your campaign. In the Campaigns tab this means your campaign will appear with the status Live instead of Disabled.
  3. Ensure all Advanced Output Settings are Disabled – This will ensure the MonsterLink™ Campaign Embed code is loaded globally so that you can add a MonsterLink™ anywhere and it will work.
NOTE: See our page targeting documentation for a walk-through of the output settings.
Did you know?: With OptinMonster’s Plugin, you can use our Advanced Targeting Rules to target WordPress Categories, Tags, and more. Learn how our WordPress Plugin and Display Rules work together.
Step 3 – Add MonsterLink Code to Site
IMPORTANT: Before the MonsterLink campaign can work properly, the campaign must have its embed code loaded on the page(s) where your link will be placed so that your MonsterLink actually has something to load. Otherwise, the campaign will load as a separate webpage. If you are not using the OptinMonster plugin, and have not already added the embed code to your site, see our documentation on how to embed your campaigns on your site.

To get your actual MonsterLinks™ on your page, you will need the campaign’s MonsterLink URL. To get this, go to the Publish tab.

Click Publish

Under Platform, click Shareable MonsterLink.

Click Shareable MonsterLink

You can copy just the URL or you can copy the HTML version of the link.

Copy URL

Next, you can paste your link somewhere on your site. If you are using an editor, you may only need the URL. If you are using the HTML code, it will look something like the following (although your slug on the end will be different).

<a href="https://app.monstercampaigns.com/c/aclizd4ba0gfjv9u1hhu/" target="_blank">Subscribe Now!</a>

Examples

NOTE: These are examples. For your campaign, you must change the slug on the end of the URL to your own campaign’s specific slug. If you only copy and paste the code below but neglect to update the campaign’s slug attribute, then it will not work.
Default Text Link

This text MonsterLink is an example of adding the MonsterLink as text on your page and uses the default MonsterLink code. In WordPress, this is done by editing in the Text Editor NOT the Visual Editor for a page/post.

<a href="https://app.monstercampaigns.com/c/aclizd4ba0gfjv9u1hhu/" target="_blank">Subscribe Now!</a>
Button MonsterLink

Very similar implementation to the text link, but this time you use it to make a button. Your default button design depends on your CSS on your site.

<a href="https://app.monstercampaigns.com/c/aclizd4ba0gfjv9u1hhu/" target="_blank" class="button">Subscribe Now!</a>
NOTE: You may need to replace the class “button” with your own theme-specific class. Some themes use button as a class while others use alternative naming conventions. Refer to your theme’s documentation for information about button classes.
Image MonsterLink

This option, once more, is very similar to the text implementation. Only this time, the a tags are wrapping around an image you have instead of text like “Click Me”. This allows you to create an advertisement of sorts that is clickable and will load your campaign.

<a href="https://app.monstercampaigns.com/c/aclizd4ba0gfjv9u1hhu/" target="_blank"><img src="http://www.example.com/image.jpg" alt="Call to action text in case your image doesn't load." height="" width=""></a>

Frequently Asked Questions

Q: Can I split-test a MonsterLink?

A: Yes, you can Split-Test a MonsterLink. In these situations, the split-tested version will show up using the primary campaign’s slug in the MonsterLink. You do not need 2 links.


A: You can achieve a functionality like this via Media Queries. You can do this by adding two MonsterLinks, one that is set to load the Lightbox campaign and the second to load your Mobile campaign. Each MonsterLink should have one additional class added to them so they might look like:

<a href="https://app.monstercampaigns.com/c/aclizd4ba0gfjv9u1hhu/" target="_blank" class="desktop-monsterlink">Subscribe Now!</a>
<a href="https://app.monstercampaigns.com/c/aclizd4ba0gfjv9u1hhu/" target="_blank" class="mobile-monsterlink">Subscribe Now!</a>

In this example I used the classes desktop-monsterlink and mobile-monsterlink to indicate which MonsterLink should be available for a user to select from various devices.

Then, a little bit of CSS added directly to your site (usually in your style.css file) will allow you to control which MonsterLink is visible to be clicked on based on the browser size:

/* Show 'desktop-monsterlink' and hide 'mobile-monsterlink' */
@media screen and (min-width: 751px) {
   .desktop-monsterlink { display: block; }
   .mobile-monsterlink { display: none; }
}
/* Show 'mobile-monsterlink' and hide 'desktop-monsterlink' */
@media screen and (max-width: 750px) {
   .desktop-monsterlink { display: none; }
   .mobile-monsterlink { display: block; }
}

Q: Do I need to use both the WordPress Plugin and the Display Rules?

A: Learn how our WordPress Plugin and Display Rules work together.


Q: Can all Campaign Types be Made into a MonsterLink?

A: No. Pretty much any campaign type that “pops up” on screen at some point can be made into a MonsterLink. However, all static Campaign Types cannot be made into a MonsterLink. Therefore you cannot make a MonsterLink out of the following Campaign Types.

  • After Post / Inline
  • Sidebar

All remaining campaign types can use the MonsterLink functionality.


Q: Can I create a landing page where people can signup for my Campaign?

A: You can do that using our Shareable MonsterLink feature. It is a standalone page located on our server that serves as an independent URL that you can share through email, Facebook, or other social media, which allows your subscriber to see a specific OptinMonster campaign.

Check out how to Create a Shareable MonsterLink here.