# Advanced configuration

## Initialising Upzelo

There are a couple of ways of using Upzelo, you can opt to not manually set up click event listeners as Upzelo will do this by default on either a `button` or `a` with the ID of `cancel`. If opting to use this method (not recommended) You will need to add a second script tag to initialize Upzelo.

```javascript
// Upzelo config object
const config = {
    customerId: 'cus_1234',
    subscriptionId: 'sub_1234',
};

window.upzelo.init(config);
```

By doing this, Upzelo will be triggered and display the Flow that has been assigned to the customer.

## Usage with SPA

Integrating Upzelo with your SPA (single-page application) is simple.

Include the script tag from the installation guide in your main template file, then inside your components, use the `window.upzelo.open` function with an Upzelo Configuration Object to launch Upzelo.

## Content Security Policy

If you're running a CSP inside your application, then you'll need to allow Upzelo customer flows to serve images, fonts, and scripts. You'll also need to allow connections back to our servers. Please apply the following directives to your configuration:

* `image-src` [`assets.upzelo.com`](http://assets.upzelo.com/)
* `font-src` [`assets.upzelo.com`](http://assets.upzelo.com/)
* `script-src` [`assets.upzelo.com`](http://assets.upzelo.com/)
* `connect-src` [`upzelo.com`](http://upzelo.com/) [`events.upzelo.io`](http://events.upzelo.io/)

Optionally, you may decide to add [`assets.upzelo.com`](http://assets.upzelo.com/) to a `default-src`, to cover the 3 types in one.


---

# 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://docs.upzelo.com/developer-guide/advanced-configuration.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.
