Install on Webflow

Webflow has two places for code that work with Voxtrics surveys: Custom code in the site settings for a popup, a popup with no button or a chat survey on every page, and the Code Embed element for an inline form placed on a page. Webflow allows custom code only with a paid plan: a site plan, or a Core, Growth, Agency or Freelancer workspace.

Before you start

  1. In Domains, add the domain your Webflow site is published on, for example example.com, or its Webflow address such as your-site.webflow.io. A survey loads only on the domain it belongs to.
  2. Create the survey under that domain and publish it.
  3. Copy the survey's ID: on the Surveys list, open the survey's embed code. The ID is the formId value.
  1. In your Webflow dashboard, open the site's settings and choose Custom code in the menu on the left.

  2. In Footer code, paste this, with your survey's ID in place of YOUR_SURVEY_ID:

    <script src="https://feedback.voxtrics.io/assets/prod/index.iife.js"></script>
    <script>
      window.SiteUtilsFeedback.initiateFeedbackModule({ formId: 'YOUR_SURVEY_ID' });
    </script>
    

    Footer code runs at the end of every page, after the page itself has loaded.

  3. Click Save changes, then publish the site.

Site settings → Custom code (1). With a paid plan, the Custom Code section (2) holds the Head code and Footer code fields.

Webflow's own guide to the Head code and Footer code fields: Custom code in head and body tags.

Inline form: the Code Embed element

  1. In the Designer, open the Add panel with the + button and drag Code Embed to where the survey should appear.

  2. Paste your survey's embed code, with your survey's ID in place of YOUR_SURVEY_ID:

    <div id="feedback-widget"></div>
    
    <script src="https://feedback.voxtrics.io/assets/prod/index.iife.js"></script>
    <script>
      window.SiteUtilsFeedback.initiateFeedbackModule({
        formId: 'YOUR_SURVEY_ID',
        container: document.getElementById('feedback-widget'),
      });
    </script>
    
  3. Save and close the code editor, then publish the site.

The + button opens the Add panel (1), where Code Embed (2) is found.

Webflow's own guide to the Code Embed element and its code editor: Custom code embed.

If the survey doesn't appear

  • Check that the survey is published and belongs to the domain your site is published on. A domain added as example.com covers www.example.com too, but not your-site.webflow.io.
  • Publish the site again after changing custom code: Webflow adds it when the site is published.
  • On-site and email surveys aren't placed on a site. Share their link instead.