Home › Documentation › QuickPopPRO Documentation
QuickPopPRO Documentation
Everything you Need to Add Unlimited Popups to WordPress
About This Guide
Welcome to QuickPop’s succinct yet thorough documentation! Below you’ll find in depth instructions categorized for quickly locating specific areas. New to Brindle plugins? We recommend starting with our Quick Start Video found in the first entry below.
QuickPop Video Tutorials
QuickPop Quick Start:
So much quickness! Looking to publish your first popup in a few minutes? This is the video for you:
QuickPop Features & Interface Overview
This video briefly showcases every feature of QuickPopPRO so you can become familiar with the general workflow and functionality of the plugin:
Email Optin Popups for WordPress
Collect emails and build your follwoing with these effective email optin popups. QuickPop collects cutomer info in a handy interface, and even works with popular email list services:
On Exit Popup for WordPress
Want to offer a deal before they navigate away? Add a popup to your site that triggers when a visitor navigates their cursor to the top of the browser, a proven method to convince them to come on back:
Multiple Popups for WordPress
Looking to create multiple popups, all with their own specific designs and goals? The followign video showcases the range of options available with QuickPopPRO:
Installing QuickPop
Congrats on grabbing your copy of QuickPop, hands down the best Popup builder for WordPress if we say so ourselves! Let’s dig right in and install the plugin, which is the exact same process as any other WordPress plugin:
Step 1. Download your copy of QuickPop form your account area. This will be titled “QuickPopPRO-master.zip”.
Important: Many operating systems will automatically unzip this file. However you will be uploading this exact .zip file so it needs to remain zipped. If your OS unzips files automatically, you will need to compress the file into a .zip in order to proceed.
Important: You msut not change the title of this file. The title formatting is critical in ensuring you can activate your plugin’s API key.
Step 2. In your website’s WordPress admin area, navigate to the Plugins tab. There, you will see a button titled “Add New” at the top of the page. Click this button, and then click “Upload Plugin” button found in the same location. Finally, select the plugin file from your computer by clicking the “Choose File” button, which will allow you to locate your .zip plugin file from your computer.
Step 3. After selecting the correct file, you will then click “Upload”. After the upload is compelte, click the “Activate Plugin” button, and you’re done!
On completing the above steps, the plugin has now been correctly installed. However before it will become funcitonal, you’ll need activate the API key assigned to you based on the license you chose when making the purcahse. Activating your API Key is covered in the next section of this documentation.
Activating Your API License Key
Each Brindle plugin must be activated via a unique API key, which is automatically assigned to your products. Luckily it is an ultra-quick process that only takes a few moments to complete, so let’s dig in:
Step 1. In your account area you will notice a seciton titled “API KEYS” in the left-hand sidebar. Go ahead an click that link to see a list of your APIs, each categorized by their corresponding product. Locate the correct API, and copy it to your clipboard for later use.
Step 2. Now armed with the power of a copied API Key, return to WP-ADMIN. If you completed the installation of a Brindle plugin, you will notice that a new tab has been added to your sidebar, cleverly titled “My Brindle”. Hover your cursor over that tab and you’ll see a sub-section titled “API Activation”, which you’ll want to click.
Step 3. On this screen you’ll see the field where you’ll want to paste the API Key that you copied form your account area, and select “Activate”.
Step 4. JK there is no 4th step, you’re done! If succesfully activated, you will see the status changed to “ACTIVATED: alongside the number of active and remaining uses of the key.
Important Notes on API Key Activation:
- There is a glitch that sometimes causes the plugin to be set to inactive by default. This setting is in the “Deactive API Key” tab. You may need to navigate to this tab ans ensure the “Deactivate API Key” checkbox is NOT selected. Then, click “update” and try activating the API Key again on the other tab.
- The most common cause for API activation to not work is site caching. Site caching can cause your site to not communicate with our API validation server. Be sure to disable caching temporarily until you succesfully activate your plugins. Note this can also be cause by third party “optimization” services such as Cloudflare.
QuickPop Overview / Popups Library
Now that you’ve installed and activated QuickPop, it’s time to get cozy with the QuickPop interface. Below you’ll find an overview of QuickPop’s interface alongside brief notes of each sections purpose. This will help you get familiar with the overall worflow when creating and managing your popups.
Step 1. General Overview
Upon installing and activating QuickPop, you’ll find the a new area added to your wp-admin dashboard titled “My Brindle” which is where you’ll also access QuickPop settings. On clicking QuickPop, you’ll be taken to the Popups Library, which serves as your home base for all things QuickPop.
Popups Library
Also shown above, this is the core area of the plugin where all popups are organized. You will be able to quickly see the title of each plugin, the status (live or disabled) and other features used in maintaining your collection of popups. To edit a popup, simply click the title or pencil icon. You can also of course create a new popup (you can make as many as you need, wach with their own goals!) by clicking ” Design New Popup” in the right sidebar of the Popups Library page.
Click this link to create a new popup, and we’ll dig into each section in the following segments of this documentation.
Designing & Editing Popups: The 3 Core Sections
Assuming you’ve clicked this link or selected an existing popup (if you’ve create one earlier), you’ll be taken to the overall Popup’s settings area, which consists of three primary sections. These are organized logically to make creating a new popup as logical and quick as possible—because, you know, QuickPop!
The core sections that appear are organized into the following tabs:
Content
Design
Settings
You can access thee tabs in any order, and click “Update” to make any changes stick. In the next sections of this documentaiton, we will cover the content of eac htab in detail.
Content Tab
On this tab you’ll set the specific content of the popup. This includes the title text, the body text, any images you’d like to include, and specific labels for buttons. Furthermore, you can specfiy which fields to include on your popup, such as email, Name, and phone number. Thsi tab goes in hand with designing your popup, but focused primarily on actual content versus the visual design, which can be changed on the “Design” tab (see next section). Let’s have a look at the details on the Content tab:
Headline
This is the headline that appears at the top of your popup. Note you can also leave this blank and add a headline to the text content found in the “Body” section for a bit more control over your headline’s style and placement.
Body
Button
This area pertains to the standard button. You can include this button in the Settings tab. More details can be found on the “Settings Tab” section of this documentation.
Button Text: This is the text that appears on the button.
Button Link: This is the link that the user will be taken to when clicking the button.
Open in New Tab: This will tell the button to open the link in a new tab on the user’s browser. If left unchecked, the button will open the link within the same browser.
Form
This area pertains to the form. To add a form to your button, you’ll want to do so in the Settings tab. More details can be found on the “Settings Tab” section of this documentation.
Email/Name/Phone Number: These are the various fields you can add to your form, all of which will be collected from visitors and added to the “Submissions” section when a visitor submits the form. You can specify which to include, as well as if each is required for submission. note also that you can enter the pre-populated “hint” text here as well.
Form Button: This is the text that appears on the form’s submission button.
Thank You Message: This is the message that will be displayed to the user after they submit the form from this popup. On the front end, it will look something like this:
Design Tab
Design Tab
This tab is where you’ll style your popups as needed. Almost every aspect of the popup can be changed to your liking. Here’s what you’ll see, followed by a breakdown of each setting:
Include / Exclude:
Standard Button: This will add a “normal” button that can have it’s own link assigned to it. It is not tied to a form in any way. This is useful, for example, if you would like to link to your site’s shop when promoting a sale. Note that if you also inlcude a form, this button will be added in addition to the button tied to the form itself.
Form: This will add a form to the popup, which can be used to collect emails and other visitor info. A button will automatically be added to the form, and you can control the content of the form on the “Content” tab, including the button’s label, and different fields to be included. See the “Content Tab” section of this documentation for more details on the form’s content.
STYLE
This makes up the bulk of this section, and relates to the overall design aesthetic of the popup.
Popup Container Background Color Type
You can specify if you’d like the color of the actual popup to be a single color, or a gradeint. If selecting “Gradient” you will be presented with two color options for each “end point” of the gradient, as well as being able to specify the direction of how the gradient flows.
Border Width
Adds a border to the popup container, and allows you to specify the thickness and color of the border.
Overlay Background Color Type
The overlay describes the background that appears behind the popup itself. It is a full screen effect that allows the popup to stand out form the site’s content. This setting let’s you specify a single color or gradient, allowing countless options for creating truly unique popups. The default setting is a dark gray single color.
Opacity: This setting controls how visible the background overaly is. If set to 100%, the user will not see any of your site content. Lowering the opactiy will allow more of the site to be seen throguh the background overlay. Default setting is 84%.
Standard Button Color
If yu’ve included a standard button in your popup, this is where you can change the color.
FORM STYLE
All settings in this segment related specifically to the form. Note you must include a form in your popup for these settings to take effect. Including a form can be done on the “Settings” tab.
Form Button Color
Sets the color of the form’s button.
Form Field Background
This setting changes the color of the form’s fields. The field is where the user will enter text, such as their email.
Form Field Border
This setting allows you to change the color of the field(s)’ border. If you prefer not to havea border, you can make this the same color as the form field’s background color.
Settings Tab
Settings Tab
This tab contains core functionality, behavior, and status settings for each specfic popup. You will be able to add a title for reference, set whether the popup is enabled/disabled, and behavior settings like time delays, animations, and popup events. Check out the overview below for details on each setting:
Status: Set the popup to Enabled or Disabled. “Disabled” allows you to work on a popup without it being live. “Enabled” activates the popup, making it live on your site.
Form Title: This is the name of your Popup, which is used for reference only. It will not be displayed on the popup itself, so feel free to choose a title that will indicate its goals, design, functionality, or other factors that will help you quickly reference it in the future. This title will be displayed in the Popups Library’s list view.
Visibility: This section allows you to specify if the popup should exist on all pages of your site, or specific pages.
Admin screens
