# Before You Leave

**Before you leave** will show up after your customers don’t have any actions like clicking or hovering on the store. The store owner can set up the time when it would show in Theme Setting. This feature can show the promotion content, upsell products, discount campaign to attract visitor’s attention in case they want to leave.

![](/files/KpNTiyhpgWcsmYIgMM4I)

{% embed url="<https://www.youtube.com/embed/ERntV-o_JDM>" %}

1. From your Shopify admin, go to **Online Store** **->** **Themes**.
2. Find the theme that you want to edit, and then click **Customize**.
3. Click **Theme settings ->** **Before you leave.**

| Settings                  | Meaning                                                                                                                                                                                                                                                                      |
| ------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Show before you leave     | Toggle to show the Before You Leave popup to remind users.                                                                                                                                                                                                                   |
| Position                  | Select the position of the popup to appear to the right or left of the viewport.                                                                                                                                                                                             |
| Show after (minutes)      | Determine the timespan to show the popup since the stop of user's interaction or tab navigation.                                                                                                                                                                             |
| Logo                      | Select the brand logo to appear on the popup.                                                                                                                                                                                                                                |
| Background image          | Select an image for the top part background of the popup.                                                                                                                                                                                                                    |
| Content                   | Enter the content for the popup. HTML can be inserted to create more complicated layout for the popup content.                                                                                                                                                               |
| Collection                | Select a collection to show as Recommended Products on the popup.                                                                                                                                                                                                            |
| Maximum products to show  | Determine the maximum number of products within the collection to show on the popup.                                                                                                                                                                                         |
| Show back to store button | Toggle the button allowing users to navigate back to a store page on clicked.                                                                                                                                                                                                |
| Style                     | <p>There are 3 styles for the continue shopping button:<br><br><mark style="color:orange;"><strong>First button</strong></mark><br><mark style="color:orange;"><strong>Second button</strong></mark><br><mark style="color:orange;"><strong>Third button</strong></mark></p> |
| Link                      | Specify the link for the Back To Store button to navigate to.                                                                                                                                                                                                                |


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://halosoft.gitbook.io/ella-documentation/theme-settings/before-you-leave.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.