Skip to main content

Unbounce Setup Guide

Script​

💡 Note that you must have a paid Unbounce account associated with a custom domain name to use LCAI. The free version does not support Javascript.


  1. In your Unbounce account, go to the page where you want to add Lead Capture AI under the All Pages menu.

  2. At the bottom of the page editor, look for the Javascripts button. Click on that button and then "Add new Javascript"

    In your Unbounce account

  3. Add the LCAI SDK script. Note: Be sure to update the data-org-id value with that of your organization.

<script
  id="auroraLCAI"
  data-org-id="your-organization-id"
  src="https://leads.aurorasolar.com/lead-capture-sdk-v1.js"
  type="text/javascript"
></script>

Add the LCAI SDK script

Click Done

  1. Move on to adding the Discovery Widget or associating LCAI to a CTA button.

💡 It is also possible to automatically add LCAI to every page automatically. To do this, navigate to Settings, Script Manager and add the script referenced above there.

Discovery Widget​

  1. In your Unbounce account, go to the All Pages menu and find or create the page where you want to add the Discovery widget

    In your Unbounce account

  2. Edit the page content. If you have multiple page variants you may need to complete the following steps for each variant.

    Edit the page content

  3. Add a Customer HTML element to the section where you want to add the widget. Give the section at least 449 pixels in height.

    dd a Customer HTML element

  4. Click Edit Code in the properties section of the HTML element and add the following:

<div id="lcaiWidget"></div>

It should look similar to the following:

Look like

  1. Click Save Code

💡 Note that the widget itself does not display in edit mode within Unbounce. You need to preview the page to see it


  1. Preview your page and adjust your layout as necessary. Be sure to preview in both mobile and desktop. In this example the result is:

    Preview

  2. Once satisfied, Publish your page.

CTA Button (to open Lead Capture Experience)​

  1. In your Unbounce account, go to the All Pages menu and find or create the page where you want to add the Discovery widget

    In your Unbounce account

  2. Edit the page content. If you have multiple page variants you may need to complete the following steps for each variant.

    Edit the page content

  3. Create a new page or hover over the page that you want to edit, then click Edit.

  4. In your page layout, find the content area that includes the button or Call to Action you'd like to associate with Lead Capture AI. In the Properties area, make the Click Action "Go to URL" and leave the URL field blank.

    In your page layout

  5. Scroll down in the properties section until you find the "Element Metadata" area. In that area, add the following to the "Class" field.

lcaiCta

lcaiCta

💡 Existing hyperlinks associated with the button should be removed if editing an existing button.


  1. Save your draft page and hit Preview to see the result
  2. Continue to edit the page as needed to refine the layout. Once satisfied, Save and Publish the page.

💡 It's possible to add LCAI to multiple buttons, images, and other CTAs on the same page.