Chatrina

How to add the chat to your website

You add the chat with one line of code - once, just like the Google Analytics code. After that you change everything in the dashboard, without touching your website.

Where to find the code

In the dashboard go to Widget, tab Installation. Under Where is your website? choose your platform - you'll see step-by-step instructions and a Copy code button.

The code looks like this (yours has its own key instead of YOUR_KEY - copy it from the dashboard):

<script src="https://chatrina.com/widget/widget.js" data-key="YOUR_KEY" async></script>

WordPress and WooCommerce

  1. In WordPress go to Plugins → Add New and install the free WPCode plugin.
  2. Go to Code Snippets → Header & Footer.
  3. Paste the code in the Footer box.
  4. Click Save. The chat will appear on every page.

Without a plugin: Appearance → Theme File Editor → footer.php and paste the code right before </body>. WooCommerce runs on WordPress, so the steps are the same.

Shopify

  1. In Shopify go to Online Store → Themes.
  2. Next to the live theme click … → Edit code.
  3. Open the layout/theme.liquid file.
  4. Find </body> (Ctrl+F or Cmd+F) and paste the code right before it.
  5. Click Save.

Wix

  1. In Wix go to Settings → Advanced → Custom Code.
  2. Click + Add Custom Code and paste the code.
  3. Choose All pages and place it in Body - end.
  4. Click Apply and publish the site.

Webflow

  1. Open Site settings → Custom code.
  2. Paste the code in the Footer code box.
  3. Save and publish the site (Publish).

A website built with AI (Lovable, Bolt, Cursor, Replit, Claude)

Choose the Vibecoding (AI) card and click Copy prompt. Paste it into your tool's chat - the AI adds the code in the right place. Then accept the changes and publish the site.

Any other website

Open the template that is on every page (usually the footer or main layout) and paste the code right before the closing </body>. Save and publish the changes.

Someone else looks after your website?

Choose the Send to a developer card, enter their email and click Send code and instructions. They get the code and instructions for popular platforms. The email contains no login details.

Check that it works

After pasting, open your website in the browser (refresh it), go back to the dashboard and click Check if it works. You'll see ✓ Widget works on … with your website address, or a hint about what is still missing.

The chat doesn't show up?

  • In Widget → Look and what's on the site the switch at the top must say Widget enabled on the website, and Chat must be on under What's on your site.
  • Your plan must be active or the trial must be running.
  • If you entered domains under Which websites the widget can run on in the Installation tab, the chat works only there. Empty = it works wherever you paste the code.
  • When the monthly conversation limit runs out, the chat disappears until the end of the period or until you add a pack - plans and limits.
  • Ad blockers on the visitor's side can hide the chat in their browser.

Frequently asked questions

Will the code slow down my website?

The code loads asynchronously (the async attribute), so it doesn't hold up the page.

Do I paste the code on every page separately?

No. You paste it once in a place shared by all pages: the footer, the main template or the custom code settings.

Didn't find the answer?

Have an account? Write to us in the dashboard, under Help & support. You can also email hello (at) chatrina.com.

See Chatrina on your own website

Create an account and try Chatrina free for 3 days, or see a preview first - it's ready in about a minute.

3 days free · no contract · a preview on your own site in about a minute

Reading your website…

Usually about a minute. Keep this tab open.