Slick Popup Pro is simple and robust WordPress Popup Plugin by which you can create Slick, Smart and Beautiful Popups. Slick Popup Pro gives you a basic HTML box and if you can, you can customize it into the Popup you want. We give a lot of options to customize our Popup Plugin. The Plugin has a very basic and simple structure so it would not be a problem to all the developers to understand it and create a very good looking Popup. Slick Popup Pro gives you the option to create more than one Popup on a single web page. Some of the few demo forms which are provided by Slick Popup Pro are Basic Enquiry, Get a Quote, Subscribe, Unsubscribe, Booking and Survey Form. There are no numbers to which you can create the Contact Form 7 forms and all those forms can be presented in a beautiful way by Slick Popup Pro.

The Plugin uses the latest version of jQuery which enables us to provide you with the best possible popup. The Popup is also very responsive and is made to work on any device ranging from large screens to compact smart phones. We have used Redux Framework to build our admin panel for the Global Options and Codestar Framework to build the option panel for Multiple Popups.

We have created some basic demos and tried to cover all the basic options that we provide in our Plugin. You can check out the demos and other features of Slick Popup Pro here https://www.slickpopup.com/

Please Scroll Down to Explore various options and we hope that by going through the documentation you will find the answer to your solution and if you are still not able to find out then feel free to ask us at poke@slickpopup.com .

How to create a Popup?

Creating a Popup Form is very easy with Slick Popup Pro.

1. Create a Form via Contact Form 7
2. Go to Global Form Options
3. Select your Contact Form
4. Choose on which pages you want to show your Popup
5. Add the Popup Styles
6. Click on Save Changes and Checkout your Smart, Slick and Beautiful Popup Form

How to create Multiple Popups?

Creating Multiple popups can also be done by Slick Popup Pro.

1. Create your forms in Contact Form 7
2. You can set up one Popup in the Global Form options.
3. For the Second Popup, Go to Manage Popups and Click on add new.
4. Select your Contact Form
5. Create the popup according to your needs
6. Click on Publish and Checkout your Smart, Slick and Beautiful Popups

How to create a Login Popup?

To create a Login Popup follow the following Steps:

1. Go to Manage Popups
2. Click on Add New
3. Choose the Page
4. Choose Login Form instead of Contact Form 7
5. Add the Styles
6. Click on Publish and Enjoy your Login Popup

How to Import the Demo Popups?

To Import the Demo Popups follow the following steps:

1. Go to Import Popups
2. Choose the desirable Popup
3. Click on Import
4. Note: It is recommended that you go through the default setting of the imported Popups:
   1. Click on Edit Form to edit the Contact Form 7 and make changes in the mail tab
   2. Click on Set Popup to choose where to show and change the appearance of the Popup.

Color Schemes

There are 5 built-in Color Schemes and you can always Customize it according to your own requirements

1. Master Red
2. Creamy Orange
3. Light Blue
4. Cool Green
5. Classic Grey
6. Custom Color

Typography

There is a lot you can Customize with typography in Slick Popup Pro

1. CTA text: You have full control over the typography of the CTA text which is found over the top of the contact form
2. Label text: You can change the typography of the label text as well.
3. Side Button text: You can fully customize the typography of the side button text.

Activation Modes

There are 5 Activation Modes:

1. On-Click: Default is set to On-Click, The Popup will activate on the click of a Button or an HTML Element
2. Auto Popup: This is the entry popup this is activated when the page is loaded.
3. Forced Popup: This will not close until the user fills the complete form successfully
4. On-Scroll Popup: This popup is activated when you scroll a certain amount of the page.
5. On-Exit Popup: This will be activated whenever a user tries to Exit the page.

Animations

There are more than 14 Loading Animations

1. Fade
2. Bounce
3. Zoom
4. Flip in X
5. Flip in Y
6. Light Speed In
7. Flash
8. Pulse
9. Rubber Band
10. Shake
11. Swing
12. Tada
13. Jello
14. Wobble

Side Buttons

There are 8 pre-built Side Buttons:

1. Top Left
2. Top Center
3. Top Right
4. Left
5. Right
6. Bottom Left
7. Bottom Center
8. Bottom Right

Layouts

There are more than 8 pre-built Side Buttons:

1. Top Left
2. Top Center
3. Top Right
4. Fixed to Left
5. Fixed to Right
6. Bottom Left
7. Bottom Center
8. Bottom Right
9. Centered
10. Full Height
11. Full Page

