This guide describes setting up a Popup section.
Use the section display a small temporary window over your store's pages. The section is typically used to contain promotional and advertising messages for your store's visitors.
In the previous video, a Popup section appears in the lower right corner of a store's Artists page. The section displays after the page loads, and contains a form for subscribing to the store's newsletter.
For general guidance with modifying sections, refer to Sections overview.
Set up the Popup section
To set up your store's Popup section:
Go to Customize theme.
In Theme editor, at the top of the page, use the dropdown to select the Home page.
The section is accessible from all pages, excluding the Checkout, Password and Gift card pages.
From the side menu, select Popup.
Select a setting described in the following table.
|Adjust the Delay slider to set a delay between
30 seconds before the section appears on a page. Changes to the delay time cannot be previewed from inside Theme editor. Visit your store's homepage in a web browser to preview your adjustments.
|Adjust the Frequency slider to set the number of days before a closed popup reappears. The minimum slider value is
2 days and the maximum is
|Content > Heading
|In the Heading box, enter text to display as a title inside the section.
|Content > Text
|In the Text box, enter (body) text to display inside the section. Format the text and add links using the Text editor pane.
|Content > Text > Connect dynamic source
|To display body text from a dynamic source, select the Connect dynamic source icon beside the Text box, and then choose a metafield to add. Refer to Shopify help: Metafields.
|Content > Call to action
|Use the Call to action options to set the type of prompt to display inside the section. The options are Newsletter signup or Button. The Newsletter signup option provides store visitors with a form to subscribe to your store's newsletter. Subscribers' email addresses are added to your store's "accepts marketing" list. The Button option adds a button inside the section.
|Content > Customer list (link)
|To manage your customers' details, follow the customers list link to the Customers page in your store's admin. Refer to Shopify help: Managing customers.
|Content > Button style
|Use the Button style options to set the style for the section's buttons to Outline or Solid.
|Content > Button link
|In the Button link box, enter a URL or select a link to a store page. The link is displayed inside the section. To remove a link, select the X icon inside the Link box. To use the link, set the Call to action option to Button.
|Content > Button link > Connect dynamic source
|To display a button link from a dynamic source, select the Connect dynamic source icon beside the Button link box, and then choose a metafield to add. Refer to Shopify help: Metafields.
|Content > Button text
|In the Button text box, enter text to display as button label text inside the section. To use the label, set the Call to action dropdown to Button.
|Color > Color scheme
|Use the Color scheme options to select a color scheme for the section. Refer to Colors.
|If available, select Theme settings to access additional settings for the section. Refer to Section theme settings menu.
|Select Custom CSS. In the box, enter custom CSS styles to apply only to the current section. Refer to Shopify help: Add custom CSS. To apply custom styles to your entire online store, refer to Theme settings > Custom CSS.