# Progressive Web App (PWA)

Apps can be exposed as a progressive web app (PWA), hosted by DialoX on a **.bsqd.me** subdomain.

### Configuration <a href="#configuration" id="configuration"></a>

Enable the PWA via the Channels menu.&#x20;

<figure><img src="/files/1bg1p35XhrnFtnmolqN7" alt=""><figcaption></figcaption></figure>

Then provide the subdomain under which the app will be hosted.

### Design

The app appearance can be altered via the Design tab.\
After connecting the PWA channel, the chat widget shows in an app-like experience like this:

<figure><img src="https://developer.dialox.ai/channel/web_pwa_app.png" alt="Image of a phone with a chat application running. The chat looks like an embedded app." width="375"><figcaption></figcaption></figure>

When running as a full page chat, the phone frame is replaced by the name and logo of the app, making it more useful to run in an iframe:

<figure><img src="https://developer.dialox.ai/channel/web_pwa_basic.png" alt="" width="375"><figcaption></figcaption></figure>

Besides the app appearance, the design allows other&#x20;

* The Splash screen is a screen that gets loaded first and can be used to accept the Terms and Conditions of a bot.
* The Launcher screen is the launcher board for the PWA that can be used to trigger events in the conversation. It shows rows of buttons, where each button has a title and an icon, and links into the main conversation (if there is no `g` parameter given, or into a specific conversation, when `g` is set). Furthermore, each button has an optional `event` that will be triggered when the button is clicked. The start screen can be programmatically shown again using `emit "pwa_menu"`.
* The `ua_tracking_id` is a Google Analytics UA code to hook up the PWA to your own Google Analytics account.

The icons used in the buttons are from the [Material Design icon set](https://material.io/tools/icons/).

### Disabling certain input elements[¶](https://developer.dialox.ai/channel/web_pwa/#disabling-certain-input-elements) <a href="#disabling-certain-input-elements" id="disabling-certain-input-elements"></a>

It is possible to disable certain chat input elements by setting the `chat_config` portion of the `pwa` YAML file:

```yaml
chat_config:
  disabled_inputs:
  - location
  - image
  - text
```

This `chat_config` element can also be placed inside a button definition of the `start_screen.home_buttons` item; this way, you can enable the chat input on one PWA chat screen but not on the other.


---

# 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://manuals.dialox.ai/studio/channels/progressive-web-app-pwa.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.