General settings

[wpremark preset_name=”default-warning” icon_show=”1″ icon_image=”warning-circle-regular” icon_width=”32″ icon_height=”32″ icon_indent=”16″ background_show=”1″ border_top=”0″ border_right=”0″ border_bottom=”0″ border_left=”0″ border_width=”2″ shadow_show=”0″ shadow_x=”0″ shadow_y=”5″ shadow_blur=”10″ shadow_stretching=”-5″ shadow_opacity=”0.3″ title_show=”0″ title_bold=”0″ title_italic=”0″ title_underline=”0″ title_uppercase=”0″ title_font_size=”18″ title_line_height=”1.5″ text_bold=”0″ text_italic=”0″ text_underline=”0″ text_uppercase=”0″ padding_top=”20″ padding_right=”20″ padding_bottom=”20″ padding_left=”20″ margin_top=”20″ margin_right=”0″ margin_bottom=”20″ margin_left=”0″ border_radius=”5″]
When testing or adjusting your settings, don’t forget to clear your site cache (if you have caching plugins enabled) and your browser cache. This is necessary because popup display data is stored in cookies.
[/wpremark]

Detailed walkthrough video of all settings:

[omnivideo title=”” youtube=”https://youtu.be/22ahf1M1TGM” rutube=”https://rutube.ru/video/0cc0a12bf7216053becb0d57566016e6/?r=plwd” vk=”https://vkvideo.ru/video-137277177_456239059″ poster=”auto” dzen=”https://dzen.ru/embed/v-xfeGN0cmwI”]

Popup Position & Size on the Page

You can align the popup to any of 9 positions on the screen — corners, edges, or center.

You can set the popup’s width and height in pixels (px) or viewport units (vw, vh).

Re-show After

Set how long after a visitor closes the popup it will be shown again. For example, you can show a social media signup popup once per month.

If set to 0, the popup will show only once. After closing, a cookie will be set for 10 years to prevent it from showing again.

Disable Closing Popup by Clicking Overlay

The popup has a background overlay — usually a darkened layer that dims the site behind the popup (configured in the Appearance tab). By default, clicking on this overlay closes the popup. Enable this option to prevent closing by clicking the overlay.

Disable Closing Popup with ESC Key

Prevent users from closing the popup by pressing the ESC key. Use this to keep the user’s full attention on the popup.

Disable Page Scrolling

You can disable page scrolling while the popup is open until it’s closed. If your popup covers most of the screen, disabling scrolling is recommended. For small popups in a corner that don’t interfere with viewing, keep scrolling enabled.

Auto-close Popup After

If you want the popup to appear only temporarily, set it to automatically close after a specific number of seconds.

Device Display Settings

You can choose to show each popup only on certain devices — for example, mobile only or desktop only.

Appearance

Here you’ll find nearly all design-related settings for the popup.

Padding

Set the padding inside the popup — the space between the popup edges and its content — in pixels.

Border

Configure the popup border: thickness (px), style (solid, dashed, dotted, double), color, and corner radius.

Shadow

Adjust shadow settings: horizontal offset (X), vertical offset (Y), blur, spread, color, and opacity.

Vertical Content Alignment

Set vertical alignment of the popup content. This works when the popup height is larger than the content height.

Text Color

Set the color of text and links inside the popup. For custom colors on specific parts of the text, use the Content tab’s visual editor.

Animation

Choose the animation effect for the popup entrance. See all animation options here.

Background

Background Color

Set a background color for the popup.

Background Image

Add a background image to the popup. You can adjust its position, repeat behavior, and size.

• auto — image displays at its original size.
• contain — image scales to fit inside the popup without cropping.
• cover — image scales to cover the entire popup; some parts may be cropped.

Darken Background Image

If the background image is busy and text is hard to read, you can add an overlay to darken it. Choose overlay color and opacity.

Icon

You can add an icon next to the popup content.

Icon width, height, and spacing between icon and content are set in pixels.

Overlay

This is the dimmed layer behind the popup that helps highlight it on the site. You can adjust color and opacity. Works well with “Disable Page Scrolling” to keep user focus on the popup.

Close Button

You can delay showing the close button to prevent users from closing the popup immediately. Setting delay to 0 shows the button right away.

Choose the close button icon, position (inside or outside the popup), distance from the edge, size, and color.

Content

This tab contains the popup content settings.

The first field is the WordPress visual editor where you can add and style your content.

Buttons

Here are shortcode examples for quick copying and adding buttons to your content. Buttons can act as links or close the popup. Customize colors, padding, border-radius, and more. See button shortcode details.

Countdown Timer

Shortcode examples for countdown timers you can add to your content. Set minutes, hours, days, target date, and appearance settings. See countdown shortcode details.

Custom CSS

#{{id}} .mypopup-body p {
  font-weight: 800;
  }

