rare-sapphire•2y ago
❗ Chatbot Loading Issue
Hi everyone,
I'm facing an issue with my customized Voiceflow chatbot not loading consistently on my website. Instead, the default Voiceflow chatbot often appears, especially when navigating to subsequent pages. This occurs on both desktop and mobile devices.
I've tried various troubleshooting steps, such as clearing the browser cache, placing the script correctly, and adding the 'defer' attribute, but the issue persists.
I would greatly appreciate any guidance or suggestions from the community:
1. Has anyone faced a similar issue and found a solution?
2. Are there any known compatibility issues or bugs that could cause this?
3. Any best practices for ensuring proper chatbot initialization on subsequent pages, especially for multi-page websites or SPAs?
Here's the URL of my website:
https://nirvanapuzzles.com/
Any insights or suggestions would be incredibly helpful. Please let me know if you need more information.
Thank you in advance for your support!
6 Replies
I understand you're experiencing issues with your customized Voiceflow chatbot not loading consistently on your website, and instead, the default Voiceflow chatbot appears. This can be frustrating, especially after attempting various troubleshooting steps. Here are some suggestions and best practices that might help resolve the issue:
- Ensure that the chatbot script is correctly initialized on every page of your website. For multi-page websites or single-page applications (SPAs), it's crucial to reinitialize the chatbot script whenever a new page loads or the route changes.
- Consider using the
window.voiceflow.chat.load() function with the correct project ID, runtime URL, and version ID to ensure that your customized chatbot is loaded. After loading, you can use window.voiceflow.chat.open() with a slight delay to ensure the chatbot renders properly.
- If you're targeting specific pages with customized messages or actions, make sure to clear previous messages or actions before pushing new ones to avoid conflicts or the default chatbot appearing.
- Adding custom variables or configurations, like userID, can help in personalizing the chat experience and ensuring consistency across page navigations.
For more detailed guidance on customizing and embedding your chatbot, including styling and proactive interactions, you might find the following resources helpful:
- Embed & Customize Styling
- Custom Configurations
These resources provide comprehensive information on how to effectively embed and customize your Voiceflow chatbot to match your website's needs and user interactions.rare-sapphireOP•2y ago
I changed the script based on your suggestion, but still the issue persists. Sometimes my chatbot loaded, sometimes it's the default one.
I used this script:
<script type="text/javascript">
(function(d, t) {
var v = d.createElement(t), s = d.getElementsByTagName(t)[0];
v.defer = true;
v.onload = function() {
// Load the chatbot with the correct project ID, runtime URL, and version ID
window.voiceflow.chat.load({
verify: { projectID: '6613f75b02339935c0d51b7a' },
url: 'https://general-runtime.voiceflow.com',
versionID: 'production'
});
// Add a slight delay to ensure the chatbot renders properly
setTimeout(function() {
// Clear previous messages or actions
window.voiceflow.chat.clearMessages();
// Open the chatbot
window.voiceflow.chat.open();
// Add custom variables or configurations (optional)
window.voiceflow.chat.setVariables({
userID: 'your-user-id'
});
}, 500); // Adjust the delay as needed
}
v.src = "https://cdn.voiceflow.com/widget/bundle.mjs";
v.type = "text/javascript";
s.parentNode.insertBefore(v, s);
})(document, 'script');
</script>
try a 1000 ms timeout
rare-sapphireOP•2y ago
thank you.
I added even 5000 ms. It didn't help. Any other suggestions?
@KimLooo @NiKo | Voiceflow @Deleted User please help
Are you still facing the issue?
I've tested on mobile and desktop and the chat load fine on my end.
