ConvertedU Marketing Library Webinar Blog

Need help? You've come to the right place

What's New Getting Started Building Integrating Publishing

Publish Your Leadboxes

Now that you’ve created a Leadbox, it’s time to publish it! In this article, we’ll cover all the basics of publishing Leadboxes so you can put them on your site. 


The fine print

Here are some notes to keep in mind as you begin publishing Leadboxes:

  • You’ll need at least one standalone Leadbox. If you haven’t created one, check out our guide here.
  • This article details the publishing of standalone Leadboxes, created under the Leadboxes tab on your dashboard and meant to be used on websites and blog posts. If you intend to use a Leadbox on a Leadpage, you will create an on-page Leadbox and publish it with your Leadpage simultaneously. Learn more here.
  • Publishing Leadboxes involves copying and pasting code. You don’t need to edit this code, but you’ll need to have access to your site’s code—or some way of injecting code into the webpages where you plan on publishing your Leadboxes.
  • Timed popup and exit intent Leadboxes do not work on mobile devices. Learn more here
  • We can provide limited support for issues you may encounter when publishing your Leadbox. For troubleshooting problems specific to your site, you’ll need to consult your web developer (or site platform’s support options). 

Configuring your publishing options

Access publishing options by navigating to the actions menu morethen Publishing Options.

NOTE: If you’re using a Leadbox built with our Standard (Legacy) Builder, this will open the editor of the Leadbox and you'll click Publish at the top-right corner of the builder to access your options. 

Choosing a trigger

Each Leadbox you publish must have a trigger associated with it. Your Leadbox will only appear when its trigger is activated. You can choose between five different options:

  • a plain text link
  • a button
  • an image
  • a time delay
  • exit intent

The first three activate your Leadbox when visitors take a specific action—that is, they click a link, button, or image that causes your Leadbox to appear. 

Timed Leadboxes pop up after a designated period of time (that you set), and exit Leadboxes appear when a visitor moves their cursor near the top of your page (signaling they’re about to leave). 

TIP: You can publish the same Leadbox using multiple triggers. For instance, you might publish the same event registration opt-in at the end of a blog post as a text link and in your site sidebar as an image link. 

Each trigger provides its own customization options. The button link option, for example, lets you customize the button colors, roundness, and drop shadow.

You can explore other triggers’ options in the publishing modal. Keep in mind, any time you adjust a trigger’s options, it will change the publishing code for your Leadbox—so you’ll need to re-paste the snippet to your pages.

Copying and pasting your code

Once you’ve customized your Leadbox’s trigger, it’s time to put its code on your site. For the steps below, we recommend having your site’s code (for whichever page you’re publishing your Leadbox to) open while you work.

NOTE: If you’re not sure how to access your site’s code, you may need to consult your website software’s support options, or whoever set up your site. 
  1. Navigate to your chosen trigger and click Get Code.
  2. Copy the entire code snippet. 
  3. Paste the snippet in your webpage’s source code wherever you’d like your Leadbox’s trigger to appear. 

Notice the code snippet will always contain two parts: the Leadbox JavaScript loader, and the trigger code.  

You don’t need to worry too much about this, but it can be helpful to know how the code is composed. The first part (shown below) only needs to be included once on each webpage. So, if you have multiple Leadboxes on the same page, you’ll only need the JavaScript loader for the first one. 

<script src="//" async defer></script>

The second part of the code is your Leadbox’s trigger. You can paste it wherever you’d like it to appear on your page, such as within a blog post or perhaps in your site’s sidebar. That said, in most cases you can absolutely keep the code together, and paste the entire snippet where you’d like your Leadbox’s trigger.

Keep in mind that timed and exit triggers are invisible—so you can paste your code pretty much anywhere on the page. 

Once you’ve pasted your code, we recommend updating your site and testing out your Leadbox to make sure everything’s running smoothly!

Troubleshooting your Leadbox

If your Leadbox doesn’t show up on your page, you can take the following troubleshooting steps:

  1. Open your page’s source code (using your browser or site editor). 
  2. Check to ensure your entire Leadbox publishing snippet is within your page’s code.
  3. Confirm that your site’s platform supports JavaScript code. (You may need to consult their documentation.)
  4. For timed and exit Leadboxes, open your publishing options. Make sure you haven’t set any options that prevent your Leadbox from appearing (such as an extremly long Time delay before launch setting). If you have, adjust the settings temporarily and try viewing it again.  
  5. If you continue running into problems, try viewing your Leadbox in another browser or on another device. 
  6. Try clearing your cache—especially if your Leadbox appears in some browsers but not others. 

Still having trouble? Reach out to our support team, and we’ll be happy to help troubleshoot with you. 

Updating your Leadbox

You can make any changes as needed even after you publish your Leadbox. If you make changes to your Leadbox itself, you can simply click Update—your published Leadboxes should reflect any changes you’ve made. 

However, if you adjust your Leadbox’s trigger settings, you’ll need to go back through publishing steps above.

That’s it! Your Drag & Drop Leadbox should be on your page and you can start collecting opt-ins.

Frequently asked questions

Why does my Leadbox open up in a new browser tab/window instead of overlaying the page?

When you only use the Leadbox URL (and not the entire code) your Leadbox will open in a new tab/window. If you want to have the overlay effect on your page, you must embed the entire code produced under Publishing Options.

The Leadbox’s JavaScript (the portion of the code that begins with <script> and ends with </script>) does not have to be in the exact same spot as the rest of your embed code, but it must be present on the page.

We typically see Leadboxes (embedded using the entire code) opening in a new window or misplaced on your page if:

  • Your embed code has been corrupted by other code on the page.
  • You have inserted the embed code in the Visual Editor of the page instead of the Text Editor.
  • Your Leadbox is published using a website creation tool that does not allow for JavaScript code.

If this happens, please save any changes and re-publish your Leadbox to get a new copy of the code.

Why does the video on my page restart when my Leadbox opens?

In some cases, embedded video code can tangle with Leadbox code and cause certain issues. If your video restarts when your Leadbox opens, another option you can try is to add the following code to your page:

window.addEventListener('LpLeadboxesReady', function () {

The script should ensure your video does not restart when someone opens your Leadbox.

How do Leadboxes work on mobile devices?

Leadboxes are designed to work normally on mobile devices. However, timed Leadboxes won’t appear to comply with best practices (and prevent your pages from receiving lower rankings from search engines like Google).

Similarly, exit Leadboxes do not appear on mobile devices, as there’s no consistent way to predict exit intent like there is for desktops. Most mobile browsers will automatically block pop-ups, therefore disabling timed and exit-intent Leadboxes.

Can I use standalone Leadboxes on my drag-and-drop pages?

You can paste any Leadbox’s code into an HTML widget on your page. At this time, we don’t have a way to connect standalone Leadboxes to existing buttons or elements on Leadpages.

NOTE: If you do use a standalone Leadbox on your Leadpage, you’ll need to look at the Leadbox’s analytics data to track opt-ins—as they won’t appear for your Leadpage.

(Updated September 19, 2018)

Please let us know if you have additional questions.

You can always file a support ticket if you have additional questions by clicking the Support button in your dashboard shown here or clicking here to file a support ticket.

Was this article helpful?
Powered by Zendesk