No results found. Try again with different words?

Search must be at least 3 characters.

How to Create Popups Using Spectra

Popups play a crucial role in engaging website visitors, collecting contact information, showcasing special offers, and facilitating event registrations.

For WordPress websites, integrating popups is a valuable strategy for sales and marketing.

Spectra, the ultimate page builder, offers an easy-to-use Popup Builder feature to create effective popups.

This document provides step-by-step instructions on how to create popups using Spectra.

What Is a Popup?

A popup, or popup box, is a smaller window that appears on a website to draw attention to specific content.

Examples include email subscription forms or promotional offers.

Spectra enables users to design and implement popups seamlessly.

How to Create Popup On Your Site

  1. Ensure Spectra is activated on your website.
  2. Navigate to Spectra > Popup Builder.
  3. Click on “Create Popup” at the top left.
  4. Choose between Info Bar or Popup and customize the selected option.
  5. Use the editor to add or remove blocks to tailor the popup according to your preferences.
  6. Click “Publish” to make the popup live.

Popup Settings

General Settings

Through the popup builder block, these settings control the overall behavior of the popup.

  • Popup Width
  • Popup Height
  • Overlay
  • Prevent Background Interaction: Disables background scroll and click events when the popup is visible.

Close Settings

You can configure how the popup can be closed.

  • Dismissible: Enable to allow popups to be closed.
  • Close on Overlay Click: Close popups when the overlay is clicked.
  • Icon: Choose a closing icon.
  • Icon Position: Specify where the closing icon appears in the popup (default: Top Right).

Visibility Settings

(Available in the Pro Version of Spectra)

  • Display Settings :Control where the popup appears or doesn’t.
  • Trigger Type: Configure when the popup should trigger.
    • Load: Appears as soon as the configured page loads.
    • Exit Intent: Appears when a user attempts to leave the page.
    • Element Trigger Type: Use a provided class to create a clickable element triggering the popup.


You can control the repetitive behavior of the popup.

  • Repeat Infinitely: Load the popup as many times as the trigger type is loaded.
  • Repetition per Browser: Determine how many times the popup appears in a single browser on each load.

Style Settings

You can customize the appearance of the popup.

  • Popup Style: Configure background, overlay color, border, and border radius.
  • Close Button: Adjust closing icon size and color.
  • Box Shadow: Apply a shadow to the popups.
  • Spacing Settings: Control spacing by customizing margin and padding.

We hope this document has been helpful. If you have any queries further, feel free to leave a comment below.

Build Ultra High Performance
Websites, Without Coding

Whether you are a beginner, marketer, or professional, Spectra has the tools and resources you can rely on to succeed

Get Notified When Available

Note - You can purchase the Essential Toolkit now and easily upgrade to the Business Toolkit once it becomes available.

Download is Just A Click Away!

Enter your email address and be the first to learn about updates and new features.

Get your hands on Spectra Pro

Enter your name and email address to get access to Spectra Pro.