With the pop-up forms widget any of your opt-in forms can be dynamically loaded inside a layered or modal window (what we simply call pop-up). You do this by appending a code snippet at the bottom of the pages where you want to load the popup. Note that this is not a pop-up window like the ones that may be stopped by pop-up blockers. It is a layer added on the existing window content.
You have 2 methods
iFrame: appends a layer and loads an iframe inside.
Modal: Uses Bootstrap modals. We load a custom version of Bootstrap that only affects elements in a div with the class "bootstrap_nvm". Styling may be affected by the existing css of the host page.
Each method has its own css file where you control the styling. This page demonstrates the 1st method.
You can have 3 different pop-up effects
Exit: when the visitor is about to leave your page by moving the mouse outside the page's body.
Slide-in: it loads periodically at the bottom right corner of your page. Not available for the 2nd method.
On-time: it loads after x minutes the visitor stays at the page.
In addition, a pop-up can be triggered with:
By adding a class="nsl_pop" to any hyperlink, text or phrase.
By adding onclick or onmouseover events to hyperlinks, div, span elements and buttons (text, paragraph, image etc). See the examples
Configuration options
Set the number of times to show the popup. The popup will stop showing if the visitor completes the form and subscribes. But in order to avoid being annoying you can limit the number of pop-ups. E.g. don't pop more than 5 times.
Minutes passed until the 1st pop-up shows.
Minutes passed between 2 consecutive pop-ups.
Examples: adding a class or an onclick/onmouseover event
Mouse over an element (span, div, image): Mouse over
<span onmouseover="nvPopUp(8);">Mouse over</span>
In this case we can assign different forms to different elements.
11 is the form ID and https://www.nuevomailer.com is the redirection URL when the user closes the popup or presses the escape key.
The code
You will find this file that explains in detail all options and features inside your nuevoMailer package. You don't really need technical skills but basic copy-paste work. The code snippet should be included in all pages where you want to trigger the popup. You can include the snippet into a footer file shared by all your website pages. If you want to load a different form by page then add and change the variable idForm for that page. Here is a sample:
<script language="JavaScript" type="text/javascript">
var nvmUrl="https://www.yourdomain.tld/mailer";
var idForm=9;
var maxPopTimes = 50;
var popTimeLapse = 0.2;
var nextPopTimeLapse = 2;
var nvPopEffect='ontime';
var script = document.createElement('script');
script.src = nvmUrl+'/admin/scripts/nvPop9.js';
script.async = true;
var firstScript = document.getElementsByTagName('script')[0];
firstScript.parentNode.insertBefore(script, firstScript);
</script>
Other features
It's responsive. Resize your browser and test the examples again. When the form is larger than the screen different styles and sizing is applied.
Gives you many styling options. In this page we use standard nuevoMailer forms and the default css files. The background comes from a banner. You can put your own banners in the folder /subscriber/banners/.
You can optionally use cookies to stop showing pop-ups when an opt-in is recorded. Expiration is set to 30 days but that can also change if needed.
It works also on cross domain installations; when nuevoMailer is installed in a different domain from the one you want to load the pop-ups. A very nice hack (with cookies) for enabling this set-up is included in your package.
Order
.com
