Generic Demo Page
1<form id="wf-form-Go-Harness-Demo-Form-Generic" name="wf-form-Go-Harness-Demo-Form-Generic" data-name="Go Harness Demo Form –&nbsp;Generic" action="https://webto.salesforce.com/servlet/servlet.WebToLead?encoding=UTF-8&amp;orgId=00D5f000003wwOg" method="post" class="form" data-wf-page-id="664f5ebed2ad6a495feabb5b" data-wf-element-id="74bb5321-883d-ae80-88fa-3843df8aa128" aria-label="Go Harness Demo Form –&nbsp;Generic">
2	
3<!--🟢 Standard Fields Here -->     
4    
5    <div id="w-node-_74bb5321-883d-ae80-88fa-3843df8aa129-5feabb5b" class="form-field-wrapper">
6		<input class="form-input w-input" maxlength="256" name="First-Name" data-name="First Name" placeholder="First name*" type="text" id="First-Name" required="">
7		<div style="position: relative !important; height: 0px !important; width: 0px !important; float: left !important;"></div>
8	</div>
9	<div id="w-node-_74bb5321-883d-ae80-88fa-3843df8aa12d-5feabb5b" class="form-field-wrapper"><input class="form-input w-input" maxlength="256" name="Last-Name" data-name="Last Name" placeholder="Last name*" type="text" id="Last-Name" required=""></div>
10	<div id="w-node-_74bb5321-883d-ae80-88fa-3843df8aa131-5feabb5b" class="form-field-wrapper"><input class="form-input w-input" maxlength="256" name="Phone" data-name="Phone" placeholder="(123) 456-7890" type="tel" id="Phone"></div>
11	<div id="w-node-_74bb5321-883d-ae80-88fa-3843df8aa135-5feabb5b" class="form-field-wrapper"><input class="form-input w-input" maxlength="256" name="Work-Email" data-name="Work Email" placeholder="Work email*" type="email" id="Work-Email" required=""></div>
12	<div id="w-node-_74bb5321-883d-ae80-88fa-3843df8aa139-5feabb5b" class="form-field-wrapper"><input class="form-input w-input" maxlength="256" name="Job-Title" data-name="Job Title" placeholder="Job title*" type="text" id="Job-Title" required=""></div>
13	<div id="w-node-_74bb5321-883d-ae80-88fa-3843df8aa13d-5feabb5b" class="form-field-wrapper"><input class="form-input w-input" maxlength="256" name="Website" data-name="Website" placeholder="Organization website*" type="text" id="Website" required=""></div>
14	<div id="w-node-_74bb5321-883d-ae80-88fa-3843df8aa141-5feabb5b" class="form-field-wrapper"><input class="form-input w-input" maxlength="256" name="Organization" data-name="Organization" placeholder="Organization name*" type="text" id="Organization" required=""></div>
15	<div id="w-node-_74bb5321-883d-ae80-88fa-3843df8aa145-5feabb5b" class="demo_industry-wrapper">
16		<label for="industry" id="industry_pcl" class="field-label w-node-_74bb5321-883d-ae80-88fa-3843df8aa146-5feabb5b">What industry are you in?*</label>
17		<div aria-labelledby="industry_pcl" id="w-node-_74bb5321-883d-ae80-88fa-3843df8aa148-5feabb5b" class="demo_industry-radio-group">
18
19<!--🟢 Industry Fields Here -->    
20
21            <label class="form-radio w-radio"><input type="radio" name="Industry" id="Finance" data-name="Industry" required="" class="w-form-formradioinput form-radio-icon w-radio-input" value="Finance"><span class="form-radio-label w-form-label" for="Finance">Financial institution</span></label><label class="form-radio w-radio"><input type="radio" name="Industry" id="Not-For-Profit" data-name="Industry" required="" class="w-form-formradioinput form-radio-icon w-radio-input" value="Not For Profit"><span class="form-radio-label w-form-label" for="Not-For-Profit">Nonprofit</span></label><label class="form-radio w-radio"><input type="radio" name="Industry" id="Other" data-name="Industry" required="" class="w-form-formradioinput form-radio-icon w-radio-input" value="Other"><span class="form-radio-label w-form-label" for="Other">Other</span></label><input class="form-input industry-other w-input" maxlength="256" name="Other-Industry" data-name="Other Industry" placeholder="" type="text" id="Other-Industry">
22			
23<!--🟢 Script To Show/Hide "Other" Industry Field Here -->    
24            
25            <div class="hide w-embed w-script">
26				<!-- Show/Hide Other Industry Field -->
27				<script>
28					function handleIndustryRadios() {
29					  const industryRadios = document.querySelectorAll('input[name="Industry"]');
30					  const otherField = document.getElementById('Other-Industry');
31					
32					  if (!industryRadios.length || !otherField) {
33					    return;
34					  }
35					
36					  industryRadios.forEach(radio => {
37					    radio.addEventListener('change', () => {
38					      if (radio.value === 'Other') {
39					        otherField.style.display = 'block';
40					        otherField.required = true;
41					      } else {
42					        otherField.style.display = 'none';
43					        otherField.required = false;
44					      }
45					    });
46					  });
47					}
48					
49					document.addEventListener('DOMContentLoaded', handleIndustryRadios);
50				</script>
51			</div>
52		</div>
53	</div>
54	<div id="w-node-_74bb5321-883d-ae80-88fa-3843df8aa157-5feabb5b" class="form-field-wrapper"><input type="submit" data-wait="Please wait..." class="button max-width-full w-button" value="Book a demo"></div>
55	<div id="w-node-_74bb5321-883d-ae80-88fa-3843df8aa159-5feabb5b" class="form-field-wrapper">
56		<div class="text-size-tiny text-color-grey">By submitting this form, you are opting in to receive future communications from Harness. You may unsubscribe at any time.</div>
57	</div>
58	<div id="w-node-_889047d2-3a1d-7da1-7bac-2e48676e8852-5feabb5b" class="demo_form-scripts w-embed w-script">
59    
60<!--🟢 Query Parameters Here -->    
61    
62		<!-- Query Params for Tracking -->
63		<input type="hidden" fs-queryparam-name="sf_campaignId" id="00NNs000000tSyH" maxlength="255" name="00NNs000000tSyH" size="20">
64		<input type="hidden" fs-queryparam-name="utm_campaignId" id="00NNs000000tSyI" maxlength="255" name="00NNs000000tSyI" size="20"><br>
65		<input type="hidden" fs-queryparam-name="utm_source" id="00N5f00000gECH3" maxlength="255" name="00N5f00000gECH3" size="20">
66		<input type="hidden" fs-queryparam-name="utm_medium" id="00N5f00000gECGf" maxlength="255" name="00N5f00000gECGf" size="20">
67		<input type="hidden" fs-queryparam-name="utm_campaign" id="00N5f00000gECH8" maxlength="255" name="00N5f00000gECH8" size="20">
68		<input type="hidden" fs-queryparam-name="utm_content" id="00N5f00000gECHI" maxlength="255" name="00N5f00000gECHI" size="20">
69		<input type="hidden" fs-queryparam-name="utm_term" id="00N5f00000gECHD" maxlength="255" name="00N5f00000gECHD" size="20">
70		<input type="hidden" fs-queryparam-name="gclid" id="00NNs000000X8mn" maxlength="255" name="00NNs000000X8mn" size="20">
71		<input type="hidden" fs-queryparam-name="plan">
72		
73<!--🟢 Salesforce Fields Here -->    
74        
75        <!-- Salesforce -->
76		<input type="hidden" name="oid" value="00D5f000003wwOg">
77		<input type="hidden" name="lead_source" value="Inbound">
78		<input type="hidden" name="retURL" value="https://go-harness-js.webflow.io/demo/harness?thank-you">
79		
80        
81        <!-- Animate Form Labels 
82			<style>
83			.form-input:focus + .field-label,
84			.form-input:not(:placeholder-shown) + .field-label {
85			  top: -12px;
86			  left: 12px;
87			  color: var(--primary--fi-navy);
88			}
89			</style> -->
90		<!-- Update retURL based on chosen industry -->
91		<script>
92			document.addEventListener('DOMContentLoaded', function() {
93			    const radioGroup = document.querySelector('.demo_industry-radio-group');
94			    const retURLInput = document.querySelector('input[name="retURL"]');
95			
96			    radioGroup.addEventListener('change', function(event) {
97			        const selectedValue = event.target.value;
98			
99			        if (selectedValue === 'Financial institution') {
100			            retURLInput.value = 'https://go-harness-js.webflow.io/demo/fi?thank-you';
101			        } else if (selectedValue === 'Nonprofit') {
102			            retURLInput.value = 'https://go-harness-js.webflow.io/demo/nonprofit?thank-you';
103			        } else {
104			            retURLInput.value = 'https://go-harness-js.webflow.io/demo/harness?thank-you';
105			        }
106			    });
107			});
108		</script>
109	</div>
110</form>
Nonprofit Demo Page
<form id="wf-form-Go-Harness-Demo-Form-Nonprofit" name="wf-form-Go-Harness-Demo-Form-Nonprofit" data-name="Go Harness Demo Form –&nbsp;Nonprofit" action="https://webto.salesforce.com/servlet/servlet.WebToLead?encoding=UTF-8&amp;orgId=00D5f000003wwOg" method="post" class="form" data-wf-page-id="664f6cbbadad66b3a721faf7" data-wf-element-id="74bb5321-883d-ae80-88fa-3843df8aa128" aria-label="Go Harness Demo Form –&nbsp;Nonprofit">
	
