looking to launch a web based conversation with a ...
# support
j
the web widget is too limited. looking for more control. problem is, we are mostly django types and have trouble with the front end examples as they are frameworks we are not familiar with. anybody got a simple vanilla js example we could take a look at? thx
c
For the web snippet? Can you create CSS to customize more?
v
@jmadarieta3 Absolutely, I understand that you're looking for a straightforward example that doesn't rely on complex frameworks. While our Web SDK is designed to be flexible and can be used with vanilla JavaScript, I can guide you through the process of setting it up in a simple environment. Here's a basic outline of how you can integrate Vapi into a vanilla JavaScript project: 1. **Include the Vapi SDK**: First, you'll need to include the Vapi Web SDK in your HTML file. You can do this by adding a script tag pointing to the SDK's CDN link or by installing it via npm if you're using a build system.
Copy code
html
<script src="path_to_vapi_web_sdk"></script>
2. **Initialize Vapi**: Once the SDK is included, you can initialize Vapi in your JavaScript file.
Copy code
javascript
const vapi = new Vapi({
  apiKey: "your_api_key", // Replace with your actual API key
});
3. **Set up event listeners**: You can then set up event listeners for various voice events according to your application's needs.
Copy code
javascript
vapi.on('event_name', function(eventData) {
  // Handle the event
});
4. **Start a voice session**: When you're ready, you can start a voice session.
Copy code
javascript
vapi.startVoiceSession({
  // Configuration options
});
5. **Handle voice data**: As you receive voice data, you can process it as needed.
Copy code
javascript
vapi.on('voiceData', function(data) {
  // Process the received voice data
});
6. **End the voice session**: Finally, you can end the voice session when it's no longer needed.
Copy code
javascript
vapi.endVoiceSession();
If you need a more detailed example or have any specific questions about integrating Vapi with your Django application, please let me know, and I'll be happy to assist further!
You can continue this conversation by mentioning me in the message.
2 Views