Add a Popup to a Webpage
Note: We are in beta, and actively developing. If this is wrong, does not look right, or incomplete, please forgive us and use the lower-right chat and we will answer ASAP.
There are four (4) ways to add popups into a webpage.
- HTML Snippets
Add HTML snippets to a page. You can add more than one for staggered popups.
- Via Funnels
When editing funnels you can add unlimited popups to a page or post. They can be shown one after the other in pre-defined intervals…very helpful for conversion on long pages.
- Default Popup
By setting a Popup as default it will automatically be inserted in any blog post (not pages) that have no a Popup inserted selected manually.
- <a> Link Triggers
Add a simple code to any on-page <a> tag’s href attribute and Saturn’s funnels will popup that funnel on the <a> tag click. So add offers to buttons or within the text of an article.
1. HTML Snippets
On the Popup List page, there is a column to copy an HTML snippet to your computer’s clipboard. Simply choose the Popup you wish to insert and click the copy to clipboard icon to bring up a popup for both the insertion HTML and <a> tag trigger code.
An HTML snippet, like this one below will be put on your clipboard.
<span saturn-popup-id="5db85aca859a250019e1d742" delay="60"></span>
Virtually every webpage editor has an HTML option. Use that to past onto a page…anywhere as it is hidden.
You can put multiple ones on the page to have multiple popups or scroll boxes. The second one’s timer starts after the first one is closed…and any subsequent ones. They are displayed in the order they appear within the HTML page.
<span saturn-popup-id=”5db85aca859a250019e1d742″ delay=”15″></span>
<span saturn-popup-id=”65785aca859a250019e1d841″ delay=”120″></span>
The delay attribute is the number of seconds to delay the popup. The default is set in the editor, but its value can be changed here. For example the two above, the first popup shows at the 15-second mark and the second one 120 seconds (2-minutes) after the first one is closed.
2. Funnel Popups
When creating a “Content” funnel, in the Saturn application, you can add multiple popups to and content webpage.
You can then set the duration, in seconds, between the popups. Once the visitor closes one, the next if any, will popup after the set number of seconds.
You can re-order the sequence of the popups and set their respective intervals by pressing the “Edit Time & Reorder” button, see below. Drag-n-drop the popups by the name and handles on the left to reorder. Don’t forget to edit the duration.
Pro Tip: Use multiple popups spaced with longer intervals on LONG content pages. The longer a visitor is on the page, the more receptive they are likely to a targeted “Call-to-Action” and offer.
3. Default Popup
A quick-start way to get a Popup across your website is to create a default one.
When editing a Popup you can set one default for your site in the Setup area with the toggle switch (see below). The default Popup will automatically be inserted into any page, but only for pages without any already inserted in other ways.
There can only be one default. Setting a new/different Popup as the default with will unset any current default one.
Disable the default Popup on any post page with the selector shown in #1 above.
The Popups list in the Saturn Funnels app has a column HREF. Simply click any of these rows values to copy the trigger code onto your clipboard. Then past that value into any <a> tag’s href attribute field. These typically include buttons or other formatted elements that are part of all websites.
This allows you fine control and to have popups dynamically triggered by readers.