# Popups

A box that pops up on your website with a newsletter signup, a form or a short message.

Source: https://docs.lookoutridgeit.com/plugins/popups/

Every website has this screen. An Editor can use it, not just an Admin.

A popup is a box that opens on top of a page after a visitor has been there a
moment. It can hold one of four things:

- your **newsletter signup**,
- a **form** you built,
- a **feedback form**,
- or a short **message with a button**, such as "Our new menu is out. See the
  menu."

Go to **Plugins**, open the **Site Layout** group, and click **Popups**.

Until you add one, your website shows no popup at all.

## Adding a popup

Click **New popup**. A form called **Add a popup** opens. It has three parts.

1. Check that **Enabled** has a check mark. With it off, the popup never shows,
   but it stays on your list.
2. Type a **Name**, such as "Spring newsletter". Only you see it, on the list.
3. Set the dates, if you want them. See the next part.
4. Under **Content**, pick **What it shows**, then fill in the boxes under it.
5. Under **Where and when**, pick the **Position**, then say when it opens.
6. Say which pages it may show on, if not all of them.
7. Read it all once more.

**Warning**
There is no draft here. The moment you click **Save**, the popup is live on
your website, if it is enabled and its dates have come. Visitors get it on the
next page they open.

8. Click **Save**.

You are taken back to the list, and you see **Popup added.** **Cancel** leaves
without saving.

## Dates

**Start date** is the first day it can show. Leave it blank to start right
away.

**End date** is the last day it can show. Leave it blank to keep it going
until you turn it off.

Both days count. The form tells you what day it is on your site. If the end
date is before the start date, the form warns you that the popup can never
show.

## What it shows

Pick one under **What it shows**. Every kind has a **Heading** and a **Text**
box. The heading sits at the top. The text is a short line under it, in plain
words.

| Choice | What else you fill in |
| --- | --- |
| **Newsletter signup** | **Button label**, the words on the button. Blank means **Subscribe**. |
| **Form** | **Form**: pick one of the forms you built in [Form Designer](https://docs.lookoutridgeit.com/plugins/form-designer/). |
| **Feedback form** | **Feedback form**: pick one of your published forms from [Feedback](https://docs.lookoutridgeit.com/plugins/feedback/). |
| **Message with a button** | **Button label** and **Button address**. The button only shows when both are filled in. |

**Form** and **Feedback form** are only in the list if your website has those
add-ons.

For **Button address**, type a page on your own site that starts with a slash,
such as `/menu`. Or type a full web address that starts with `https://`. The
form warns you about anything else, and drops it when you save.

### When a popup has nothing to show

A popup never opens if what it holds cannot show. That happens when:

- it is a newsletter signup, and no email company is set up on the
  [Newsletter](https://docs.lookoutridgeit.com/plugins/newsletter/) screen yet,
- the form it uses was unpublished or deleted,
- or the add-on behind the form was turned off.

Nothing breaks. The visitor just never sees it. The list cannot spot these
three, so it may still say **Live**.

The list does catch a popup with no form picked, or a message with no heading
and no text. It marks those **Needs content**.

## Where it opens on the screen

Pick one **Position**.

| Position | What the visitor sees |
| --- | --- |
| **Center of the screen** | A box in the middle. The page behind it goes dim until they close it. |
| **Bottom right corner** | A small card in the corner. The page stays usable. |
| **Bottom left corner** | The same, in the other corner. |
| **Bottom, centered** | A card along the bottom, in the middle. |

On a phone, every position becomes a panel along the bottom of the screen.

## When it opens

**Show it** sets what makes it open.

- **After a wait** opens it after a number of seconds on the page. Set it with
  **Wait**. It starts at 5. Pick 0 to open it right away.
- **After scrolling down the page** opens it once the visitor has read part
  of the page. Set how far with **Scrolled**, as a percent. It starts at 50,
  which is halfway. A page too short to scroll opens it right away.

**Page views first** holds it back until a visitor has seen a few pages. It
starts at 1, the first page they see. Set it to 3, and they see it on their
third page. It only counts pages that can show a popup.

### It waits for the cookie banner

Some websites show a cookie banner to new visitors. A popup never opens on top
of it. It waits until the visitor clicks **Accept** or **Decline**, then
opens. [The cookie banner](https://docs.lookoutridgeit.com/plugins/analytics-and-cookies/#the-cookie-banner)
explains when it shows.

## How it goes away

A visitor can close the popup with its close button. They can also press
**Esc**, or click the dim part of the page around a center popup.

**Stay closed for** is how many days it then stays away for that visitor. It
starts at 30. Pick 0, and it only stays closed until they open another page.

Some visitors do what you asked. They sign up, send the form, or click the
message's button. They never see that popup again. After a signup or a sent
form, the popup shows its thank-you for a moment, then closes on its own.

This is all kept in the visitor's own browser. A new phone, or a cleared
browser, sees it as new.

## Which pages it shows on

Two boxes decide this. Type one address per line, each starting with a slash.

- **Only on these pages**: leave it empty for every page. Type `/blog` to
  show it only on your blog. That covers `/blog` and every page under it.
- **Never on these pages**: pages it must skip, such as `/contact`. This box
  wins over the other one.

A popup never shows on checkout, search, booking, testimonial or account
pages.

There is one way onto a customer's account page: type `/account` in **Only on
these pages**. Then it shows to customers who are signed in, on their account
page. Add the tab, such as `/account#orders`, for one tab only.

## The list of popups

Each popup is one row. The columns are **Status**, **Name**, **Shows**,
**Position**, **When** and **Dates**. Click a name to open that popup and
change it. Click **Save** when you are done. You see **Popup saved.**

The **Status** column tells you what the public can see:

| Status | What it means |
| --- | --- |
| **Live** | It can show today. |
| **Live, but below** | It could show, but a popup higher up covers every page first. |
| **Scheduled** | Its start date has not come yet. |
| **Ended** | Its end date has passed. |
| **Off** | **Enabled** is off. |
| **Needs content** | No form is picked, or a message has no words. |

You can keep up to 10 popups.

## Only one popup per page

A page shows one popup at most: the first one on the list that is live and
allowed on that page.

Use the **↑** and **↓** arrows on a row to move it up or down. The order
changes at once. You see **Order updated.**

So you can set up a few. Put a blog-only popup at the top, and an everywhere
popup under it. Blog readers get the first. Everyone else gets the second.

## Deleting a popup

**Warning**
Delete is permanent. There is no Trash for popups, and nothing brings one back.

If you only want it gone for now, open it and take the check mark off
**Enabled**. It stays on your list for next time.

Click **Delete** on the popup's row. Your browser asks you to confirm. You see
**Popup deleted.** It is gone from your website on the next page load.

## When you cannot see your own popup

Look at its **Status** first.

If it says **Live**, you may have closed it already. Your browser remembers
that. Open your website in a private window to check. That is
**Cmd+Shift+N** on a Mac, or **Ctrl+Shift+N** on Windows, in Chrome.

Still nothing? Check the timing. With a wait of 30 seconds, you have to stay
on the page that long. With **Page views first** above 1, you have to open
that many pages first.