How to use Slick Popup Pro in Text Editor?

When you click on the button to create the popup it gives you 4 options:

1. Multiple Popup: In this option, you can select what kind of popup you want i.e., here you can select your popup.
2. Popup Handle: By popup handle, you select the mode by which you want your popup to show i.e., a button, link etc.
3. Text: In here you can choose over what text you want to show your popup, By default we give click me.
4. HTML ID: In here if you want your html element to behave a certain way then you could give an ID and that ID will be added to the shortcode.

After you click ‘OK‘ you get
 <- This is a shortcode for a button

How does the Shortcode work?

This is a basic Shortcode: 
In the shortcode you get the following attributes:

1. “id“: the ID of the Multiple Popup
2. “htmltag“: HTML tag to use, default is ‘span’
3. “text“: text of the element, default is ‘click here’
4. “htmlid“: if you need to give a Unique ID to the HTML element

Example:
 – output: click here

How to Activate and Deactivate Slick Popup Pro dynamically?

There are many ways to Activate and Deactivate Slick Popup Pro dynamically:

1. Via Class: You can activate Slick Popup Pro by using the class “sppro–showpoup“
2. Via ID: You can activate Slick Popup Pro by using the id of the popup “sp-id”
3. Via Href or Url: You can activate Slick Popup Pro by giving the url or href element of the a tag ‘javascript:sppro_loader(‘id of the popup’)’
4. If you want unload the popup use ‘javascript:sppro_unloader(‘id of the popup’)’

Are there any filters available?

There are alot of filters available for Slick Popup Pro some of them are listed below:

1. sppro_dollar_cf7_id: You can choose which CF7 form to show on the popup
2. sppro_dollar_side_button_text: You can add custom side button text
3. sppro_dollar_choose_layout: You can add custom layout to the popup
4. sppro_dollar_popup_load_effect: You can add custom load effect to the popup
5. sppro_dollar_popup_unload_effect: You can add custom unload effect to the popup

Other options you can explore in Slick Popup Pro

There are alot of things you can do by Slick Popup Pro some of the things are listed below:

1. Change the background of the Popup:
   The background of the image is called the curtain. The black background of the popup can be modified from an image to the color of your choice.
2. Change the transparency of the Popup:
   The popup can have a transparency effect also, just adjust the transparency bar when choosing the customs colors of the popup.
3. Change the shape of the Popup:
   You can change the shape of the popup as you get to select the border radius of the popup. By experimenting with the numbers you can change the shape if the popup from a square to a circle etc. Note: This is highly not recommended as this can cause a problem with the functioning of the CF7 Form
4. Adding Image to the Popup:
   Adding an image to the Popup is quite as easy as you just need to select the image and put it in the CTA TEXT(Text Editor).
5. Adding Shortcode to the Popup:
   Yes, you can add shortcodes to popup. Just add the shortcode in the CTA Text and you are good to go. Note: We suggest using common plugin shortcodes as some shortcode might not be work with Slick Popup Pro
6. Video Popup:
   Creating a Video Popup is easy as you just have to put the embedded code in the CTA Text and you are good to go.

 

Top Asked Queries

These are the top questions that we have found to be the most reoccurring questions we are asked:

1. How to activate Slick Popup Pro on the click of the theme Button?
   There are basically 3 Ways to activate Slick Popup on the click of the theme button:
   1. Using Class=”sppro-showpopup”
   2. Using Id=”sp-‘id of the popup'”
   3. Using href or url=”javascript:sppro_loader(“id of the popup”)”
2. Only the curtain is showing and not the Popup
   While this comes very rarely this has always been a theme related issue and to double check that activates the popup and tries resizing the browser. If on resizing the browser the popup appears then it is a theme related issue.
3. Not receiving any data which is entered in the popup
   This is easily fixable if you could just recheck your mail tab in Contact Form 7.
4. Creating a Popup when you click on an Image or any HTML Attribute
   It is quite simple and the answer is the same as the one given above just use the same class, id or href or URL.
5. How to assign different popups on different buttons
   This can be done using IDs of the popups or Href/URL.
6. We mostly take up any Queries that our Esteemed Customers send us and try our best to solve them. If you have any queries then mail us at poke@slickpopup.com

[/av_textblock]

[/av_section]