# A/B Testing with Webflow and Visual Editor Run no-code A/B tests on a Webflow site with Statsig's Visual Editor (Sidecar). You install the Chrome extension, add the Visual Editor script to your Webflow site's custom code, then build test treatments and track conversion metrics without writing code. ## Use cases & considerations Webflow is a platform for businesses to design, build, and manage websites and their content without writing code. To experiment on a Webflow site, use [Statsig Visual Editor](https://docs.statsig.com/guides/sidecar-experiments/introduction) to build test treatments and assign users to experiments when they land on your site, without writing code. #### Install the Visual Editor Chrome extension Install the [Statsig Visual Editor Chrome extension](https://chromewebstore.google.com/detail/statsig-sidecar-v3/mmgjfcbidnlghegclgpkgegpdhbopjhn) and follow the [Visual Editor setup guide](https://docs.statsig.com/guides/sidecar-experiments/sidecar-v3#2-installing-the-chrome-extension-for-editing). The extension lets non-technical users build experiments and treatments directly on a live page. You can target by URL and configure text changes, style changes, image swaps, and custom JavaScript for advanced use cases. #### Add the Visual Editor script to your Webflow site 1. Log in to your Webflow dashboard and navigate to your project. 2. Access the **Custom Code** section in your project settings. 3. Copy the Visual Editor script tag from the [Visual Editor setup guide](https://docs.statsig.com/guides/sidecar-experiments/sidecar-v3#1-installing-the-sidecar-script) and replace `client-xxx` with your Client SDK key from [Settings > Keys & Environments](https://console.statsig.com/api_keys): `` {% figure %} ![Webflow custom code interface](https://docs.statsig.com/images/guides/webflow-sidecar-ab-test/210325253-6d118adf-8758-48fb-9c99-fdee6ff34f06.png) {% /figure %} 4. Paste the script tag into the `` section of your Webflow site's custom code area. 5. Save and publish your changes to apply the Visual Editor script across your website. 6. In Statsig Console, create an experiment and choose **Visual Editor** as the experiment type before launching the editor. #### Optional script parameters Add these query parameters to the script URL for additional client behavior controls: * `&reduceflicker=0` disables briefly hiding `` while the client initializes. #### Configure event tracking and metrics Statsig provides several approaches for tracking events when using Visual Editor. You can use built-in [Autocapture](https://docs.statsig.com/webanalytics/autocapture/) tracking or set up custom event logging. For detailed guidance, go to [Visual Editor Setup & Usage](https://docs.statsig.com/guides/sidecar-experiments/sidecar-v3#metrics) and the [event tracking documentation](https://docs.statsig.com/guides/sidecar-experiments/measuring-experiments). #### Debugging and troubleshooting If you encounter issues during integration or experimentation: * Verify that you correctly placed the Visual Editor script tag in the `` section of your Webflow site. * Confirm you're using the latest package URL: `statsig-sidecar-v2-beta`. * Check the browser's console for any JavaScript errors that may indicate problems with the script. * Ensure you created your experiment as a **Visual Editor** experiment and that it's active in Statsig Console. * Confirm you installed the Visual Editor Chrome extension. * Go to the [Visual Editor setup documentation](https://docs.statsig.com/guides/sidecar-experiments/sidecar-v3) for any missed steps.