Examples

Headless Mode

Load the widget completely hidden and control everything from your own UI.

<script>
    window.receiveo = window.receiveo || {};
    window.receiveo.publicKey = "pk_live_YOUR_KEY_HERE";
    window.receiveo.showBubbleOnLoad = false;
    window.receiveo.hideBubbleOnClose = true;
</script>
<script src="https://widget.receiveo.com/loader.js" async></script>

Then open the chat from your own button:

<button id="support-btn">Talk to us</button>

<script>
    document.getElementById('support-btn').addEventListener('click', () => {
        receiveo.api.open();
    });
</script>

The chat bubble never appears. The chat window opens and closes via your button.

---

Hide Bubble After Chat

Show the bubble initially, but hide it once the user has had a conversation.

<script>
    window.receiveo = window.receiveo || {};
    window.receiveo.publicKey = "pk_live_YOUR_KEY_HERE";
    window.receiveo.hideBubbleOnClose = true;
</script>
<script src="https://widget.receiveo.com/loader.js" async></script>

The bubble shows on load. After the user opens and closes the chat, the bubble disappears. To bring it back:

receiveo.api.showBubble();

---

Show Bubble After First Interaction

Start hidden, then permanently show the bubble after the user’s first conversation.

<script>
    window.receiveo = window.receiveo || {};
    window.receiveo.publicKey = "pk_live_YOUR_KEY_HERE";
    window.receiveo.showBubbleOnLoad = false;
</script>
<script src="https://widget.receiveo.com/loader.js" async></script>

<script>
    // After the widget loads, wait for the first chat to close
    receiveo.api.on('close', () => {
        receiveo.api.showBubble();
    });
</script>

---

Conditional Display

Show the widget only on certain pages:

<script>
    window.receiveo = window.receiveo || {};
    window.receiveo.publicKey = "pk_live_YOUR_KEY_HERE";

    // Only show on /help and /contact pages
    const showOnPages = ['/help', '/contact', '/pricing'];
    if (!showOnPages.some(p => window.location.pathname.startsWith(p))) {
        window.receiveo.showBubbleOnLoad = false;
    }
</script>
<script src="https://widget.receiveo.com/loader.js" async></script>

---

Open on Load (No Bubble)

Auto-open the chat window without showing the bubble — useful for dedicated support pages.

<script>
    window.receiveo = window.receiveo || {};
    window.receiveo.publicKey = "pk_live_YOUR_KEY_HERE";
    window.receiveo.openOnLoad = true;
    window.receiveo.showBubbleOnLoad = false;
</script>
<script src="https://widget.receiveo.com/loader.js" async></script>

---

Identify Known Users

If your user is logged in, pass their info to Receiveo so operators see who they’re talking to:

// After your auth flow completes
receiveo.api.identify({
    email: user.email,
    name: user.name,
    customFields: {
        plan: user.plan,
        company: user.company,
    },
});

Tip

identify() can be called before or after the widget is ready. If called before, the data is queued and sent automatically when the widget initializes.

---

Skip Pre-Chat Form for Logged-In Users

If you’ve enabled a pre-chat form in your dashboard, you can skip it for visitors you’ve already identified:

// After your auth flow, identify the user with all required fields
receiveo.api.identify({
    email: user.email,
    name: user.name,
    phone: user.phone, // Include if phone is required in your form
});

The widget checks if the identified contact has all required pre-chat form fields. If they do, the form is skipped and the visitor goes straight to chat.

Tip

This pattern works great for SaaS apps where visitors are logged in. Configure the pre-chat form for anonymous visitors, but skip it for authenticated users by calling identify() with their details.

---

Wait for Widget Ready

Run code only after the widget is fully loaded:

receiveo.api.on('ready', () => {
    console.log('Widget is ready!');
    console.log('Bubble visible:', receiveo.api.isBubbleVisible);
    console.log('Window open:', receiveo.api.isChatWindowOpen);
});

The ready event is safe to register at any time — if the widget is already ready, the callback fires immediately.