Streaming live at 10am (PST)

How to get 'Domain Name' variable on Webflow Form?


#1

Hi Everyone,

I have a webflow site which is published to two different domains (SynergySpecialists.com and InhouseDDS.net).

Can anyone suggest a code or trick on how to differentiate the Forms submitted from each site? My client wants to have these two exact clone site, but they need to know which Form coming from which site.

Example of the Form page:
SynergySpecialist: http://www.synergyspecialists.com/specialists
InhouseDDS.net: http://www.inhousedds.net/specialists

I have search for variables available on webflow Form page. But there is no ‘domain’ variable available. I only see {{siteName}}, {{formName}}, etc.

I’ve got an idea to simply duplicate the site and then publish them. But the problem is the site is updated pretty often. Duplicating, changing the Form info etc before publishing the site everytime there are changes will be quite a hassle.

Any help will be very much appreciated!

Thanks everyone :slightly_smiling:
Agus


#2

Insert a Webflow text field into your form, give it a unique class name that is not used anywhere else in the website (let's use myHiddenTextfield). Set it to display none.

Now paste this in Site Settings > Custom Code > Footer Code:

<script>
var Webflow = Webflow || [];
Webflow.push(function() {
  $('.myHiddenTextfield').val(location.hostname);
});
</script>

#3

Hi Sam,

Thanks for your kind suggestion :slightly_smiling:

I’ve tried to copy the code to the Footer Code in site setting, and then add an input text into the form. But what I got is the ‘myHiddenTextfield’ without any content in the email along with other fields data. Is there any step that I missed? I’m not familiar with coding, so I literally do just what you instructed.

Thanks again.


#4

I don't see it anywhere, perhaps you can provide public share links to both projects?


#5

Here's the link: http://synergy-specialist-484a1c-d6ff72e0d25c6.webflow.io/specialists

It is not the SynergySpecialists or InhouseDDS because I test it out on webflow dummy site first before I'm sure it works. I have included the myHiddenTextfield inside the form on that page.


#6

I see the problem now. I forgot Webflow makes the classname lowercase. But you have also set the ID as myHiddenTextfield, so let's use that instead.

In the code, change .myHiddenTextfield to #myHiddenTextfield. Republish and you're all set.

Note that if you change the ID, you also need to change the code as well.


#7

Thanks! It really works.

But honestly I don't understand why it works after we change the class to ID?

Forgive my little knowledge of coding. Do you have good reference where I can improve my coding knowledge?


#8

JavaScript is case-sensitive.

When you key in myHiddenTextfield into the designer, the actual published site classname is converted into lowercase, that's why the selector couldn't find that element.

Google


#9

Ok. Thanks a lot. You solved my problem :grinning:


#10