<!--🟢 Standard Fields Here -->    
    
    <div id="w-node-_74bb5321-883d-ae80-88fa-3843df8aa129-a721faf7" class="form-field-wrapper">
		<input class="form-input w-input" maxlength="256" name="First-Name" data-name="First Name" placeholder="First name*" type="text" id="First-Name" required="">
		<div style="position: relative !important; height: 0px !important; width: 0px !important; float: left !important;"></div>
	</div>
	<div id="w-node-_74bb5321-883d-ae80-88fa-3843df8aa12d-a721faf7" class="form-field-wrapper"><input class="form-input w-input" maxlength="256" name="Last-Name" data-name="Last Name" placeholder="Last name*" type="text" id="Last-Name" required=""></div>
	<div id="w-node-_74bb5321-883d-ae80-88fa-3843df8aa131-a721faf7" class="form-field-wrapper"><input class="form-input w-input" maxlength="256" name="Phone" data-name="Phone" placeholder="(123) 456-7890" type="tel" id="Phone"></div>
	<div id="w-node-_74bb5321-883d-ae80-88fa-3843df8aa135-a721faf7" class="form-field-wrapper"><input class="form-input w-input" maxlength="256" name="Work-Email" data-name="Work Email" placeholder="Work email*" type="email" id="Work-Email" required=""></div>
	<div id="w-node-_74bb5321-883d-ae80-88fa-3843df8aa139-a721faf7" class="form-field-wrapper"><input class="form-input w-input" maxlength="256" name="Job-Title" data-name="Job Title" placeholder="Job title*" type="text" id="Job-Title" required=""></div>
	<div id="w-node-_74bb5321-883d-ae80-88fa-3843df8aa13d-a721faf7" class="form-field-wrapper"><input class="form-input w-input" maxlength="256" name="Website" data-name="Website" placeholder="Organization website*" type="text" id="Website" required=""></div>
	<div id="w-node-_74bb5321-883d-ae80-88fa-3843df8aa141-a721faf7" class="form-field-wrapper"><input class="form-input w-input" maxlength="256" name="Organization" data-name="Organization" placeholder="Organization name*" type="text" id="Organization" required=""></div>
	<div id="w-node-_74bb5321-883d-ae80-88fa-3843df8aa157-a721faf7" class="form-field-wrapper"><input type="submit" data-wait="Please wait..." class="button max-width-full w-button" value="Let's chat"></div>
	<div id="w-node-_74bb5321-883d-ae80-88fa-3843df8aa159-a721faf7" class="form-field-wrapper">
		<div class="text-size-tiny text-color-grey">By submitting this form, you are opting in to receive future communications from Harness. You may unsubscribe at any time.</div>
	</div>
	<div id="w-node-_889047d2-3a1d-7da1-7bac-2e48676e8852-a721faf7" class="demo_form-scripts w-embed">
		
