> For the complete documentation index, see [llms.txt](https://manuals.dialox.ai/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://manuals.dialox.ai/studio/channels/progressive-web-app-pwa.md).

# 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.