Pop-Up Manager

Configuration

Next, we'll configure your popup. So we'll start by filling out our display triggers - so display after x visits, after x clicks, or after x seconds. This is to give them a chance to interact - maybe you want them to click on your content before you show them your popup - or maybe if they have clicked off your initial landing page you'll trigger off a popup. So, this is totally your preference - but the hierarchy is from left to right - so if I have a value for visits, clicks, and seconds, it's always going to go in the order of visits, clicks, and seconds.

Submit Button

Next, you have the ability to design your submit button. So you can choose the text, the size, whether there is a border, and pick a background color and a hover background color. You can also choose to bring in an image as a background for the button.

Hidden Fields

You can also add in any hidden fields - for example, maybe time of opt-in, for any information you want to gather without it necessarily being visible to the customer.

Create Version

To create a new popup, just select the green "Create Version" button - and you will be prompted to choose a name for the popup, and pick a template, which will basically format the pop-up editor based on whether you want to create a desktop or mobile version of the popup. There's also an empty template if you wish to totally start from scratch.

Confirmation Page

Finally, you iwll be able to format the confirmation page that your customers will see. Now, you do have to manually flip over to the confirmation page, and that's because we don't actually force you to use this. You can either close the pop-up after submission, redirect to a url of your choice, or show them the confirmation popup.

Bronto Settings

Next, you have your Bronto settings - so you'll determine the status for any contacts who come into Bronto through this popup. You'll have two options, "onboarding" and "unconfirmed." Using onboarding, the default option, will allow you to send them a marketing e-mail. Unconfirmed means they will have to double-opt in before you send them any marketing content. Next, you have the option to add your contacts to a preexisting list, or you can create a new list by selecting create new list. We recommend creating a list for each popup you make...this will make more sense during our reporting call, because we'll be able to look at list performance over time, which could be useful in determining the best popup to use going forward.

Ribbons

Now, one thing that we also make available to you are ribbons for mobile. This is because google has changed it's stance on mobile apps as far as it regards pop-ups. Basically, if you have a pop-up that fills most of the mobile screen, google considers it spammy and will downgrade your visibility in google results. So, to counteract that, we've created ribbons. This way, when a customer comes to your mobile site, they can click on the ribbon to expand the popup. Now, you can only create one ribbon, but you do get to create both a mobile and a desktop version. When you design your ribbon, you'll choose it's position on the page, it's dynamic height, you can choose a background color and potentially add a border. You can also choose if you want to show an arrow, and what color you want that to be. Under text elements, you'll be able to choose what you want the ribbon to say, as well as format the font. Finally, you'll have the option to format your close link.

URL Paths

Now, you don't HAVE to include a URL path, since we're already adding the script on every page. However, we do need to determine exclude URL paths to say, which page DON'T I want this popup to show on? Maybe not my checkout page.

Pop-Up Manager Layout

Once you choose your template, you'll notice something familiar about the builder...in that you have your canvas on the right, and on the left, you have a design and configuration palette. So, first and foremost, you have the option to adjust the canvas size. Now, this is not going to affect the size of the popup - it's just the useable space that you have available to put information on. So, for example, creating a larger canvas would allow you to move your closeout button outside the popup. If you want to change the size of the actual popup, you could do that by adjusting the Width and Height. From there, you can add in a border, change the color, etcetra. Now, whenever you see a little image folder icon, you can upload an image that is either house locally on your machine or on an internal server. And once you load that image in, pop-up manager is actually going to host that image for you.

Close Links

Similarly, you can choose the text for your close link, the font, etcetra.

Update Domain

So getting started with pop-ups - you're going to want to begin by updating the domain to reflect the domain you want this popup to deploy on. You will also need to deploy the script on each page of your site - and you can use google tag manager to deploy that script if you choose - to access the script tag, you'll just click "Script Tag" and grab with the HTML script tag, or the google tag manager script. Once we have these little housekeeping details together, we're ready to build a popup.

Activate

So we've created our beautiful new popup, and our ribbon for mobile, and now we want to activate the latest version. When you hit activate, you'll see 2 columns - version a and version b. Of course, you will see under each column that you have both a desktop and mobile version. Now, Version A and Version B can only be activated at the same time if you turn on A/B testing, and similarly you can only select a mobile version if that is toggled on. You do have the ability when activating a popup to choose a max mobile width and height. Once you fill out your preferences, you can hit activate and voila - you now have your pop-ups set.

Cookie Policies

So, here you can set your cookie policies, which is basically to say, if someone is coming from a Bronto cookie, do you want to exclude them from seeing the popup? You'll set "display if bronto cookie is present" to either yes or no, To set this up, you'll determine whether the cookie is unique to the domain or the popup. Basically, what this means is that if it is set to domain, and they opt-out, it's going to apply a site-wide cookie so they won't see a popup. If you change this cookie uniqueness to popup, it means that whatever rules you set only apply to this specific popup version...so this could be useful if you're a/b testing your popups. You'll also determine the time frame in which you want the system to wait to display the pop-up after opt out - so maybe you want to give them 90 pop-up free days, then try again. Similarly, you will choose a "display again" time frame after opt-in - so maybe a year later, you could show them the popup again.Finally, you have the option to determine if you want to create a bronto cookie for the user following submission of the popup.

Pop-Up Intro

So, pop-up is an awesome acquisition tool, because it provides a call to action for your customers to sign up for your e-mail list. Now, within out pop-up manager, you can build out as many pop-ups as you want with the caveat that you can only have one active at a time. That said - there are a couple little tricks - for example, you can have one per desktop, and one per mobile active at a time. Similarly, you can use A/B testing, which will allow you to have 2 active per desktop and mobile, if you are trying to determine which pop-up bears the best results for each channel.

Text Element

Text element is straight foward - here, you can drop in the main text you want visible on the pop-up, and change the formatting with the text editor. You can also change the subtitle, right below. As I've mentioned with some of the previous editors, we only use web friendly fonts - so if you do have branded font or something like that, we recommend designing it in photoshop and bringing it in as an image.

Input Fields

The input fields section allows you to add contact fields into your popup. You will start by selecting the green plus sign, which will give you access to your contact fields. When you pick one, it will be added to the selected input dropdown menu, and also populate on the popup. From there, you can change the contextual text and choose whether or not it is a required field. You can also adjust the size of the field, the font... and you can actually grab it and drag it around on the canvas. If you want to delete the field, just find it on that selected input menu and hit the red trashcan on the right hand side to delete it.