<!--🟢 Query Parameters Here -->    
        
        <!-- Query Params for Tracking -->
		<input type="hidden" fs-queryparam-name="sf_campaignId" id="00NNs000000tSyH" maxlength="255" name="00NNs000000tSyH" size="20">
		<input type="hidden" fs-queryparam-name="utm_campaignId" id="00NNs000000tSyI" maxlength="255" name="00NNs000000tSyI" size="20"><br>
		<input type="hidden" fs-queryparam-name="utm_source" id="00N5f00000gECH3" maxlength="255" name="00N5f00000gECH3" size="20">
		<input type="hidden" fs-queryparam-name="utm_medium" id="00N5f00000gECGf" maxlength="255" name="00N5f00000gECGf" size="20">
		<input type="hidden" fs-queryparam-name="utm_campaign" id="00N5f00000gECH8" maxlength="255" name="00N5f00000gECH8" size="20">
		<input type="hidden" fs-queryparam-name="utm_content" id="00N5f00000gECHI" maxlength="255" name="00N5f00000gECHI" size="20">
		<input type="hidden" fs-queryparam-name="utm_term" id="00N5f00000gECHD" maxlength="255" name="00N5f00000gECHD" size="20">
		<input type="hidden" fs-queryparam-name="gclid" id="00NNs000000X8mn" maxlength="255" name="00NNs000000X8mn" size="20">
		<input type="hidden" data-name="plan" name="plan" fs-queryparam-name="plan">
		<input type="hidden" data-name="referringpage" name="referringpage" fs-queryparam-name="referringpage">

		
