Setting Up Capture

Capture setup, how to setup your own capture

Capture is one of our easiest apps to install and get started with. One simple line of code added to the header of your website or landing page gives you the power to add opt-in forms that show based on a range of rules that you can control.

Capture Overview

Every business collects emails, it's still one of the most powerful communication mediums around. Email gives you a direct one to one communication with your customer. You can use email to send newsletters, product updates, special offers or announcements.

Many businesses still lack the proper ability to collect emails from their customers. They also lack the ability to test new ideas and try different messaging against certain types of customers based on their behaviors.

That's where Capture comes in. We make it incredibly easy to build beautiful opt-in forms that you can setup to appear on your own terms. What's more, these forms sync with most of the major email platforms - which means you don't even have to worry about involving your tech team.

Just install our tracking script and get testing.

Installing Capture On Your Site(s)

We've built Capture to be very easy to install on your site. All that is required is to paste a single line of Javascript into your website's template.

You can grab instructions by clicking the Get Install Code button at the top of the Captures tab.

Gleam interface showing tracking code for capture

Insert Before The Closing Head Tag

If you're unsure exactly where to put the installation script here's some sample code that shows exactly where in your header to insert it.

<!DOCTYPE html>
<html>

<head>
  <title>Page Title</title>
  <--- Insert Capture Script Here --->
</head>

<body>
Main body content
</body>

</html>

Once this code is installed on your site you can completely control all your Capture campaigns from within the Gleam interface. This means you can test as many ideas as you want without technical help or even having to replace the script.

Embedded Captures

If you're using an Embeddable Capture type then you'll be provided an additional code to embed that Capture into your page.

<div data-capture-embed='s9tgL'></div>

Behavioral Rules are not enabled for Embedded Captures, they will always show wherever the code is added.

Capture Landing Pages

Every Capture you create comes with it's own dedicated Landing Page that you can access via the Preview tab of your Capture.

Gleam interface showing capture landing page

You can direct traffic to your Capture's Landing Page by sharing the link, or via your landing page's QR Code.

Sending Traffic To Your Capture Via QR Codes

Every Capture comes with a unique QR code that will redirect users to your Capture's Landing Page when they scan it.

You can find your Capture's QR code in the Preview tab of your Capture by clicking the icon next to the Landing Page link.

Capture QR codes provide businesses that operate out of a physical location a fantastic opportunity to drive signups, grow their email list and distribute coupons directly from mobile devices. All you need to do is display or distribute the QR code in your business and encourage users to scan the code to access your Capture where they can sign up, unlock coupons or take further action.

Gleam interface showing capture landing page with QR code

Sending Traffic To Your Capture Via Linktree

If you use Linktree to share content, deals and more with your audience, then you should be adding your Gleam Captures to Linktree to increase traffic and drive conversions.

Adding a Coupon Capture to your Linktree is a particularly effective way to incentivize email signups and encourage sales.

When users click your link they will be taken right to your campaign's landing page where they can signup, and claim any coupons you might be offering.

All you need to do is copy your Capture's Landing Page URL and add it to Linktree.

Add Gleam Competitions to Linktree

You can find your Capture's Landing Page URL in the Preview tab of your Capture.

Setting Up Your Default Email Provider Integration

Capture integrates with 30+ Email Marketing providers, making it easy for you to sync data from your forms into your lists or message sequences.

Each Capture can be linked to multiple providers via the Email Integrations tab (more on this later).

So you don't have to set this up every time you create a new Capture it can be helpful to setup a default integration via the Settings > Integrations tab in the sidebar.

Creating Your First Capture

Simply head over to the Captures tab in your left hand menu and click the green New Capture button at the top right, you'll then be presented with the option to select which Type you want to use.

Capture Types

Captures are split up into Types, Layouts and Variations to make it easy for you to understand the purpose of a specific Capture type.

In order to understand all the various options we've put together a separate guide that goes into detail about each Capture type.

Explore Our Capture Types

Capture Setup Options

The options you see during setup may change depending on the Capture Type you've chosen, below is a guide to help you understand what each of the configuration options does.

Layout

The Layout tab allows you to:

Give the Capture a name
Choose your Type
Choose your Layout
Choose your Variation

Gleam interface showing capture template layout options

Once you choose the Variation you want to use you will then see a few additional options:

Capturing

Email

Use this option if you just want to capture email addresses without the user providing their name.

This would allow you to do things like:

Get more users onto your email list
Popup a special offer when users visit your site for the first time
Popup a coupon code when users are about to leave your site
Allow users to register for a Webinar with just their email address
Allow users to access whitepapers or other content
Personalized popups based on which social network the user arrives from

Name + Email

Use this option is you want to also capture a name + an email address.

Gleam interface with name and email action

We will automatically handle if a user users their first name or full name when we sync it with your email provider.

Clicks

This is a powerful feature that is often overlooked, but if you use Captures for clicks it opens up possibilities for personalization on your site. For example you could use it to:

Redirect users to your Competition
Alert users that you ship to certain countries
Let users know when a product is out of stock
Let users know when there's a sale on
Let users know you support a certain language

Call to Action

Some Variations have the ability to enable a Call to Action which allows offers a more conversational way for users to either opt-in or decline to opt-in.

Two Step Capture

Two Step Captures allow you to have multiple steps, the first offers the ability to ask a question, then the second step facilitates the opt-in. Both steps can have different messaging.

Step 1

Step 2

Coupon Captures

If you're using the Coupon Capture type then you'll see an additional Coupon tab under the Design tab.

