Add the “Powered by ReadyToTalk” badge to your site

The badge is one line of JavaScript. It renders a small pill that reads “Powered by ReadyToTalk” and links back to your ReadyToTalk site. It's dependency-free, loads asynchronously, and ships in a light and a dark theme.

See it live

These are the real badges rendered by the script — click either one to follow the link through to readyto.talk. Choose the theme that fits your site.

Light
Dark

Prefer a corner badge? data-rtt-position="fixed-br" pins it to the bottom-right of the viewport instead of rendering inline.

The snippet

<script src="https://readyto.talk/embed/powered-by-readytotalk.js"
        data-rtt-theme="light"
        defer></script>

Options

All optional data- attributes:

AttributeValuesWhat it does
data-rtt-themelight | darkColour scheme (default light)
data-rtt-positioninline | fixed-brfixed-br pins it to the bottom-right corner
data-rtt-hrefURLClick-through target (default https://readyto.talk)
data-rtt-targetCSS selectorMount into a specific element instead of inline

Platform-by-platform

Pick your platform, copy the snippet, and paste it where noted.

Plain HTML

  1. Paste the snippet just before the closing </body> tag, or inside the element where you want the badge to appear.
<script src="https://readyto.talk/embed/powered-by-readytotalk.js"
        data-rtt-theme="light"
        defer></script>

WordPress

  1. Install a headers/footers plugin (e.g. WPCode or Insert Headers and Footers).
  2. Paste the snippet into the Footer / Scripts in Footer box, then Save.
  3. Or per-page: add a Custom HTML block in the block editor and paste the snippet.
<script src="https://readyto.talk/embed/powered-by-readytotalk.js"
        data-rtt-theme="light"
        defer></script>

Framer

  1. Open Project Settings → Custom Code.
  2. Paste the snippet into End of <body> tag, then Save and Publish.
  3. For a badge in a specific spot, drop an Embed component onto the canvas and paste the snippet there.
<script src="https://readyto.talk/embed/powered-by-readytotalk.js"
        data-rtt-theme="light"
        defer></script>

React

  1. Render the <script> once from a tiny component:
import { useEffect } from "react";

export function ReadyToTalkBadge() {
  useEffect(() => {
    const s = document.createElement("script");
    s.src = "https://readyto.talk/embed/powered-by-readytotalk.js";
    s.async = true;
    s.dataset.rttTheme = "light";
    document.getElementById("rtt-badge-slot")?.appendChild(s);
    return () => { s.remove(); };
  }, []);
  return <div id="rtt-badge-slot" />;
}

Next.js

  1. Use next/script in your layout (App Router: app/layout.tsx):
import Script from "next/script";

<Script src="https://readyto.talk/embed/powered-by-readytotalk.js"
        strategy="afterInteractive"
        data-rtt-theme="light" />

Webflow

  1. Project Settings → Custom Code → Footer Code, paste the snippet, Save, Publish.
  2. For a fixed spot, use an Embed element on the page.
<script src="https://readyto.talk/embed/powered-by-readytotalk.js"
        data-rtt-theme="light"
        defer></script>

Squarespace

  1. Settings → Advanced → Code Injection → Footer, paste the snippet, then Save.
<script src="https://readyto.talk/embed/powered-by-readytotalk.js"
        data-rtt-theme="light"
        defer></script>

Shopify

  1. Edit your theme → theme.liquid, paste the snippet just before </body>, then Save.
<script src="https://readyto.talk/embed/powered-by-readytotalk.js"
        data-rtt-theme="light"
        defer></script>

Self-hosting the script

Prefer to serve it yourself? Download powered-by-readytotalk.js, host it on your own domain or CDN, and point src="" at your copy. No other change needed.