Home>Site and eCommerce Setup

Add Pop-ups and Banners to Your Square Online Site

Note: Enable more pop-ups by upgrading 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 coupon 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. From 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 customize the pop-up's style and content, as well as edit settings such as display frequency or scheduling.

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

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

Pop-up Types

Pop-up Description
Collect emails Collect email addresses from your customers to add them to your mailing list.
Offer a coupon Bring attention to coupons you're offering to encourage online sales (upgrade required).

Note: Be sure to create a coupon before adding a coupon pop-up. Learn more about creating discounts and coupons 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.

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 options

Use the Style and Content tab in the editing panel to customize the pop-up. You can also 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: Customize the color, style, and content of the display text and confirmation message.
  • Form Fields: Customize the placeholder text and style of the form fields, and toggle the Name and Birthday fields on or off.
  • Action Buttons: Customize the behavior 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 color 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 behavior. 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 timeframe for the pop-up. For example, this is handy for offering a limited-time discount to new signups.
  • Email Notifications: Check 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.

Manage Pop-ups

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

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

  2. Select ••• > Edit to make changes to your existing popup. 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.