Adding Hidden Fields to Webflow
Attributer is a little bit of code you add to your website. It tracks where your visitors are coming from (I.e. Paid Search, Paid Social, Organic Search, etc) and writes the data into hidden fields you add to your forms which is then captured in Webflow and can be sent to your CRM and other tools.
In order for it to work, you need to add a series of hidden fields to your Webflow forms. Here’s how to do it:
Step 1: Add an Embed element to your form
The first step is to add an Embed element to your form. The best place to do this is just above the Submit button and below the last input field in your form that your visitors will actually complete.
Step 2: Add code to your Embed element
The next step is to add hidden fields by entering the raw HTML code. This is essentially what Webflow’s form builder adds to your page anyway, it’s just you are adding it by writing out raw HTML as opposed to using Webflow drag and drop builder.
The code you need to add to your form element is:
<input type="hidden" class="form-item field hidden" id="attributer-channel" name="attributer-channel" value="[channel]"> <input type="hidden" class="form-item field hidden" id="attributer-channeldrilldown1" name="attributer-channeldrilldown1" value="[channeldrilldown1]"> <input type="hidden" class="form-item field hidden" id="attributer-channeldrilldown2" name="attributer-channeldrilldown2" value="[channeldrilldown2]"> <input type="hidden" class="form-item field hidden" id="attributer-channeldrilldown3" name="attributer-channeldrilldown3" value="[channeldrilldown3]"> <input type="hidden" class="form-item field hidden" id="attributer-landingpage" name="attributer-landingpage" value="[landingpage]"> <input type="hidden" class="form-item field hidden" id="attributer-landingpagegroup" name="attributer-landingpagegroup" value="[landingpagegroup]">
Simply copy and paste the code from above and enter it into the Embed block
Step 3: Publish your site and test
Finally, publish your site and then navigate to the page your form is on. Complete the form and submit it.
If it’s working correctly, you should see a form submission in Project Settings > Forms that looks something like this:
As you can see, the Channel & Landing Page data captured by Attributer is contained in the ‘attributer-channel’ and ‘attributer-landingpage’ fields.
You can now send that data over to your CRM however you normally would (I.e. via Zapier, CSV downloads, etc).
The Attributer information will also be sent with the standard ‘New form submission’ emails that Webflow sends.
Can't find the answer you need? Contact us!
Our team are available to answer any questions you have