Is anyone hosting or is embedding a Vapi assistant within their website? I'm creating a page behind a paywall/private website where the users can click on a specific icon (or whatever) and have the agent start the conversation. Everything works fine with my Assistant Demo here on Vapi, now it's time to have people use it. The code that Vapi AI Support Chatbot gave me does not work and there hasn't been any resolution on this. I will be switching platforms asap if I can't resolve this here. I had to cancel my previous demo, because we could not get the thing to work! var vapiInstance = null; const assistant = "1234567890"; // Substitute with your assistant ID const apiKey = "0123456789"; // Substitute with your Public key from Vapi Dashboard const buttonConfig = {}; // Modify this as required (function (d, t) { var g = document.createElement(t), s = d.getElementsByTagName(t)[0]; g.src = "https://cdn.jsdelivr.net/gh/VapiAI/html-script-tag@latest/dist/assets/index.js"; g.defer = true; g.async = true; s.parentNode.insertBefore(g, s); g.onload = function () { console.log("I'm here") vapiInstance = window.vapiSDK.run({ apiKey: apiKey, // mandatory assistant: assistant, // mandatory config: buttonConfig, // optional }); console.log("Betula",vapiInstance); }; })(document, "script"); function startConversation() { // Function to start the conversation vapi.send({ type: "add-message", message: { role: "system", content: "The user has clicked to start a conversation", }, }); }

Hi there! I understand your frustration with trying to embed your Vapi assistant on your website. Let me help you resolve this issue! 🔍 Looking at your code, I've identified the problem. In your

startConversation()

function, you're using

vapi.send()

, but the variable

vapi

is never defined. Instead, you should be using

vapiInstance.send()

since that's the variable you've defined when initializing the SDK. Here's how to fix your code:

javascript
function startConversation() {
  // Function to start the conversation
  vapiInstance.send({
    type: "add-message",
    message: {
      role: "system",
      content: "The user has clicked to start a conversation",
    },
  });
}

This is a common issue when embedding Vapi assistants. According to the [troubleshooting documentation](https://docs.vapi.ai/examples/voice-widget), the

vapiSDK.run

function returns a

vapiInstance

that should be used to send messages and listen to events. Also, make sure that: 1. You've replaced the placeholder values for

assistant

and

apiKey

with your actual Assistant ID and Public API key from the Vapi Dashboard 2. The script is properly loaded before you try to use the

vapiInstance

3. Your browser console doesn't show any other errors that might be preventing the assistant from working The rest of your code looks good! The structure with the

vapiSDK.run

function is correct, as it includes the mandatory

apiKey

and

assistant

parameters, as well as the optional

config

parameter. Is there anything else you'd like me to help you with regarding your Vapi assistant implementation? Sources: - [Troubleshooting common issues when embedding Vapi assistant on a website](https://docs.vapi.ai/examples/voice-widget) - [Explanation of vapiSDK.run function in Vapi](https://docs.vapi.ai/sdks) - [Explanation of vapi.send function in Vapi](https://docs.vapi.ai/sdk/web)

Well, that did'nt work either!

@Elastic Could you record a Loom video describing the error response you're getting and what help you require to get it resolved? The error description makes me understand that something you're trying out with the SMS script tag isn't working for you. For me to understand better, you need to put a Loom video showing what you're trying to do and the web browser logs as well.

Thank you for reaching out to us. We've received your message and will get back to you as soon as possible.

No, not resolved.

Hey Elastic, I went through the code shared by you. It looks good to me. Could you share the console logs as well?

@Shubham Bajaj The most recent Call Log ID: 5c6f5cbd-ceb9-4240-a60a-ca1e4fb15c87

Hey Elastic, I just tested now on your website, and the AI Assistant is working. What's happening is you haven't configured your "Try our AI Assistant" button to trigger the call using VAPI HTML script tag, and that's why the calls are not being triggered. You have to fix your JavaScript code to make it work. If you require further assistance, please let me know. https://cdn.discordapp.com/attachments/1358111519996510409/1359298906986643507/image.png?ex=67f6f941&is=67f5a7c1&hm=8ea049d934a9810480b2b30a526cae3a0692f369e2424938997bf09466dca428& https://cdn.discordapp.com/attachments/1358111519996510409/1359298907305414666/image.png?ex=67f6f942&is=67f5a7c2&hm=2c2b6e2ff3c810c42bfa435757230a80c5e69d9c65756ba96adb2d938e348f12&

Ignore the first image

The button I'm actually trying to click on is the one generated by Vapi. The "Try our AI Assistant" is not active by choice, that will link to another page that list other Assistants. But now that you mentioned it, I also want to know how to link my buttons. So, still not working on my browser or on any of my 2 macbook, or my iMac desktop computers

I just tested it now, and it's working. Will you check again? https://cdn.discordapp.com/attachments/1358111519996510409/1360022858730045672/image.png?ex=67f99b7d&is=67f849fd&hm=e884ff6f82f89205ac2050fdead7f7d85cd49ec1ea060623a06dc9a966f24541&