<!--🟢 Salesforce Fields Here -->    
        
        <!-- Salesforce -->
		<input type="hidden" name="oid" value="00D5f000003wwOg">
		<input type="hidden" name="lead_source" value="Inbound">
		<input type="hidden" name="retURL" value="https://go-harness-js.webflow.io/demo/nonprofit?thank-you">
		<input type="hidden" name="industry" value="Not For Profit">
		
        
        
        <!-- Animate Form Labels 
			<style>
			.form-input:focus + .field-label,
			.form-input:not(:placeholder-shown) + .field-label {
			  top: -12px;
			  left: 12px;
			  color: var(--primary--fi-navy);
			}
			</style>-->
	</div>
</form>
FI Demo Page
<form id="wf-form-Go-Harness-Demo-Form-FI" name="wf-form-Go-Harness-Demo-Form-FI" data-name="Go Harness Demo Form –&nbsp;FI" action="https://webto.salesforce.com/servlet/servlet.WebToLead?encoding=UTF-8&amp;orgId=00D5f000003wwOg" method="post" class="form" data-wf-page-id="664f73923919e72669127243" data-wf-element-id="e1ed2eb5-fbdd-602e-1e96-fe8d7564ca4e" aria-label="Go Harness Demo Form –&nbsp;FI">
	
