See code:
var getURL = window.location.href; ('.hs_registration_backlink.hs-registration_backlink.hs-fieldtype-text.field.hs-form-field').val(('.hs_registration_backlink.hs-registration_backlink.hs-fieldtype-text.field.hs-form-field').val()+getURL);
I was then advised to add this before the closing body tag on the website.
I haven't yet added this as I would have to go through our dev team to do that and I just wanted to make sure that the build is correct.
The main question I have is - will the hidden field value then be stored inside the property value of the contacts who filled the form in?
Has anyone tried this before, is there anything to look out for?
Hi @aaaaandrei, that should work except with our form embed code you need to tack on the .change() method. I made a quick example on my own page and was able to get the current location to populate the submission in a custom property called URL that I had created. Here's what my code looks like:
$(document).ready(function(){
var getURL = window.location;
$("input[name='url']").val(getURL).change();
});
Your code should work, but again, it would be good to test this out on a live page -- I can't get to your URL that you linked above, as it says it's insecure for me.
I am not getting the desired result with the same code @cbarley . However, I am testing the code on an external landing page created in Marketo right now. But this form will be hosted on multiple pages on WordPress in the future. So, I want the functionality to work.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta class="mktoString" mktoName="Variable 1" id="var1" default="This is a variable">
<title></title>
<style>
body {background:#fff;}
</style>
</head>
<body>
${var1}
<div class="mktoText" id="exampleText" mktoName="Example Text Area">
Hubspot form to test JS Code
</div>
<div>
<!-- [if lte IE 8]>
<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2-legacy.js"></script>
<![endif]-->
<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2.js"></script>
<script>
hbspt.forms.create({
region: "na1",
portalId: "MYPORTALID",
formId: "MYFORMID",
onFormReady: function($form) {
$form.find('input[name="content_download_page_url"]').val(window.location.href).change();
}
});
</script>
</div>
</body>
</html>
I had no luck will all above suggestions. I am using WordPress with the HubSpot plugin and finally got the following to pass the current URL to a hidden form field successfully. Yay me!
I had to use this again and felt I should elaborate.
Edit your hubspot form to include a hidden variable with an id such as page_url
Replace the hubspot form shortcode in your wordpress site with the script above
Change MYPORTALID to your hubspot portal id
Change MYFORMID to your hubspot form (its the long string in the url when editing the form)
Change the MYFIELD_NAME to your hidden hubspot form property field id
Submit the new form from your website
Go to your zap in zapier
Make sure you are using the new connection method to hubspot and not the old email system
Walk through the setup for the zap and refresh form data. You should see your recent submission. Choose that data for testing.
You may need to update your parsed email fields and you should now have the URL as a property variable
Sip Coffee and move on to next task... you are a hero.
Why would anyone need to do this? Your client is too cheap to pay for the full version of HubSpot and they are too lazy to form a new email when they receive an inquiry and just want to hit reply on their notification.
Hey @aaaaandrei, thanks for the link — taking a look at your site, it looks like your code is not within a script tag and is just being rendered as a string.
You'll need to put that code within <script></script> tags, or place your JS within the onFormSubmit method within the form like so:
Hi @aaaaandrei, not sure why that would happen, as I was able to get the current URL to populate with the code I used from my example when I placed it on my site. You shouldn't get all of that data unless there's another process, like a forms api call happening. I cannot see your screenshots, can you please send a link to the live site where you implemented this code?
It's a test website and as you pointed out, the browser may mark it as insecure. You should be able to access if you click advanced and then proceed anyway (in chrome).
So I ended up using the code recommended to us by our HS onboarding manager (the one mentioned in the description above) and I can confirm it fires but it doesn't pull the same data it did in my tests for some reason. If anything, it pulls much more data than expected. This is the value it added to the hidden field for my submission test:
{"rumScriptExecuteTime":6775.399999998626,"rumServiceResponseTime":7075.4999999917345,"rumFormRenderTime":1.1999999987892807,"rumTotalRenderTime":10517.299999992247,"rumTotalRequestTime":297.2999999910826,"lang":"en","renderRawHtml":"true","pageUrl":"https://ww1.qstopmba.com/events/qs-world-mba-tour/europe/st-petersburg","pageTitle":"World MBA Tour St. Petersburg TopMBA.com","source":"FormsNext-static-3.139","timestamp":1544523873001,"userAgent":"Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/70.0.3538.110 Safari/537.36","originalEmbedContext":{"portalId":"4668725","formId":"815284a8-4698-4b26-ad7b-26d27720147f","target":"#hbspt-form-1544523872855-1233246860","inlineMessage":true,"hutk":"dab4327b13fa0dc2ded837c4282adf98"},"formValidity":{"country":{"valid":true}},"formTarget":"#hbspt-form-1544523872855-1233246860","correlationId":"704c3575-7d60-4b7c-8c8c-42afeada880a","hutk":"dab4327b13fa0dc2ded837c4282adf98"}
When I checked HubSpot, the field was empty though. Do you know why HubSpot wouldn't be adding this data onto a contact property if it has been picked up in a (hidden) field?
Wn the body as opposed to the header or footer, not sure if this would have anything to do with it but I thought I'd mention it.
Do you know why the code pulls more than just the URL? Equally important, why is this not present inside the contact property, once the form has been submitted?
Hi @aaaaandrei, that should work except with our form embed code you need to tack on the .change() method. I made a quick example on my own page and was able to get the current location to populate the submission in a custom property called URL that I had created. Here's what my code looks like:
$(document).ready(function(){
var getURL = window.location;
$("input[name='url']").val(getURL).change();
});
Your code should work, but again, it would be good to test this out on a live page -- I can't get to your URL that you linked above, as it says it's insecure for me.
CBARLEY - can you help me write a script to capture a Hubspot /Wordpress form page URL? I'm trying to capture the unique URL used to enter the info and then save that in the HubSpot.
I tried the code on https://jsfiddle.net/ so I know it works in that it prints the page URL inside a field. (see attachment).
I'm more curious to confirm if that's all I need to store that value inside a contact property, and if there is a special place the code should go on the page (like above the HubSpot code for example).
So the goal would be to store the page URL inside a contact property for automation purposes. The form is present on multiple location pages and I would want to create a workflows using the URL field as an enrollment criteria.