Skip to main content
Adding the ChatSyncs Chat Widget to WordPress uses the same JavaScript Embed Code as any other website — just pasted in through WordPress instead of directly editing HTML.
Chat Widget embed code modal with the JavaScript snippet to copy
1

Build and get your widget's embed code

Follow Chat Widget to create the widget and copy its JavaScript Embed Code.
2

Open WordPress and add the code

Pick whichever fits your site:
  • Theme editor — Appearance → Theme File Editor → header.php, paste the code just before </head>. Best if you’re comfortable editing theme files, since a typo can break the page.
  • A header/footer plugin — install a plugin like Insert Headers and Footers, paste the code into its header field, and save. Safer than editing theme files directly.
  • A Custom HTML block — in the block editor (Gutenberg), add a Custom HTML block to the page or template and paste the code in. Simplest if you only want the widget on one page.
3

Save and check your site

Reload the page and confirm the floating WhatsApp button appears.
If you’re not comfortable editing theme files, a header/footer plugin is the safest option — it avoids touching your theme’s code directly, so a typo can’t take your site down.

Frequently asked

Build the widget first — see Chat Widget for creating it and opening its Embed Code dialog.
Yes — use a header/footer plugin (e.g. Insert Headers and Footers) or a Custom HTML block instead of editing header.php directly.
Yes — add the embed code as a Custom HTML block on that specific page or template, instead of pasting it site-wide in the header.