<!--🟢 Standard Fields Here -->    
    
    <div id="w-node-e1ed2eb5-fbdd-602e-1e96-fe8d7564ca4f-69127243" class="form-field-wrapper">
		<input class="form-input w-input" maxlength="256" name="First-Name" data-name="First Name" placeholder="First name*" type="text" id="First-Name" required="">
		<div data-lastpass-icon-root="" style="position: relative !important; height: 0px !important; width: 0px !important; float: left !important;"></div>
	</div>
	<div id="w-node-e1ed2eb5-fbdd-602e-1e96-fe8d7564ca53-69127243" class="form-field-wrapper"><input class="form-input w-input" maxlength="256" name="Last-Name" data-name="Last Name" placeholder="Last name*" type="text" id="Last-Name" required=""></div>
	<div id="w-node-e1ed2eb5-fbdd-602e-1e96-fe8d7564ca57-69127243" class="form-field-wrapper"><input class="form-input w-input" maxlength="256" name="Phone" data-name="Phone" placeholder="(123) 456-7890" type="tel" id="Phone"></div>
	<div id="w-node-e1ed2eb5-fbdd-602e-1e96-fe8d7564ca5b-69127243" class="form-field-wrapper"><input class="form-input w-input" maxlength="256" name="Work-Email" data-name="Work Email" placeholder="Work email*" type="email" id="Work-Email" required=""></div>
	<div id="w-node-e1ed2eb5-fbdd-602e-1e96-fe8d7564ca5f-69127243" class="form-field-wrapper"><input class="form-input w-input" maxlength="256" name="Job-Title" data-name="Job Title" placeholder="Job title*" type="text" id="Job-Title" required=""></div>
	<div id="w-node-e1ed2eb5-fbdd-602e-1e96-fe8d7564ca63-69127243" class="form-field-wrapper"><input class="form-input w-input" maxlength="256" name="Website" data-name="Website" placeholder="Organization website*" type="text" id="Website" required=""></div>
	<div id="w-node-e1ed2eb5-fbdd-602e-1e96-fe8d7564ca67-69127243" class="form-field-wrapper"><input class="form-input w-input" maxlength="256" name="Organization" data-name="Organization" placeholder="Organization name*" type="text" id="Organization" required=""></div>
	<div id="w-node-e1ed2eb5-fbdd-602e-1e96-fe8d7564ca7d-69127243" class="form-field-wrapper"><input type="submit" data-wait="Please wait..." class="button max-width-full w-button" value="Let's chat"></div>
	<div id="w-node-e1ed2eb5-fbdd-602e-1e96-fe8d7564ca7f-69127243" class="form-field-wrapper">
		<div class="text-size-tiny text-color-grey">By submitting this form, you are opting in to receive future communications from Harness. You may unsubscribe at any time.</div>
	</div>
	<div id="w-node-e1ed2eb5-fbdd-602e-1e96-fe8d7564ca82-69127243" class="demo_form-scripts w-embed">
		
<!--🟢 Query Parameter Fields Here -->    
        
        <!-- Query Params for Tracking -->
		<input type="hidden" fs-queryparam-name="sf_campaignId" id="00NNs000000tSyH" maxlength="255" name="00NNs000000tSyH" size="20">
		<input type="hidden" fs-queryparam-name="utm_campaignId" id="00NNs000000tSyI" maxlength="255" name="00NNs000000tSyI" size="20"><br>
		<input type="hidden" fs-queryparam-name="utm_source" id="00N5f00000gECH3" maxlength="255" name="00N5f00000gECH3" size="20">
		<input type="hidden" fs-queryparam-name="utm_medium" id="00N5f00000gECGf" maxlength="255" name="00N5f00000gECGf" size="20">
		<input type="hidden" fs-queryparam-name="utm_campaign" id="00N5f00000gECH8" maxlength="255" name="00N5f00000gECH8" size="20">
		<input type="hidden" fs-queryparam-name="utm_content" id="00N5f00000gECHI" maxlength="255" name="00N5f00000gECHI" size="20">
		<input type="hidden" fs-queryparam-name="utm_term" id="00N5f00000gECHD" maxlength="255" name="00N5f00000gECHD" size="20">
		<input type="hidden" fs-queryparam-name="gclid" id="00NNs000000X8mn" maxlength="255" name="00NNs000000X8mn" size="20">
		<input type="hidden" fs-queryparam-name="plan">
		
<!--🟢 Salesforce Fields Here -->    
        
        <!-- Salesforce -->
		<input type="hidden" name="oid" value="00D5f000003wwOg">
		<input type="hidden" name="lead_source" value="Inbound">
		<input type="hidden" name="retURL" value="https://go-harness-js.webflow.io/demo/fi?thank-you">
		<input type="hidden" name="industry" value="Finance">
		
        
        <!-- Animate Form Labels 
			<style>
			.form-input:focus + .field-label,
			.form-input:not(:placeholder-shown) + .field-label {
			  top: -12px;
			  left: 12px;
			  color: var(--primary--fi-navy);
			}
			</style>-->
	</div>
</form>
Nonprofit SEM Form
<form id="wf-form-sem-demo" name="wf-form-SEM-Demo-Form" data-name="SEM Demo Form" action="https://webto.salesforce.com/servlet/servlet.WebToLead?encoding=UTF-8&amp;orgId=00D5f000003wwOg" method="post" data-wf-page-id="6655c28b5375eb7c4022aaac" data-wf-element-id="ddd9601a-5ae6-8a1e-d1b3-e719a678486c" aria-label="SEM Demo Form">
	
