Quick Start

Add two <script> tags to your site — one to load the widget, one to initialize it.

html

<script src="https://cdn.periscale.app/chat-widget.umd.js"></script>
<script>
  PeriscaleChat.init({
    apiKey: "sb_live_your_api_key_here",
    primaryColor: "#20808D",
    agentName: "Support",
  });
</script>

That's it. A chat bubble appears in the bottom-right corner of every page where the script is loaded.

Where to get your API key

Your business sb_live_* key is generated when you create an API key in your Periscale dashboard. The same key authorizes the chat widget and the analytics tag.

TIP

Keep your API key out of public repos. Use environment variables in your build pipeline if the key is rendered server-side.

Test pages

You can drop the script in any of these contexts and it will work:

A static HTML file
A WordPress / Shopify / Webflow theme
A React / Vue / Next.js page (use a <script> element directly, or use next/script with strategy="afterInteractive")

Configuration — branding, position, voice, WhatsApp
JavaScript API — manual init / destroy

Quick Start ​

Where to get your API key ​

Test pages ​

Next ​

Quick Start

Where to get your API key

Test pages

Next