Grab referrer as hidden field

Hi all,

I’m trying to get the referring domain as a hidden field whenever someone submits a form. Anyone here knows how I can accomplish this?

Thanks!

In the Webflow designer:

  • Add a field to your form.
  • Make sure that this field is not a required field.
  • Give the field an ID of hidden-field (instructions here)
  • Set the new field to display none.

Then on the page with the form, add this snippet to the body code.

<script>
// Make a reference to the form field
const hiddenField = document.getElementById('hidden-field');

// Get the referrer domain
const referrer = document.referrer.split('/')[2];

// If there is a referrer then set the field value
if (referrer) {
    hiddenField.value = referrer;
}
</script>
2 Likes

Hi @jasondark sorry for replying so late, missed the email notification in my inbox. Thanks a lot, this was helpful setting it up!

1 Like

Hey jason, what does the refferal URL have to look like for this to work?

Doesn’t seem to be catching it for me.

It just needs to be a URL. Not all pages will have the referrer set necessarily.

1 Like

Would this work if for example

Facebook → Home Page->Contact Us (Form Submit)

Hidden Field = Facebook?

Hi! A follow up on this subject. I get everything to work but instead of getting the full url like “website.com/page/example” I only get “website.com” as a referrer. Anyone knows how to get the full URL?

Thanks!

Hi Christian, I just had the same issue, you have to remove the bold part where it says .split(‘/’)[2]

const referrer = document.referrer.split(‘/’)[2];

to this:

const referrer = document.referrer;

1 Like