#mypopup_9232fe81225bcaef853ae32870a2b0fe .mypopup-body p {
  font-weight: 800;
  }

HTML Code

If you’ve ever tried adding raw HTML into the WordPress visual editor, you know it often strips out or breaks certain code. This is a common issue with things like ad scripts, embedded maps, iframes, or custom markup.

To include this kind of code in your popup, you can create as many shortcodes as you want using [mypopup_html id=X], then insert them directly into your popup content.

For example, in the screenshot below we created two separate HTML shortcodes—one outputs custom markup, the other includes an SVG image using a tag:

Once you’ve created these shortcodes, just place them into the Content field to render the HTML in your popup.

[wpremark preset_name=”default-warning” …]**Important:** Avoid adding Yandex advertising code to popups using this field. According to the Yandex Advertising Network Participation Rules, showing banner ads in overlays/popups is restricted:

3.2. When placing ad blocks that overlay page content (overlay-blocks), the following requirements must be met:
3.2.1. Overlays are not allowed on desktop versions of sites if they cover page content.
3.2.2. For overlays on mobile, the following applies:
3.2.2.1. Allowed only on screens between 320 and 420 px wide.[/wpremark]

Social Networks

Use this section to add links to your social media profiles.

[wpremark preset_name=”default-warning” …]**Note:** Social icons won’t automatically appear in your popup content. Use the shortcode [mypopup_social_buttons] to place them wherever you want.[/wpremark]

You can customize the button style (square or round), icon size, and spacing between icons.

