System updates

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

Home>Site and eCommerce Setup

Add Pop-ups and Banners to Your Square Online Site

Note: Using certain pop-ups requires an upgrade on your Square Online site.

Pop-ups are a great way to catch the attention of your visitors when they view your website. Use them to make an announcement, verify age, offer a voucher to new signups or simply build up your mailing list.

Create a Pop-up

To add a pop-up to your Square Online site:

  1. In your Square Online Overview page, go to Communications > Pop-ups.

  2. Choose your pop-up type and select the button to open the pop-up editor. You can customise the pop-up’s style and content, as well as edit settings such as display frequency or scheduling.

  3. Build and customise your pop-up and select Publish to see your changes live. Publishing your pop-up will also publish your website.

Pop-up Types

Square-Online-Popups-EN
Pop-up Description
Collect email addresses Collect email addresses from your customers to add them to your mailing list.
Offer a voucher Bring attention to vouchers you’re offering to encourage online sales (upgrade required).

Note: Be sure to create a voucher before adding a voucher pop-up. Learn more about creating discounts and vouchers for Square Online items.
Make an announcement Share important news or updates.
Verify age Prevent minors from accessing your site.

Note: For the age verification pop-up, we do not provide any guarantee, assurances or warranty that our services are compliant with any applicable age verification laws. Read the full disclaimer before you add an age verification pop-up to your website.

Note: Settings will vary depending on which style of pop-up you’re creating.

Navigate the Pop-up Editor

The pop-up editor is separate from the site editor for your Square Online site. This editor has a similar interface where you’ll see all of your editing options and settings in the editing panel, as well as a preview of what the live pop-up will look like.

Style and content

Square-Online-Popup-Style-and-Content-EN

Use the Style and Content tab in the editing panel to customise the pop-up for your needs. Settings available will vary depending on which style of pop-up you’re creating. You can use the buttons at the top of the editor to see how it displays on mobile or check out the confirmation message.

Style and content options

Use the Style and Content tab in the editing panel to customise the pop-up. Settings available will vary depending on which style of pop-up you’re creating. You can use the buttons at the top of the editor to see how it displays on mobile, or check out the confirmation message.

Options include:

  • 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 or upload an image for layouts that include one.

Settings options

Use the Settings tab in the editing panel to configure the pop-up behaviour. Settings available will vary depending on which style of pop-up you’re creating.

Options include:

  • Pop-up Name: An internal name for your pop-up to help you identify it within your Dashboard.
  • Timing: Configure which actions will make the pop-up appear 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. For example, this is handy for offering a limited-time discount to new signups.
  • 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 monthly.
  • Embed Code: Copy the code here to manually insert the pop-up into a webpage on your Square Online site.

Settings

Use the Settings tab in the editing panel to configure the pop-up behaviour. Settings available will vary depending on which style of pop-up you’re creating.

Manage Pop-ups

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

  1. In your Square Online Overview page, go to Communications > Pop-ups.

  2. Select ‘...’ > Edit to make changes to your existing pop-up. The pop-up will be temporarily disabled during editing, and you’ll need to publish your site again after making changes.

  3. Select ‘...’ > Change name to change the internal name of your pop-up, or select Delete to remove it from your site.

Can't find what you need?