Sign up

Get paid

PaymentsCards, wallets & local methodsCheckout & LinksNo-code checkout & linksInvoicingSend and get invoices paidSubscriptionsRecurring billing & discountsPayment GatewaysRoute across processors

Sell anywhere

Online StoreBuild your storefrontProductsCatalog & inventoryOrders & FulfillmentTrack and fulfill ordersVirtual TerminalCharge cards by hand

Marketing & analytics

Email CampaignsDesign & send campaignsCustomersProfiles, spend & portalAnalyticsUnderstand your revenue

Run your business

Send MoneyInstant payouts & refundsPayout LinksPay anyone with a linkInboxSupport conversations

Installing the chat widget

The chat widget is the little launcher that lets visitors message you. Their messages arrive in your inbox. You turn it on in Settings > Chat, and it appears on your Paysio storefront and checkout automatically. To put it on your own website too, you add one small snippet.

The embed snippet

In Settings > Chat, under Install on your website, copy the snippet. It looks like this:

<script>
  window.PaysioChat = { workspaceId: "YOUR_WORKSPACE_ID" };
</script>
<script src="https://paysio.com/chat.js" async></script>

Paste it into your site's HTML, either in the <head> or just before the closing </body> tag, on any page you want chat to appear. The widget automatically picks up the appearance and settings you configured on the Chat page, so you do not set any of that in the code.

On your Paysio store and checkout

You do not need the snippet on anything Paysio hosts. When the widget is enabled (the "Enable the chat widget on your storefronts and checkout pages" toggle in Settings > Chat), it shows on your storefront and checkout pages on its own.

If you want to hide it on certain storefront pages, use the Hide on pages setting. You can list exact paths like / or wildcard patterns like /products/* to keep the widget off those pages.

Identifying customers

If you already know who the visitor is, for example a logged-in user on your own site, you can pass their Paysio customer ID so the chat links to their customer profile. Set it in the config before the script loads:

window.PaysioChat = { workspaceId: "YOUR_WORKSPACE_ID", customerId: "THE_CUSTOMER_ID" };

You can also set it with a data-customer-id attribute on the script tag. With a customer ID attached, conversations show that customer's spend and history right in the inbox.

Launcher options

By default the widget shows its own launcher button in the corner of the page. If you would rather trigger chat from your own button, such as a "Contact support" link, hide the default launcher and open the panel yourself.

  • Set hideLauncher: true in the config (or data-hide-launcher="true" on the script tag) to hide the default button.
  • Then call the widget's API from your own button: PaysioChat.open(), PaysioChat.close(), or PaysioChat.toggle(). There is also PaysioChat.isOpen() and PaysioChat.on(event, fn) to listen for "ready", "open", and "close".

This lets the chat live behind any element on your site while still landing every message in your inbox.

Related guides