How to create your first pop-up campaign

This guide will walk you through creating a pop-up campaign in PowerPop from scratch. You’ll learn how to build the campaign, understand how it functions, and how to save and publish it.  

Create a New Campaign

First, create a new campaign in PowerPop. If you are unfamiliar with this process, please refer to the step-by-step tutorial here: Creating a New Campaign in Powerpop.

Open the Editor

1. After creating the campaign, click the brush icon to enter the Editor.

Inside the editor, you’ll see:

1. Main Canvas – This is where you build the full-size pop-up.

2. Sticker Canvas – A smaller version (like a button) shown after the pop-up is minimized.

Pop-Up Sticker

Want to keep the pop-up accessible after a user minimizes it? Use a sticker.

Here’s how it works:

• When a user clicks a button with the “Minimize Pop-Up” action, the pop-up hides from view.
• A sticker (small clickable element) appears in the corner of the screen.
• When the user clicks the sticker, the pop-up opens again at the same step.

To enable the sticker:

• Open the Sticker Canvas in the editor (next to the Main Canvas).
• Customize how the sticker looks and where it's placed.

This makes your campaign less intrusive while keeping it available at any time.

PowerPop Campaign Setup Guide

Step 1: Build Your Pop-up Design

Start by customizing the look and content of your pop-up. This is your first step toward creating an engaging experience for your visitors.

1. Insert the Main Image

Insert two rows, then drag an image into the content section on the left side of the row. Adjust the block size to properly fit the image — you can further customize it based on your preference.

2. Add Content (Title and Subtitle)
   • Title: Keep it short and eye-catching. Example: “Get 10% Off Your First Subscription!”
   • Subtitle: Provide a little more detail. Example: “Sign up to receive your discount code instantly.”

3. Email Input Field

To add an email field, drag the Email Input element onto the main canvas. This component comes with a predefined structure that includes an email input field, a consent checkbox, and a button. You can freely reposition and style each part to match your design needs.

• Click the Settings icon to customize its configuration—such as the label, placeholder text, and validation rules. For a more detailed guide on configuring the email field, refer to this help article: Editor Email Input Section

6. Insert a Close Button

• Add an easy-to-spot close (X) icon or button in the corner, allowing users to exit the pop-up.

Configure the Close Button settings to perform the Close action. If you’d like to learn more about how each action works, refer to this article: Editor Close Button Section.

Preview & Adjust

Before moving on:

• Switch to Desktop, Tablet, and Mobile views

  Check that:

  • Image resizes properly
  • Text doesn't overlap or cut off
  • Buttons are clickable and legible
  • Overall layout looks clean and user-friendly

Tip: Optimize spacing and font sizes per device type. Use padding and margins wisely for clean separation between elements.

Step 2: Successful Conversion (Thank You Message)

This step is shown after the user successfully submits the form (e.g., subscribes with their email).

1. Click on Step 1 in the builder and duplicate it to create a new step.

2. Remove unnecessary elements such as:
   • Input field
   • CTA button
   • Checkbox

3. Insert a Success Message

• Use clear and friendly text to confirm success. Example:

• Text: “🎉 Thank you! Your email has been successfully registered.”

Add a "Close" Button and set the action to End this Campaign - allowing users to dismiss the message after completing the conversion.

Step 3: Conversion Blocked (Duplicate Email or Error)

This step is displayed when the user tries to submit an email that is already registered or another condition prevents conversion.

1. Click on Step 2 and duplicate it to create Step 3.

   Update the Message Text

   Replace the success message with:

   • Text: “⚠️ Your email is already registered.”

     Keep the tone informative and polite.

2. Add a Close Button

   Let users exit or refresh the experience.

Once you’ve completed Steps 1, 2, and 3, you can save your campaign to keep all your changes. After saving, you're ready to move on to the workflow setup.

How the Workflow works

Here’s a clearer and more polished version:

Every campaign in PowerPop follows a workflow, which determines what visitors see and what happens after each interaction. With the settings available in each content block, you can easily modify and control this workflow.

Now you're in the workflow view - this is where you build and connect the different steps of your campaign.

Example Workflow in PowerPop

This shows how a visitor moves through steps and stages in a typical PowerPop campaign.

Stage 1: Initial Run

• Event: Campaign Reopened

  Action: Display Popup – Step 1

  Next Steps:

  • Internal Error During Campaign: Remain in Stage 1
  • Campaign Minimized: Transition to Stage 2
  • Conversion Blocked: Transition to Stage 4
  • Successful Conversion: Transition to Stage 3

Stage 2: User Minimized Campaign

• Event: Campaign Minimized

  Action: Display Sticker – Step 1

  Next Step:

  • Campaign Reopened: Return to Stage 1

Stage 3: Successful Conversion

• Event: Successful Conversion
• Action: Display Popup – Step 2

Stage 4: Conversion Blocked

• Event: Conversion Blocked
• Action: Display Popup – Step 3

You can build as many steps as you need depending on the journey you want.

What You Can Do in Workflow

PowerPop's workflow editor lets you fully control the sequence of steps your visitors go through. Here's what you can do:

Add Stage - Use this to create additional screens in the user journey, such as:

• A promo code reveal step
• A multi-question survey
• An exit intent message

Connect Steps - Set up what happens when users:

• Click a button
• Submit a form
• Minimize the pop-up

To connect steps:

1. Click on a button or form field in the editor.
2. Go to Action Settings.
3. Choose the action:

Once the workflow is complete, you can proceed to save it.

Save and Publish

When you're ready to save your campaign, click the Save Campaign button. You’ll see these options:

• Save Campaign (top right) – Saves all the changes you’ve made to your campaign.

• Save as Draft – Use this if you're not done yet. It saves your popup but doesn’t show it on your website.

• Save and Publish – Use this when your popup is ready. It saves and shows the popup to your website visitors.

• Save and Enable Preview – Use this if you want to test the popup first. It saves it and lets only you see it on the site.

• Exit Editor Without Saving – Use this if you don’t want to keep any changes. It closes the editor and discards everything you changed.

Creating a pop-up campaign in PowerPop is a straightforward process once you understand the steps—from designing your pop-up, adding functional elements like email input and close actions, to configuring the workflow that determines your visitor’s journey.

By following this guide, you’ve learned how to:

• Build and design a multi-step pop-up campaign
• Customize actions, content blocks, and user experience
• Set up a workflow that controls how each step behaves
• Save, preview, and publish your campaign with confidence

Once everything is configured, review your campaign, test the user flow, and publish it when ready. With the right setup, your PowerPop campaign can effectively capture leads, boost conversions, and enhance user engagement on your website.

Want to learn more about PowerPop?

Check out how to create a Black Friday Discount Code Promo →