← Back to documentation
Documentation

Install LtsTalk on your website

Documentation

Install LtsTalk on your website

This guide explains, step by step, how to add the LtsTalk chat widget to your website using a small script.

Before you start

You only need two things: access to edit your website and your LtsTalk public key. The public key connects the widget on your website with the correct LtsTalk workspace, brand or website configuration.

If someone else manages your website, such as a developer, agency or IT team, send them this guide and your public key.

The script you need to install

Copy this script and replace YOUR_PUBLIC_KEY with the public key from your LtsTalk website settings. 

<script
  src="https://ltstalk.io/widget/newchat-widget.js"
  data-key="YOUR_PUBLIC_KEY"
  async>
</script>

Keep the quotation marks around your public key. Do not remove async, because it helps the widget load without slowing down the rest of your page.

Where to put the script

Place the script near the bottom of your website code, immediately before the closing </body> tag. This is usually the safest place because the page can load first and the chat widget loads after.

A simple page should look like this: 

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>My website</title>
  </head>
  <body>
    <h1>Welcome</h1>
    <p>This is my website content.</p>

    <script
      src="https://ltstalk.io/widget/newchat-widget.js"
      data-key="YOUR_PUBLIC_KEY"
      async>
    </script>
  </body>
</html>

The important part is that the LtsTalk script appears before </body>, not after it.

Step-by-step installation

  1. Open the admin panel, editor or code file for your website.
  2. Find the main layout, theme footer or template that appears on every page.
  3. Search for the closing </body> tag.
  4. Paste the LtsTalk script directly above that closing tag.
  5. Replace YOUR_PUBLIC_KEY with your real LtsTalk public key.
  6. Save or publish the website changes.
  7. Open your website in a browser and confirm that the chat button appears.

How to install it in common website builders

WordPress

If your theme has a custom code area, add the script to the footer or before-body section. If your site uses a header and footer plugin, paste the script in the footer area. If you edit theme files directly, place it in the main footer template before </body>.

Shopify

Open your theme code and look for the main layout file, often named theme.liquid. Paste the script before the closing </body> tag, then save the theme.

Webflow

Open your site settings, go to the custom code section and paste the script in the footer code area. Publish the site after saving.

Wix, Squarespace or similar builders

Look for a custom code, tracking code or embed code section. Choose the option that loads code at the end of the body or in the footer. Paste the LtsTalk script there and publish your changes.

Custom HTML website

Open the HTML file or shared layout file used by your pages. Paste the script before </body>, save the file and upload the updated version to your hosting provider if needed.

How to confirm it works

  • Visit your website in a normal browser window.
  • Wait a few seconds for the page and widget to load.
  • Look for the LtsTalk chat button, usually near the lower corner of the page.
  • Click the chat button and send a test message.
  • Open your LtsTalk inbox and confirm the test conversation appears.

If the widget does not appear

First, check that the script is installed before </body> and that YOUR_PUBLIC_KEY was replaced with the real public key. Also confirm that there are no extra spaces inside the key and that the script was not pasted inside another script block.

If your website uses caching, clear the cache and reload the page. If your website builder requires publishing after changes, make sure the latest version is published. If the chat button still does not appear, contact your LtsTalk support team with your website URL and a screenshot of where the script was added.

Important notes

  • Install the script only once on each page.
  • Use the public key for the correct website or brand.
  • Do not share private credentials, passwords or API secrets in your website code.
  • The script can be added to a shared footer or layout so it appears across your whole website.
  • If you have multiple websites, install the matching public key on each site.