Pop-ups: Set-up

Pop-ups are modal windows that capture your visitors’ attention and increase their engagement.

There are various types of pop-ups:

  • The Notification Pop-up announces your store’s special offers and promotions
  • The Discount Pop-up asks visitors to subscribe to your newsletter and offers a discount after the subscription
  • The Redirect Pop-up suggests your customers visit a storefront that matches their location

    Activation in the Theme Editor

    You can activate pop-ups by clicking the button at the upper right. The app will display a pop-up in your Online Store if it has a visible status.

    Pop-ups activate

    After you hit Activate app, the app redirects you to the theme editor’s App embeds tab. To activate the app, switch the toggle on and save the changes.

    Pop-ups: Set-up

    To deactivate the app, follow the steps above and switch the app embed off.

    Note

    If you have published a new theme in your store, you need to turn on app embeds for this new live theme.

    Creating a pop-up

    To create a pop-up, follow these steps:

    1. From your Shopify admin, go to the Searchanise Upsell & Marketing admin.
    2. Open the Pop-ups app.
    3. Click Create Pop-up and select its type.

    A new pop-up is added to the top of the list.

    Note

    By default, the status of a new pop-up is set as hidden. You can activate its display by clicking on the status name, which switches its value to visible. A dialog box will ask you to confirm the action.

    You can also clone an existing pop-up by clicking on the duplicate icon in the Action column. The pop-up you cloned is added to the list. It has the same title as the original bar and the clone mark.

    To find an existing pop-up, enter its title in the Search and Filter box.

    Pop-ups settings

    Configuring a pop-up

    You can configure a pop-up from the Edit Pop-up page. You can access this page by clicking the pencil icon in the Action column.

    Here, you can configure the pop-up settings:

    • General: Change the pop-up’s name and visibility status, configure its trigger type and content
    • Design: Select a design template and enter your texts into the pop-up preview
    • Display Rules: Set up the pop-up’s display conditions
    • Targeting (for Notification and Discount Pop-ups): Restrict the pop-up display based on different locations
    Important info

    If you select the Auto open trigger type, the pop-up will be displayed to customers after the time set up in the Display Rules. If you select the Exit intent trigger type, the pop-up will be displayed when the customer is about to leave the store.

    Note

    After you’ve made changes to the settings, a pop-up notification will appear at the top of the page reminding you to save them: “Unsaved changes”. You can then Save or Discard them.

    You can return to the list of pop-ups by clicking the arrow (back button) at the upper left.

    Notification Pop-up

    1. From the General tab, you can select a call-to-action:

    • Add a button to the pop-up
    • Make the entire pop-up clickable
    • Do not make the pop-up clickable

    If you want the pop-up to be clickable, you can add a Button URL, which is a link that will open when hitting the button. You can enable the option to open the link in a new tab.

    2. From the Design tab, you can select one of the ready-made design templates for the pop-up.

    Note

    A ready-made design template has a default style, such as background image, text font family, size, and colors. You cannot change this style.

    You can preview the pop-up design template to see how it appears to your customers and customize the message text.

    Pop-ups: Set-up

    3. From the Display Rules settings tab, you can control the pop-up visibility based on a custom condition. Here, you can decide how and when to display the pop-up in your Shopify store:

    • Select visitors’ target device to display the pop-up on: mobile and/or desktop
    • Set up a time delay before the pop-up appears on the store page
    • Use additional settings to display the pop-up:
      • Display after X page views
      • Display again after X hours
    • Select the display time option: permanent or custom
      • Permanent: Always show a pop-up
      • Custom: Set up your schedule using the Start and end display time options and User timezone detection by user IP address
    • Restrict the availability of the pop-up for some Shopify store pages
    Display the bar on Do NOT display the bar on
    All pages
    Home page
    Product page
    Search results page
    Cart page
    Collections
    Custom link (add any page link)
    Keywords (add any keyword from the store page URL)
    Off
    Home page
    Product page
    Search results page
    Cart page
    Collections
    Custom link (add any page link)
    Keywords (add any keyword from the store page URL)

    4. From the Targeting tab, you can add locations where the pop-up can be displayed or not based on the visitor’s IP address:

    1. Click Add new location.
    2. Start entering a location and then select one of the options suggested.

    If you want to remove the location, hit the delete icon. A dialog box will ask you to confirm the deletion.

    Discount Pop-up

    1. From the General tab, you can select a discount with a percentage or a fixed amount in exchange for subscribing to your newsletter.

    A fixed amount discount can be specified in a dollar value, but it is calculated and displayed in the currency of your Online Store.

    The app creates discount codes and saves them in Discounts in your Shopify admin. When you open the discount settings page, you can see a record in the Timeline section: “Searchanise Upsell & Marketing created this discount.”

    When you set up a discount value, you can specify the following:

    • Whether the discount can be combined with shipping/product/order discounts
    • The number of days the code is valid
    • The number of times the code can be used
    • Whether the discount can be used once by one customer
    • Minimum purchase requirements:
      • No minimum requirements
      • Minimum purchase amount ($)
      • Minimum quantity of items

    2. From the Design tab, you can select one of the ready-made design templates for the pop-up.

    Note

    A ready-made design template has a default style, such as background image, text font family, size, and colors. You cannot change this style.

    You can preview the pop-up design template to see how it appears to your customers and customize the message text.

    Pop-ups: Set-up

    3. From the Display Rules settings tab, you can control the pop-up visibility based on a custom condition. Here, you can decide how and when to display the pop-up in your Shopify store:

    • Select visitors’ target device to display the pop-up on: mobile and/or desktop
    • Set up a time delay before the pop-up appears on the store page
    • Use additional settings to display the pop-up:
      • Display after X page views
      • Display again after X hours
    • Select the display time option: permanent or custom
      • Permanent: Always show a pop-up
      • Custom: Set up your schedule using the Start and end display time options and User timezone detection by user IP address
    • Restrict the availability of the pop-up for some Shopify store pages
    Display the bar on Do NOT display the bar on
    All pages
    Home page
    Product page
    Search results page
    Cart page
    Collections
    Custom link (add any page link)
    Keywords (add any keyword from the store page URL)
    Off
    Home page
    Product page
    Search results page
    Cart page
    Collections
    Custom link (add any page link)
    Keywords (add any keyword from the store page URL)

    4. From the Targeting tab, you can add locations where the pop-up can be displayed or not based on the visitor’s IP address:

    1. Click Add new location.
    2. Start entering a location and then select one of the options suggested.

    If you want to remove the location, hit the delete icon. A dialog box will ask you to confirm the deletion.

    Redirect Pop-up

    1. From the General tab, you can:

    • select whether to show the pop-up once or always
    • specify the target URL for this Redirect Pop-up
    • choose the countries, regions, and cities for which you want to show the pop-up

    2. From the Design tab, you can select one of the ready-made design templates for the pop-up.

    Note

    A ready-made design template has a default style, such as background image, text font family, size, and colors. You cannot change this style.

    You can preview the pop-up design template to see how it appears to your customers and customize the message text.

    Using location variables, also known as keywords, in the pop-up text allows for dynamic and personalized messaging based on the customer’s location. Customize variables to fit your specific needs and preferences.

    For example, if you want to include the customer’s country name in the pop-up text, add the keyword #countryName# or #COUNTRYNAME#. The app will automatically populate the text with the name of the customer’s country. Similarly, you can include keywords such as #city#, #regionName#, and #countryCode#.

    Pop-ups: Set-up

    Note that while you can change the pop-up text, it is crucial to maintain the functional meaning of the call-to-action buttons. To ensure clarity, we recommend using the “Yes” button as the call-to-action for confirmation and “No” for cancellation.

    3. From the Display Rules settings tab, you can decide how and when to display the pop-up in your Shopify store:

    • Select visitors’ target device to display the pop-up on: mobile and/or desktop
    • Set up a time delay before the pop-up appears on the store page

    Deleting a pop-up

    If you want to delete a pop-up, click the delete icon in the Action column from the list. A dialog box will ask you to confirm the action by clicking Delete.

    Updated on May 27, 2024

    Was this article helpful?

    Related Articles

    Back to top