# Ha Tang Chat plugin for WordPress

The Ha Tang Chat plugin adds the Ha Tang chat widget to every page of your WordPress site, so your team answers website visitors from the same inbox as Zalo, Messenger, Instagram, TikTok, WhatsApp, Telegram and email. It loads the regular [web widget](https://hatang.dev/docs/guides/support/web-widget/javascript-api.md) through `wp_enqueue_script` and adds settings for position, language and logged-in users.

> **Info: Version**
>
> Plugin **0.2.1** · WordPress 6.0+ · PHP 7.4+ · GPLv2 or later · [wordpress.org](https://wordpress.org/plugins/hatang-chat/) · [Changelog](#changelog)

## Before you start

- A Ha Tang account with a website channel. You need its **Site ID** (`site_...`): in the dashboard, open **Support → Channels**, pick your website and copy the id from the install snippet.
- A WordPress user who can manage plugins and settings (an administrator).

## Install the plugin {#install}

1. In WordPress, go to **Plugins → Add New**, search for "Ha Tang Chat", then install and activate it. You can also upload the plugin zip with **Plugins → Add New → Upload Plugin**.
2. Go to **Settings → Ha Tang Chat**, paste the **Site ID** and click **Save Changes**.
3. Open any page of your site. The chat bubble appears, and the website in the Ha Tang dashboard shows that the widget is installed.

The widget only loads on the public side of the site, never in wp-admin. If the Site ID is empty, the plugin loads nothing.

## Settings {#settings}

All settings are on **Settings → Ha Tang Chat** and are stored in one option, `hatang_chat`.

| Setting | Values | Default |
|---|---|---|
| Site ID | The website's id from the Ha Tang dashboard | empty (widget off) |
| Widget host | Where `widget.js` is loaded from | `https://chat.hatang.dev` |
| Position | Bottom right, Bottom left | Bottom right |
| Language | **Follow the WordPress language (per page)**, **Visitor's browser language**, **Tiếng Việt**, **English** | Follow the WordPress language (sites installed before 0.2.0 keep the browser language) |
| Logged-in users | "Send the user's name and email to the inbox" | On |

- **Follow the WordPress language** reads the language of the page being served (`determine_locale()`), so it works page by page with Polylang and WPML. A locale starting with `vi` gives Vietnamese; any other gives English.
- **Visitor's browser language** lets the widget decide: the visitor's browser, or the default language set for the site in the Ha Tang dashboard.
- Everything else (colors, office hours, greeting, offline form) comes from the website's settings in the Ha Tang dashboard. For options the plugin does not expose, such as `offset` or `hideLauncher`, add your own `window.HATANG_CONFIG` before the widget script, or use the [JavaScript API](https://hatang.dev/docs/guides/support/web-widget/javascript-api.md) from your theme.

## Logged-in users {#identify}

With **Logged-in users** on, the plugin calls `identify` for a logged-in visitor with their WordPress display name and email. The inbox shows them as information the visitor gave, not as a verified identity.

To have the inbox mark the user as **verified** and merge the conversation with that person's earlier sessions (including your mobile app), return a signature from the `hatang_chat_identity_hash` filter. The signature is the HMAC-SHA256 of the WordPress user id with the site's identity secret. Get the secret in the Ha Tang dashboard: **Support → Channels** → your website → **Identity secret** → **Rotate & reveal**. Keep it in `wp-config.php`, never in a theme file others can read.

```php title="wp-config.php"
define( 'HATANG_IDENTITY_SECRET', 'your-identity-secret' );
```

```php title="functions.php"
add_filter( 'hatang_chat_identity_hash', function ( $hash, $user ) {
    return hash_hmac( 'sha256', (string) $user->ID, HATANG_IDENTITY_SECRET );
}, 10, 2 );
```

When the filter returns a value, the plugin adds `userId` (the WordPress user id as a string) and `hash` to the `identify` call. What a signature means, how sessions merge and the privacy notes are in [Identity verification](https://hatang.dev/docs/guides/support/web-widget/identity-verification.md).

## Filters for developers {#filters}

| Filter | Arguments | Return |
|---|---|---|
| `hatang_chat_locale` | `$locale` (`"vi"`, `"en"` or `null`), `$setting` (`"wp"`, `""`, `"vi"` or `"en"`) | `"vi"`, `"en"`, or `null` to let the widget decide |
| `hatang_chat_identity_hash` | `$hash` (`null`), `$user` (`WP_User`) | The HMAC-SHA256 hex string, or `null` for an unverified identity |

Force English on one page, whatever the setting:

```php title="functions.php"
add_filter( 'hatang_chat_locale', function ( $locale, $setting ) {
    return is_page( 'en' ) ? 'en' : $locale;
}, 10, 2 );
```

## What the plugin sends to Ha Tang {#data}

The widget script loads from `chat.hatang.dev` on the public pages of your site. When a visitor opens a page, it sends the page URL and title, the visitor's browser language and, if you turned it on, the name and email of a logged-in user. See the [Terms](https://hatang.dev/legal/terms) and the [Privacy policy](https://hatang.dev/legal/privacy).

## Admin translation {#translation}

The settings page is translated into Vietnamese (`languages/hatang-chat-vi.po`). WordPress picks the translation from the admin language.

## Uninstall {#uninstall}

Deactivate and delete the plugin from **Plugins**. The plugin has no uninstall routine, so its settings stay in the `hatang_chat` option; remove it with `wp option delete hatang_chat` if you want a clean database. Conversations stay in your Ha Tang account until you delete them there.

## Changelog {#changelog}

- **0.2.3**: the author link points to hatang.dev; the readme links the setup guide and this developer guide and answers which conversations share the inbox.
- **0.2.2**: the plugin is called Ha Tang Chat (Hạ Tầng in Vietnamese); its homepage is the help article at hatang.dev/help/integrations/wordpress; the settings page and readme name **Customer Support → Channels**.
- **0.2.1**: the settings page and readme point to **Support → Channels**, where the Ha Tang dashboard now lists your websites; the readme lists every channel that shares the inbox.
- **0.2.0**: the language can follow the WordPress language of each page (works with Polylang and WPML); new `hatang_chat_locale` filter; settings page translated into Vietnamese.
- **0.1.1**: the widget loads through `wp_enqueue_script`.
- **0.1.0**: first release: widget snippet, position and language settings, logged-in user identification.

## Next steps

- [Web widget and JS API](https://hatang.dev/docs/guides/support/web-widget/javascript-api.md): commands, events and `HATANG_CONFIG`.
- [Identity verification](https://hatang.dev/docs/guides/support/web-widget/identity-verification.md): signed identities and session merging.
- [Install the widget](https://hatang.dev/docs/guides/support/web-widget/install.md): other platforms, or WordPress without the plugin.

Source: https://hatang.dev/docs/guides/integrations/wordpress