Content

The centered pop-up blocks the page until it is closed. The slide-in and the corner card leave the page usable.

Plain text only. Anything you type is shown exactly as written, including angle brackets.

Must start with https://. Squarespace: in the Media library or an Image Block, open the image and copy its address (right-click the image, then "Copy image address"). Leave empty for no image.

Leave empty if the image is purely decorative.

What it does

A full https:// address, a page on your own site such as /contact, a #anchor, mailto: or tel:.

Please read: this snippet cannot collect or store email addresses. It only shows a form that sends the address to your email service (Mailchimp, ConvertKit, MailerLite and similar). Copy the form action and the email field name from the embedded-form (HTML) code your service gives you, paste them below, then submit a test sign-up yourself and check that it arrives in your list.

The action="..." address from your service's embedded form code. Must start with https://.

The name="..." of the email input in that same code. Mailchimp uses EMAIL, MailerLite uses fields[email], ConvertKit uses email_address. Check yours rather than assuming.

Some services need extra hidden inputs from their embed code (Mailchimp has an u, an id and a spam-trap field). Add each as name=value on its own line. Up to 10.

The form opens your email service in a new tab. The pop-up cannot tell whether the sign-up succeeded.

When it appears

Tick one or more. The pop-up opens as soon as any of them happens, and only once per page view.

Pages that are too short to scroll never reach this trigger.

Fires when a mouse pointer leaves through the top of the window. It does nothing on phones and tablets.

For example .open-popup or #newsletter. Only letters, numbers and . # [ ] = " ' : > + ~ , * ^ $ | are accepted. The click always opens the pop-up, ignores the frequency setting below, and stops the element's own action (such as following a link).

How often

0 means every page view. The visitor's browser remembers when it last showed. If the browser blocks storage, it simply shows each time.

Style

60%

14 px

440 px

Always off for visitors who ask their device for reduced motion.

Credit

A small, visible "Widget by …" link. Thanks for keeping it, you can turn it off.

Live preview

The preview ignores your timing rules and shows the pop-up straight away. Forms and buttons are switched off here. Use Re-open preview to see the entrance animation again.

Your code

Fix the items above to generate your code.

How to add it

Squarespace

  1. Open Settings → Developer Tools → Code Injection (called Advanced in older versions). Code Injection depends on your plan, so check yours.
  2. Paste the code into the Footer box and save. It then runs on every page.
  3. View your live site to see it. The Squarespace editor may not show sitewide code.

Any other website

  1. Paste the code just before the closing </body> tag, or into your site's custom code or footer scripts area.
  2. Paste it once only. If it ends up on a page twice, the second copy does nothing.

After saving, open your live site in a private window and check the timing. If you use the email form, submit a real test sign-up and confirm it reaches your list. The code is self-contained: it makes no network requests of its own, loads no libraries and sends nothing anywhere until a visitor submits the form.

Runs in your browser. Nothing you enter is uploaded or stored.

How it works

Four steps. No plugin.

01

Write the popup

A heading, text, an optional image, and a button or email field.

3 minutes
02

Choose when it appears

After a delay, after scrolling, on exit intent, or when someone clicks a button you choose.

1 minute
03

Copy the snippet

One block of code with the styles and script included.

10 seconds
04

Paste it into Code Injection

In Squarespace, open Settings, Developer Tools, Code Injection (it may be under Advanced in older versions) and paste it in the Footer box. Check your plan includes it, then view the live site.

2 minutes
Questions

Questions about popups.

Straight answers about this tool. If yours isn't here, ask me directly.

Average response·< 1 business day

Does it collect and store emails?

No. It cannot store anything itself. The email field sends the visitor to your email service (Mailchimp, MailerLite, ConvertKit and similar) through the form address from your service's embedded form code. Test a signup before you rely on it.

Where do I find the form address?

In your email service, create an embedded or HTML form and copy the form's action address and the email field name from its code.

How often will it show?

You choose. It can show on every page view, or stay hidden for a number of days after it is closed. That uses browser storage, and if it is blocked it simply shows again.

Is it accessible?

The centered popup is a proper dialog: focus moves into it and stays there, Escape closes it, and focus returns afterward. The corner cards leave the page usable behind them. Keep the content short, and test it on your phone.

Will Google penalise popups?

Google can treat intrusive popups on mobile as a poor experience. Delay it, keep it easy to close, and avoid covering the whole screen right after the page loads.

What is the credit link?

A small, visible link at the bottom of the popup that points back to this site. It is on by default and you can switch it off. It is marked nofollow.

The hosting I use

I host my own sites on Hostinger.

In my experience it's one of the best hosting options for small business websites, and it's the one I suggest. If you sign up through my link, I earn a small commission at no extra cost to you.

Check Hostinger plansAffiliate link
Free tools, plus a free website audit

Want help with the rest of your website?

These tools are free to use. If your site needs more than a popup, I design and build custom websites for small businesses, and I offer a free audit that shows you what to fix first.