In this article, we explore the various use cases and purposes of using pop-ups on your website Home page.
When used appropriately, pop-ups can be a fun and powerful tool to engage your website visitors, improve user experience, and achieve your business objectives.
By carefully considering the purpose and timing of pop-ups, designing them with user-friendliness in mind, and offering value to your visitors, you can harness their potential to increase conversions, grow your email list, and enhance overall user satisfaction.
Remember, a thoughtful approach and respect for your audience's browsing experience are key to successfully leveraging the power of pop-ups.
Create a New Popup
To create a new popup on your website, click on the Pages & Popups menu > Add New > Popup
Select one of our various pre-designed popups to edit and style according to your needs.
Popup Settings
Popups on CCK is feature rich, and updating and customizing them is really easy to do.
Start by setting the Popup position. Click on Popup Settings on the editor menu and select the desired position where you would like your popup to be:
Next, you can give a unique name to the new Popup:
You also have various options that let you choose when you would like your popup to show, for example:
After time on a page:
Show on page scroll:
Show the popup when someone wants to exit a page, and select whether you want the popup to appear on mobile devices:
You can also set the behaviour of the popup when it is closed by a website visitor as shown below:
There are a variety of animation options to choose from as well, as shown in the screenshot below:
Popup Styling
To customize the overall styling of your popup, click on the Styling icon in the image editor.
Here you can:
Select the layout option of your popup.
Change the background.
Change the overlay and button colours.
And change the padding size.
Popup Text and Form Settings
The popup works the same as any other page or block on CCK. Simply click on the column or block to update the text and its styling as shown below:
To update the form fields and settings, click on the form to edit as shown below:
π‘ To learn more about Forms, click here to read the Form Widget Article.
Customizing Backgrounds on Popups
To change the background of your popups, hover over the image set as the background and click on Change Background:
You can choose to have an image as a background or only a solid colour. To remove the image, click on the Trash icon and select the Background Color
If you choose to have an image as the background, there is an option to set the image position:
You also have the option to set the image to repeat the background image:
Popup Show On Settings
To determine where this new popup should be displayed to your visitors, click on the Show On option on the editor menu of the popup, select the page or pages you would like the popup to appear on and click Confirm:
Finally, once you have created your popup and customized the styling and settings, make sure to test your popup by signing up as a user.
Funnel Popups
Another way to use popups on CCK is to add them as a funnel step on your funnels.
To set this up, head over to one of your funnels and open up the funnel steps.
In the example below, we are using a popup on the Video Series Funnel for an Opt-in option:
To add a popup as a new step, head down to the last funnel step, click on Add New Step and select the Popup option:
Once the popup has been created, you can then drag the popup to the correct funnel step you wish the popup to be in.
Lastly, make sure the button on the page you are linking the popup to has the correct link settings. To do this, click on the button, select the Link icon and set the link to be Next Funnel Step (recommended). As always, make sure that the order of your funnel steps are correct: