How to Add A Close Link or Button to OptinMonster

OptinMonster is highly customizable, including the ability to add a close link or button. Using the class om-trigger-close in the link or button will set a cookie for your Campaign as you’ve specified in the Setup panel of the Campaign Builder, and close the campaign.

• Text Close Link
• Button Style Close Link
• Adding The Link to Your Campaign
• Templated Campaigns
• Canvas Campaigns

Text Close Link

To create a simple text link to close the campaign, you can use the following HTML and update the text displayed for your link.

<a href="#" class="om-trigger-close">Close Campaign</a>

Button Style Close Link

If you prefer a more styled appearance, you can add your HTML link as usual and use CSS to style it as a button. For example:

HTML

<a href="#" class="om-trigger-close">Close Campaign</a>

CSS

html div#om-tpuklhkudymvohg1 a.om-trigger-close {
  background-color: #C71616;
  color: #fff;
  padding: 10px 15px;
  text-align: center;
  width: auto;
  display: inline-block;
  border-radius: 5px;
  text-decoration: none;
}

Adding The Link To Your Campaign

The next step is adding your link to a campaign. You can add a text or button close link to both templated and Canvas Campaigns.

Templated Campaigns

To replace the campaign form of any of our templated campaigns with your close link or button, you’ll follow these steps:

Step 1 – Custom HTML campaign Form Integration
In the campaign builder’s Integrations panel, select the Custom HTML integration option from the Email Provider dropdown. A textarea field will appear and you’ll add the HTML portion of your close link to this field.

Your text link will appear in the campaign preview as soon as it’s added to the Custom HTML field.

Step 2 – Close Button CSS (optional)
If you’re styling the close link to appear like a button (or just want to make your text link suit your campaign better), navigate to the Setup panel in the campaign builder and add your CSS to the Custom CSS field.

If this is your first time using OptinMonster’s Custom CSS tool you might want to review How to Use OptinMonster’s Custom CSS Tool for more details.

There, that’s better!

Step 3 – Save Changes
Save the changes to your campaign and you’ve successfully added a close link or close button!

Canvas Campaigns

If you’re using our Canvas Technology (available with a Pro license subscription), the process is slightly different than our templated campaigns.

Step 1 – Custom HTML
In the campaign builder, navigate to the Optin panel and add the HTML portion of your close link to the Canvas Custom HTML field.

And the text link will immediately appear in the campaign builder’s preview.

Step 2 – Close Button CSS (optional)
If you want your link to appear as a styled button, next you’ll add your CSS to the Optin panel’s Custom CSS field.

If this is your first time using OptinMonster’s Custom CSS tool you might want to review How to Use OptinMonster’s Custom CSS Tool for more details.

Step 3 – Save Changes
Save the changes to your Canvas campaign and you now have a close link or close button in your campaign!