Thrive Knowledge Base

How to Create a 2-Step Opt-In Using Thrive Architect / Thrive Lightbox

The user interface of the "Lead Generation" element has been upgraded!
Please, check out the changes here, before using the element.

You can easily create a 2-step lead generation process using the basic features built into Thrive Architect. In case you're wondering a 2-step opt-in works like this:

  1. In the first step, the visitor clicks on a button or link.
  2. ​Only in the second step is the visitor presented with an opt-in form. The form is shown in a lightbox, so that no page reload is necessary.

Here's how to set this up using Thrive Architect:

Step 1: Create a Thrive Lightbox​

In your WordPress admin panel, click on "Thrive Lightbox" and "Add New" in the sidebar:​

Give your new lightbox a name and publish it. Then, click on the "Edit with Thrive Architect" button:

You can edit the lightbox content any way you want, using all of the content elements in Thrive Architect. For the 2-step opt-in process, it's important that you add an opt-in form to the box. Do this by adding the Lead Generation element to your lightbox:

The process of adding and setting up the Lead Generation element is thoroughly explained in this tutorial: How to use the Lead Generation element - Don't forget to check it out.

Step 2: Connect with Service

When you've added the Lead Generation element, you will see various customization options. The most important option is this one:

Moving forward, you can either choose the API connection or the HTML Form code.

Connect using an established API connection

If you choose to connect through an API connection you can either select an existing API integration (1) or you can add a new one (2):

After you have selected a connection (e.g. ActiveCampaign, in our case), you can choose the mailing you want your users to be subscribed to and also a few specific options, depending on the connection you choose:

After you have set up this step, you can click on "Continue", which will send you to next step: Setting up the fields of your opt-in form.

This is a pretty straight forward step: The email field is mandatory, while the name and phone number fields are optional. You can modify the placeholder of each field or make it required:

And finally, the last step allows you to set the Post Opt-in Action: Wheter you want to reload the current page, redirect the user to a custom URL or show a success notification:

Connect using HTML autoresponder code

The other approach you can consider using is adding HTML autoresponder code. You can find more information on how to add the autoresponder code to your form, in our Knowledge Base section:

Once you have connected to service using either one of the approaches presented above, you have a working lightbox with an opt-in form inside it. Click on the "Save" button at the bottom of the Thrive Architect editor panel.

Step 3: Create a Button or Text Link to Trigger the Lightbox

We've created a lightbox with an opt-in form, so we have the "second step" in the 2-step opt-in process ready. Next, we can add a button or link anywhere inside a post, page or Landing Page to trigger this lightbox.

To Use a Button as Trigger

Open any page or post in Thrive Architect and add a Button element.

After you have added the button element and then look for the "Animation & Action" option on the editor:

Select the option, then choose "Popups":

Choose the "Open Thrive Lightbox" option:

Moving on, simply select the desired lightbox and also, notice that you can attach a certain animation to it, from the second drop-down:

After you have chosen a lightbox and and an animation, simply click on "Apply".

Then, save the changes on your page and preview it. You now have successfully created a 2-step opt-in! Whenever a visitor clicks on the button, the opt-in lightbox will appear.

To Use a Text Link as Trigger

You can also show the lightbox when someone clicks on a text link. To do so, select the text you want to use as trigger and click on the hyperlink icon in the text editor menu.

Search for the name of your Thrive Lightbox and simply select it form the drop down menu.

Click the Insert button and your lightbox is now linked to the text!

Remember to always test your opt-in forms before putting them to use.​

Note: Please keep in mind that testing your opt-in forms while you are still logged in on your website will not be accurate.

In order to properly test the forms that you create, you should use the Incognito Mode of your browser. This way the conversions/impressions will also be added to the Thrive Leads statistics.