If you add a single Coupon then it'll allow unlimited claims
If you add individual Coupons then the Capture will end once they are all claimed

Countdown Captures

If you're using the Countdown Capture type then you'll see an additional Countdown tab under the Design tab.

This will allow you to configure the timezone and exact time for the Capture to countdown towards

Design

Once you've chosen your Capture and Layout settings you're ready to start adding your own touches via the Design tab.

Display Mode

Certain Variations have the ability to set the Display Mode:

Sticky: Moves with scroll

This will stick the Capture to the desired position and make it move as the user scrolls up and down the page.

Static: Does not move

This will stick the Capture to the desired position and keep it there, it won't move.

Scroll: Hides with scrolling down

This will stick the Capture to the desired position but will hide as the user scrolls down the page and show as the user scrolls up.

Position

Certain Variations have the ability to set the Position:

Top of Page
Bottom Of Page
Left of Page
Right of Page

In some scenarios you can also set a pixel offset so that the Capture doesn't interfere with other plugins like live chat

Capture Width

You can control how wide you want the Capture to display with this setting, this won't affect the responsiveness of the Capture when viewed on mobile devices.

Images + Gradients

Depending on your Capture variation you'll see different options in this section. Some Captures simply allow you to upload an image.

If the Capture doesn't feature an image you can sometimes also upload your image as a background.

You can also change the background colours or even add a gradient to make the Capture work with your branding.

Heading / Text / Buttons

Once you set your images (or gradients) you can edit the body of the Capture. The available sections will depend on which Variation you're using.

You can control:

Heading
Main Text
Button Text
Form Placeholders
CTA Text (i.e. No Thanks)

Good copy that is relevant to users and entices them can mean the difference between good and great conversion rates, so don't be afraid to experiment 👨‍🔬

Removing Sections

If you want to remove the Heading or the Main Text from your Capture just delete the text, the same works with any optional fields or buttons (except the main Subscribe button).

Fonts

Fonts are configurable for each section inside the Design tab, you can choose from 500 different supported fonts.

Post Capture

Once a user completes your Capture by either filling out their information or clicking it, you can choose what you'd like to do afterwards:

Do Nothing

This does exactly what it says on the tin, when the Capture is considered completed nothing happens. This is useful for Click based Captures if you want them to keeping showing, not so useful for Email based Captures.

Display Thank You Message

Show a brief thank-you message when the user completes your Capture.

Message + Facebook Like Button

Show a brief thank-you message and also a Facebook Like button when the user completes your Capture.

Gleam capture showing thank you message and action to like facebook page

Clicks on this Like button get recorded as Events in your reporting tab.

Message + Redirect

Show a brief thank-you message then redirect the user to a specific URL after they complete your Capture.

Open New Tab / Window

Open a specific URL in a new browser tab after the user completes your Capture.

Trigger Campaign

Trigger another active Capture campaign when the current one is completed, this can be good for chaining Captures or messages together.

Post Capture Image

Gleam capture showing thank you message with image

Auto Close

Auto Close allows you to automatically close the Capture after a set time frame once it's completed, you can set this to 0 to close instantly.

By default some of the options above will automatically select this feature.

Javascript Callback

This option fires a specific Javascript Callback to your page once the Capture is completed. This will pass the status of the Capture as well as the data collected from your Capture form.

You can use this to perform something specific like:

Adding a coupon to the shopping cart
Doing something with the users account
Awarding the user something
Showing specific content

First, you'll need to initialize the onCaptureComplete function:

<script>
window.onCaptureComplete = function(captureName, message, data) {
  console.log("Capture Callback Test captureName:", captureName, "message:", message, "data:", data);
}
</script>

This should then provide your function with the following parameters:

The first parameter, captureName, returns the title of your Capture campaign:

"My Capture"

The second parameter, message, returns a message describing the outcome of completing the Capture. For successful conversions, the message will return "Lead added". If an error occured, the error message will appear in this field.

"Lead added"

The third parameter, data, returns some data about the user that completed your Capture:

{
  "form_data": {
    "email": "sallysmith@mail.com",
    "name": "Sally Smith"
  }, 
  "key": "CQjsS",
  "language_code": "en",
  "location": {
    "city_name": "Sydney",
    "country_code": "AU", 
    "country_name": "Australia", 
    "description": "Sydney, NSW, Australia", 
    "region_name": "NSW", 
    "time_zone": "Australia/Sydney"
  }
}

CSS

The CSS Tab offers you control over the entire CSS of any type of Capture, you can use this to make small tweaks or completely change how a Capture looks.

There's three states that you can control:

Normal: This shows the Capture before it's been completed
Sending: This shows the Capture in the sending state
Done: This shows the Capture in the completed state

Clicking any element in the Capture will bring up the associated CSS class to edit.

Setting Up Your Rules

Once you've setup your Capture and have it looking exactly how you want you'll need to move onto the next step which determines when the Capture shows to users.

Setting Up Behavioral Rules

Troubleshooting

Help! My Capture Doesn't Show

There's a few things that you can do to troubleshoot your Capture not showing.

Debugging Rules

We have a nifty rule debugging script that's automatically built in once you install Capture. Simply add #rule-debug to the end of any URL on your website.

https://www.yoursite.com#rule-debug

Common issues include:

Not having the tracking code installed on your site
Not having the Capture enabled
You've already triggered the Capture and closed it previously. It's recommended to test in a private (or incognito) window
You have conflicting rules, for example a user can't be New and Returning at the same time

Competitions

Rewards

Gallery

Capture

Apps