<!--🟢 Query Parameter Fields Here -->    
    
    <div class="demo_scripts w-embed">
		<!-- Query Params for Tracking -->
		<input type="hidden" fs-queryparam-name="sf_campaignId" id="00NNs000000tSyH" maxlength="255" name="00NNs000000tSyH" size="20">
		<input type="hidden" fs-queryparam-name="utm_campaignId" id="00NNs000000tSyI" maxlength="255" name="00NNs000000tSyI" size="20"><br>
		<input type="hidden" fs-queryparam-name="utm_source" id="00N5f00000gECH3" maxlength="255" name="00N5f00000gECH3" size="20">
		<input type="hidden" fs-queryparam-name="utm_medium" id="00N5f00000gECGf" maxlength="255" name="00N5f00000gECGf" size="20">
		<input type="hidden" fs-queryparam-name="utm_campaign" id="00N5f00000gECH8" maxlength="255" name="00N5f00000gECH8" size="20">
		<input type="hidden" fs-queryparam-name="utm_content" id="00N5f00000gECHI" maxlength="255" name="00N5f00000gECHI" size="20">
		<input type="hidden" fs-queryparam-name="utm_term" id="00N5f00000gECHD" maxlength="255" name="00N5f00000gECHD" size="20">
		<input type="hidden" fs-queryparam-name="gclid" id="00NNs000000X8mn" maxlength="255" name="00NNs000000X8mn" size="20">
		<input type="hidden" fs-queryparam-name="plan">
		
<!--🟢 Salesforce Fields Here -->    
        
        <!-- Salesforce -->
		<input type="hidden" name="oid" value="00D5f000003wwOg">
		<input type="hidden" name="lead_source" value="Inbound">
		<input type="hidden" name="retURL" value="https://go-harness-js.webflow.io/campaign?thank-you">
		
        
        <style>
			select {
			appearance: none !important;
			-webkit-appearance: none !important;
			-moz-appearance: none !important;
			}
		</style>
	</div>
	<div>
		<div class="sem-hero_form-description">Schedule a zero-pressure, one-on-one session to see how we can help generate more donations for your nonprofit—for <strong>FREE</strong>.</div>
		
<!--🟢 Standard Fields Here -->   
        
        <div class="sem-hero_form-grid">
			<div id="w-node-ddd9601a-5ae6-8a1e-d1b3-e719a6784875-4022aaac" class="sem-hero_form-field-wrapper">
				<div class="text-weight-bold">First Name *</div>
				<input class="form-input is-small w-input" maxlength="256" name="first_name" data-name="First Name" placeholder="Your first name" type="text" id="first_name" required="">
				<div data-lastpass-icon-root="" style="position: relative !important; height: 0px !important; width: 0px !important; float: left !important;"></div>
			</div>
			<div class="sem-hero_form-field-wrapper">
				<div class="text-weight-bold">Last Name *</div>
				<input class="form-input is-small w-input" maxlength="256" name="last_name" data-name="Last Name" placeholder="Your last name" type="text" id="last_name" required="">
			</div>
			<div class="sem-hero_form-field-wrapper">
				<div class="text-weight-bold">Phone *</div>
				<input class="form-input is-small w-input" maxlength="256" name="Phone" data-name="Phone" placeholder="(123) 456-7890" type="tel" id="Phone-3" required="">
			</div>
			<div class="sem-hero_form-field-wrapper">
				<div class="text-weight-bold">Email *</div>
				<input class="form-input is-small w-input" maxlength="256" name="email" data-name="Email" placeholder="email@address.com" type="email" id="email" required="">
			</div>
			<div id="w-node-ddd9601a-5ae6-8a1e-d1b3-e719a6784885-4022aaac" class="sem-hero_form-field-wrapper">
				<div class="text-weight-bold">Organization *</div>
				<input class="form-input is-small w-input" maxlength="256" name="company" data-name="Company" placeholder="Organization name" type="text" id="company" required="">
			</div>
		</div>
		<input type="submit" data-wait="Please wait..." class="button align-center w-button" value="Let’s chat">
		<div class="sem-hero_disclaimer">By submitting this form, you are opting in to receive future communications from Harness. You may unsubscribe at any time.</div>
	</div>
</form>