More Granular Control on Outer Space of Widget in Poper

More Granular Control on Outer Space of Widget in Poper

Poper offers more granular control over the spacing around your popups, allowing you to precisely position them on your webpages. This guide will show you how to utilize the updated "Margin" settings.

Refined Outer Space Control:

Access Your Poper Popup:

Begin by logging in to your Poper dashboard and opening the specific popup you want to modify.

Locate "General Settings":


In the popup editor, look for a section labeled "Global Settings" or similar (refer to your Poper version for exact terminology). This section typically houses various configuration options for your popup's overall appearance and behavior.

Margin


Within the "General Settings," find an option labeled "Margin." This setting controls the amount of space surrounding your popup on all sides.

Unlock Granular Control:

In older Poper versions, the "Margin" slider might have adjusted the space uniformly around the entire popup. Newer versions offer more precise control. Click the split icon located to the right of the "Margin" slider.

This will expand the option to reveal individual controls for:
Top
Left
Right
Bottom

Setting Perfect Spacing: 


Use the sliders for each direction (top, left, right, and bottom) to adjust the spacing around your popup. Drag the sliders left to decrease space or right to increase it. Utilize the live preview window or publish your popup to see the visual impact of your adjustments.

Save and Test:

Save Your Changes: 


Once you've achieved the desired outer space for your popup using the individual margin controls, click the "Save" button to apply the changes.

Test Thoroughly:

Preview or publish your popup and visually confirm that the spacing around the popup looks exactly as intended on different screen sizes and devices (if possible).

By leveraging the new granular controls within the "Margin" settings, you can ensure your Poper popups are perfectly positioned and visually aligned on your webpages, creating a more polished and professional user experience.


    • Related Articles

    • How to rename Popup / Widget

      Access Your Poper Dashboard: Log in to your Poper account and navigate to the main dashboard. Open the "Campaigns" Tab: Click on the "Campaigns" tab on the left-hand side of your dashboard. This will display a list of all your created campaigns. ...
    • How to create a Widget in Poper from Scratch?

      Teasers, also known as nudges, are small, non-intrusive popups that encourage users to interact without disrupting their experience. Follow this guide to add and configure teasers in your Poper popups. Steps to Add Teasers/Nudges to Popups Step 1: ...
    • Auto-Scaling in Poper: Ensuring Optimal Popup Display

      Poper's auto-scaling feature is designed to prevent popups from becoming excessively large and overflowing the visitor's screen. This ensures a seamless user experience by automatically adjusting the popup's size to fit within the available space. ...
    • How to Make Popups Rounded in Poper

      Creating a popup with rounded corners can give your popup a softer, more modern look. Here's how you can adjust the border radius to make popups rounded in Poper.ai: 1. Navigate to Your Popups: - Log in to your Poper.ai account. - From the dashboard, ...
    • Show or Hide Popups/Widgets on Specific Pages with Poper

      Poper allows you to precisely control where your popups appear on your website. This guide will walk you through the process of displaying or hiding popups on specific pages using the page filtering feature. Setting Up Page-Specific Popup Display: ...