WooCommerce stores run on WordPress, so you have two options: the official Yaplet Live Chat WordPress plugin (recommended, no code editing), or adding the embed snippet manually using the Insert Headers and Footers plugin. Both approaches work identically — pick whichever fits your workflow.
Option A — Yaplet Live Chat plugin (recommended)
This is the same plugin used for plain WordPress sites. It works equally well on WooCommerce stores.
1. Install the plugin
In your WordPress admin, go to Plugins → Add New Plugin. Search for Yaplet Live Chat and install and activate it.
2. Enter your Widget ID
Go to Settings → Yaplet and paste your Widget ID. To find it, log in to your Yaplet dashboard and go to Brand → (your brand) → Chat widget → Install. The ID is the widgetId value inside the script shown there, and it is also the last part of that page's web address.
3. Save and verify
Click Save Changes, then open your store in a new tab. The Yaplet launcher should appear in the bottom-right corner on all pages, including product and checkout pages.
Option B — Insert Headers and Footers plugin
If you already use this plugin (or prefer it), you can add the Yaplet snippet through it instead.
1. Install Insert Headers and Footers
Go to Plugins → Add New Plugin and search for Insert Headers and Footers (by WPCode). Install and activate it.
2. Paste the Yaplet snippet
Go to Settings → Insert Headers and Footers. Paste the full Yaplet JavaScript snippet into the Scripts in Header box and click Save.
3. Verify
Reload your store. The widget should appear on every page.
Identify logged-in customers
Pass WooCommerce customer data to Yaplet so your team sees real names and order values in the inbox. Identifying a customer requires a signature proving the ID really is theirs — without it anyone could claim to be one of your customers, so we reject unsigned calls. WordPress runs on your server, so it can produce that signature.
First add your identity secret to wp-config.php. You'll find it in the Yaplet dashboard under Brand → (your brand) → Chat widget → Install → Identity verification, behind the Show identity secret button:
define('YAPLET_IDENTITY_SECRET', 'paste-your-secret-here');
Then add this to your theme's functions.php or a custom plugin:
add_action('wp_footer', function () {
if (is_user_logged_in()) {
$user = wp_get_current_user();
$customer = new WC_Customer($user->ID);
$user_hash = hash_hmac('sha256', (string) $user->ID, YAPLET_IDENTITY_SECRET);
echo '<script>';
echo 'Yaplet.identify("' . esc_js($user->ID) . '", {';
echo ' name: "' . esc_js($user->display_name) . '",';
echo ' email: "' . esc_js($user->user_email) . '",';
echo ' value: ' . floatval($customer->get_total_spent()) . ',';
echo '}, "' . esc_js($user_hash) . '");';
echo '</script>';
}
});
Keep the secret in wp-config.php — never paste it into a theme file or anywhere else the browser can download it.
Troubleshooting
- Widget missing on checkout page — Some WooCommerce themes strip scripts from the checkout page to improve performance. Check your theme's documentation for how to re-enable scripts on checkout.
- Cache issues — Clear your WordPress cache, WooCommerce transients, and any CDN cache after installation.
- Conflicts with other chat plugins — If you previously used another chat plugin, deactivate it before installing Yaplet to avoid launcher conflicts.
What's next
Check that the widget is loading correctly on your store: Verify your installation.