All social media URLs must include the full address with protocol (e.g., https://vk.com/wpshop).

Hide Links Using JS

If you don’t want your popups to include direct outbound links to social media sites, you can enable a setting to hide them using JavaScript. This way, icons will still display and work through JS without exposing direct links. For most use cases, it’s recommended to keep this option enabled.
——

Social Widgets

Widgets from social networks.

Facebook

Displays activity from a Facebook profile page.

In widget settings, enter the full profile URL with protocol (e.g., https://www.facebook.com/wpshopbiz).

The Facebook widget is not added automatically. Use the shortcode [mypopup_social_widget type="fb"] to display it where you want.

VK (VKontakte)

Displays activity from a VK group.

Enter only the group ID (without protocol or full URL), for example, 137277177. How to find the group ID: here or here.

The VK widget is not added automatically. Use shortcode [mypopup_social_widget type="vk"] to place it where needed.

Odnoklassniki

Displays activity from an Odnoklassniki group.

Enter only the group ID (e.g., 123456789). Find your group ID here.

The Odnoklassniki widget is not added automatically. Use shortcode [mypopup_social_widget type="ok"] to display it where you want.

Twitter

Displays activity from a Twitter profile.

Enter the full profile URL with protocol (e.g., https://twitter.com/wpshopbiz).

The Twitter widget is not added automatically. Use shortcode [mypopup_social_widget type="tw"] to add it where needed.

Pinterest

Displays activity from a Pinterest board.

Enter the full board URL with protocol (e.g., https://www.pinterest.com/pinterest/official-news).

The Pinterest widget is not added automatically. Use shortcode [mypopup_social_widget type="pn"] to display it where you want.

Displaying Posts

You can display posts inside the popup window.

Posts are not added automatically. Use shortcode [mypopup_output_posts] to display them where needed.

Sorting by views works if posts have a “views” field (most view count plugins and themes support this).

You can also specify which post IDs to include or exclude, and which categories to include or exclude.

Filling the post list

If the fields “Post IDs to include”, “Post IDs to exclude”, “Category IDs to include”, or “Category IDs to exclude” are empty or return fewer posts than requested, the rest will be filled based on the sorting order.

Display Rules

This section lets you set conditions for when and where your popup will appear.

Triggers: When to Show the Popup

Show after X seconds

You can display your popup immediately on page load or after a short delay. Often, it’s better to wait a few seconds to avoid annoying visitors as soon as they arrive.

Show after scrolling X% of the page

Trigger your popup after a visitor scrolls a certain percentage of the page. For example, you might show a discount offer once they reach 50% of the content.

Show when scrolling to an element

Sometimes you want your popup to appear when a user reaches a specific section of your page. For example, you might show it when they scroll down to the comments block.

If you’re targeting an element by ID, use #comments (with the # symbol). If by class, use .comments-area.

[wpremark …]You can use any jQuery selector as the value.[/wpremark]

Show after X seconds of inactivity

Display the popup if the user is inactive—no mouse movement or keyboard input—for a certain number of seconds.

Show on exit intent

Show your popup when the user moves their mouse toward the top edge of the browser window, indicating they may close or switch the tab.

Show on click

Trigger the popup when a user clicks on a specific element. This trigger only works if other display rules also allow it.

There are two ways to set this up:

1. Use your own custom script. The simplest approach is adding onclick with the myPopupShow() function and your popup’s ID. For example:

   <button class="button" onclick="myPopupShow('mypopup_38ca89564b2259401518960f7a06f94b')">Button</button>

2. Use a CSS/jQuery selector, similar to the “scroll to element” option.

Where to Show the Popup

[wpremark …]If you don’t set any display rules in this section, the popup won’t show at all. By default, it’s set to show on all pages.[/wpremark]

Here you can choose where your popup appears (or where it should be hidden).

[wpremark …]Rules higher in the list take priority. In other words, they’re processed from bottom to top.[/wpremark]

• On all pages
• On the homepage — determined using is_front_page(). Works whether your homepage shows latest posts or a static page.
• In posts — target individual blog posts (post type: post). You can specify which posts.
  • Posts in categories — target posts belonging to specific categories.
  • Posts with tags — target posts with specific tags.
  • Posts in taxonomies — for custom taxonomies, you can target posts within them.
• On pages — target standard pages (post type: page). You can specify which pages to include.
• In post types — target custom post types. You can specify individual posts.
• Categories — target the category archive pages themselves (not posts in them).
• Tags — target tag archive pages (not posts with those tags).
• Taxonomies — target custom taxonomy archives (not the posts in them).
• Search results page — show on WordPress’s built-in search results.
• 404 page — show on any WordPress 404 error page.
• URL pattern / RegEx — target any part of the URL (relative path only, without protocol/domain) using strings or regular expressions. For example: utm_source=yandex.

Presets

Ready-made popup templates you can enable with a single click.

Currently, only predefined presets are available—you can’t save your own yet. Have an idea for a great popup design, or created one yourself? Reach out to our support team and we might add it!

Import & Export

Use this section to import or export your popups—for example, to move them between sites or duplicate them on the same site.

Export

Click **Export Data** to copy all your popup settings as an encrypted code. You can then paste this code into the Import field on another site or into a new popup on the same site.

You can choose whether to **include display rules** in the export. When moving between sites, you may want to exclude them, since posts and categories often differ. This helps avoid confusion.

Import

Paste previously exported code into the Import field and click **Import Data**. All settings will be applied automatically without reloading the page.

Loading Styles, Scripts, and Popups

The plugin loads its default styles and core script on all pages. Popup content itself is requested asynchronously. The server returns eligible popups based on the **Where to Show** rules, and the script then displays them based on the **Triggers** you’ve set.