PepoChat

Install the widget

Add one script tag to any site, with ready-made snippets for HTML, JavaScript, React and Next.js, or share the hosted chat page.

PepoChat runs as a small loader script on your site. The loader draws the launcher button, and the chat itself opens in an isolated frame so it never conflicts with your page's styles or scripts. Installing it means adding one script tag with your Organization ID.

What you need

Your Organization ID from the dashboard's Widget Setup page. It is a 32-character code such as jh7d04q3v5r83n0j0sa1r4wecn8f2523, and it is the only thing that ties the widget to your workspace.

Find your Organization ID

  1. Open Widget Setup

    In the PepoChat dashboard, click Widget Setup in the left sidebar. Step 1 on that page shows your Organization ID with a Copy button.

  2. Pick your platform

    Step 2 lists the install options: HTML, React, Next.js, JavaScript and WordPress. Clicking one opens the snippet with your Organization ID already filled in. WordPress opens the plugin instructions instead of code.

The snippets

Every snippet below is what the dashboard generates, with YOUR_ORGANIZATION_ID in place of your real ID.

Paste this right before the closing </body> tag of every page where the widget should appear. Most sites have one shared layout or footer file, so you usually paste it once.

<!-- Paste before the closing </body> tag -->
<script
  src="https://widget.pepochat.com/widget.js"
  data-organization-id="YOUR_ORGANIZATION_ID"
></script>

Optional attributes

AttributeValuesDefaultWhat it does
data-organization-idyour IDrequiredConnects the widget to your workspace.
data-positionbottom-right, bottom-leftbottom-rightWhich corner the launcher and chat window use.
data-preloadtrue, falsetrueLoads the chat in the background during idle time so the first open is instant. Set to false to load it only when a visitor clicks.

See Widget behavior and JavaScript API for the window.EchoWidget methods.

Hosted chat page

Your agent also lives on its own page, no website needed. The Hosted chat page card on Widget Setup shows the address, with Open and Copy buttons:

https://widget.pepochat.com/full?organizationId=YOUR_ORGANIZATION_ID

The page fills the browser with a soft gradient in your brand color and shows the chat in a centered card (the whole screen on phones). There is no launcher and no close button; everything else, from the Home screen to Help articles and bookings, works as in the embedded widget. Link to it from emails, print it as a QR code, or put it in a link-in-bio.

If you use an allowed-domains list, the hosted page is blocked until you switch on Allow the hosted chat page on the same card; the card warns you and the page shows the allowed-domains error until then. Once on, anyone with the link can chat.

Check that it works

  1. Open your site in a new tab

    The launcher appears in the corner you chose within a second or two of the page finishing. Click it: the chat opens with your greeting.

  2. Ask something your content answers

    The reply streams in word by word. Ask something your content does not cover and the agent says so and offers your team instead of guessing.

  3. Look in the dashboard

    Open Conversations. Your test chat is there, live, with the visitor's messages and the agent's replies. Close the chat window on your site and reply from the dashboard: the launcher shows a red badge with the number of replies waiting.

Nothing appears?

The three usual causes are a wrong Organization ID, an allowed-domains list that does not include the site, and a caching layer still serving the old page. The troubleshooting page walks through each one.

Next steps

Something missing or wrong on this page? Tell us and we will fix it.