Are you looking to replace our boring and dull contact us page with some lively and vibrant, whil still being notified when someone submits the form? Then leverage our HAPIform to enable this.
​

Start by creating a new contact page and setting the marketing keyword to contact.

Then setup your form by ensuring you wrap your fields in an ID along with setting the ID and Name of the fields to match available inputs.
​

Then setup the JS with a HAPIform call to process the data on the request. When you set the reference_type to contact it will capture the first_name, last_name, email, mobile_number, opt_in_email, opt_in_sms and affiliate_no along with message for the email content along with company_email as the person who should receive the contact us e-mail.

§(function(){ // var updated_profile_photo = ''; HAPIform({ trigger: '#submitHapiForm', wrapper: '#pvForm', reference_type: 'contact', action: 'edit', skip: ['opt_in_email'], // HapiForm Trigger button clicked triggered: function(){ myApp.showPleaseWait(); }, // Add custom data before submitting before: function(settings, data){ if(§(settings.wrapper).find('#profile_alert').length !== 0){ §(settings.wrapper).find('#profile_alert').remove(); } data.push({ 'key' : 'opt_in_email', 'value' : (§("#opt_in_email").attr("checked")) ? "Y" : "N" }); return data; }, // Form was successfully submitted success: function(settings, response){ var alert_elem = §(settings.wrapper).find('#profile_alert'); if(alert_elem.length === 0){ alert_elem = §('<div>', { 'class' : 'row', 'id' : 'profile_alert', 'html' : '<div class="col-12"><div class="alert alert-success">Your request was submitted.</div></div>' }); §(settings.wrapper).prepend(alert_elem); } else { §(alert_elem).html('<div class="col-12"><div class="alert alert-success">Your request was submitted.</div></div>'); } window.scrollTo({top: 0, behavior: 'smooth'}); }, // Error submitting Form fail: function(settings, response){ var alert_elem = §(settings.wrapper).find('#profile_alert'); if(alert_elem.length === 0){ alert_elem = §('<div>', { 'class' : 'row', 'id' : 'profile_alert', 'html' : '<div class="col-12"><div class="alert alert-danger">There was a problem submitting your request.</div></div>' }); §(settings.wrapper).prepend(alert_elem); } else { §(alert_elem).html('<div class="col-12"><div class="alert alert-danger">There was a problem submitting your request.</div></div>'); } window.scrollTo({top: 0, behavior: 'smooth'}); }, always: function(settings){ myApp.hidePleaseWait(); } });});

Once someone submits, they will be added to the CRM and you will receive an e-mail.
​