Documentation
Integrate VolaCRM widgets with React or Next.js
Use the current workspace-generated Chat and Contact Us embed codes, publish your website, and verify delivery to the correct VolaCRM workspace.
Before you start
Choose the VolaCRM workspace that will receive messages, generate the appropriate embed code, and save your website domain in its configuration. Copy the complete generated code; do not enter guessed identifiers or expose account passwords in your website.
Platform steps
Use a browser-side component or the framework’s script-loading facility to install the generated widget code. Keep DOM access on the client; do not execute browser widget scripts during server rendering. Follow the generated placement for Contact Us so the form appears in the intended section.
Ensure that component remounts and client-side navigation do not install duplicate scripts or duplicate form containers. Keep site-wide Chat in a persistent layout when appropriate. Test both a direct page load and navigation from another page; development hot reload alone is not a production test.
Verify the published integration
- Open the published website in a fresh browser session and check that the intended form or chat appears.
- Send a clearly labeled test inquiry or chat message.
- Open the receiving workspace and confirm that the test appears there.
- If delivery fails, check the saved domain, generated identifiers, browser console, and network response before changing the code.
Use the illustrated setup guide for the current configuration screens. Existing embed URLs can continue to work, but old sample attributes should not replace newly generated code.