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 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:
In your Square Online Overview page, go to Communications > Pop-ups.
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.
Build and customize your pop-up and select Publish to see your changes live. Publishing your pop-up will also publish your website.
Pop-up Types
| Pop-up | Description |
| Collect email addresses | 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. |
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
Use the Style and Content tab in the editing panel to customize 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.
Use the Style and Content tab in the editing panel to customize 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: Customize the colour, 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 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.
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: 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.
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:
In your Square Online Overview page, go to Communications > Pop-ups.
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.
Select ‘...’ > Change name to change the internal name of your pop-up, or select Delete to remove it from your site.