System updates

We’re experiencing issues that may affect your Square services. We’ll continue to update our status page with more information.

Back to Home

Add a Pop-up or Banner to Your Website

Pop-ups are a great way to catch the attention of your visitors - use them to make an announcement, verify the age of website visitors, offer a coupon to new signups, or simply build up your mailing list. You can create an email collection pop-up for free, but you’ll need to upgrade to use other pop-up types.

popups-dashboard-main

Create a Pop-up

To create a pop-up:

  1. Go to the Square Online Overview page.

  2. Click Communications > Pop-ups.

  3. Select the type of pop-up you want to use.

  4. In the Layout section, click on a thumbnail to view an example.

  5. Edit the pop-up, Style and Content, and Settings to best fit the needs of your business.

  6. Click the Publish button to enable the pop-up on your live website.

Choose your Pop-up

Pop-up Description
Collect emails Collect email addresses from your customer to add them to your mailing list.
Offer a coupon [Create a coupon](https://squareup.com/help/article/6880-create-a-coupon-in-square-online-store) before before creating a coupon pop-up.
Make an announcement Share important news or updates.
Verify age Prevent minors from accessing your site.

Style and Content

Once you’ve decided on a layout, you can edit additional settings to customise the pop-up for your needs. Settings available will vary depending on which style of pop-up you’re creating.

Title and Text

Customise the colour, style and content of the display text and confirmation message.

Form Fields

Customise the placeholder text and style of the form fields and toggle the Name and Birthday fields on or off.

Action Buttons

Customise the behaviour and style of the primary button and close icon. The action button can be set to an email address or phone number. Alternatively, you can set it to open a page on your website or an external website.

Background

Set a background colour for your pop-up and upload an image for layouts that include one.

Settings

cms-popups-settings

Use the Settings tab at the top left of the editor to configure the pop-up behaviour. Settings available will vary depending on which style of pop-up you’re creating. The following options can be adjusted here:

Pop-up Name

An internal name for your pop-up (e.g. lead generation form).

Timing

Configure which actions will trigger the pop-up for visitors.

Display Frequency

Decide how often to display the pop-up for returning visitors.

Stopping Conditions

Choose when to permanently stop displaying the pop-up based on the visitor’s actions.

Schedule

Select a time frame for the pop-up. This is handy if you want to offer a limited-time discount to new sign-ups, for example.

Email Notifications

Tick the box here to enter your email address and specify how often you want to be notified of new submissions. You can choose from immediately, once daily, once weekly or once a month.

Embed Code

Copy the code here to manually insert it into a webpage.

Managing Pop-ups

popups-dashboard-saved

To view and manage any pop-ups you’ve created:

  1. Go to the Square Online Overview page.

  2. Choose Communications > Pop-ups.

  3. Click the . . . icon > Edit to make changes to the settings. This will load the pop-up preview.

  4. Click the Publish button to update the pop-up on your live website.

Note: The pop-up will be temporarily disabled during editing, and you’ll need to publish your site again after making changes.