Navattic JS

introduction navattic js is a javascript widget that can be installed on your web properties to help identify visitors who do not fill out a navattic form directly in your demo integrate with event based analytics platforms such as ga4, mixpanel, and more navattic js is disabled by default in all workspaces however, navattic workspace admins can enable it using the setup steps below setup 1\ install navattic js install navattic js on any of your web properties where you will be embedding demos, identifying visitors, or passing demo events on to other analytics platforms the resources referenced below are available in your workspace's settings > navattic js 1 1 configure your installation in your navattic workspace, navigate to settings > navattic js toggle on the information you would like to track before copying the snippet navattic js will allow you to track auto form tracking automatically capture visitor information from external forms (i e , forms embedded outside of your navattic demo) for example, if a visitor completes a hubspot form elsewhere on your marketing website, their email address will now be surfaced in the navattic visitors tab and available to use in navattic playbooks (i e , integrations) this is the automatic method of "manually send website data to navattic using javascript ( see here )" note this will capture forms that are embedded on the same page that navattic js is running on (eg hubspot, marketo, or vanilla html forms) it will not be able to capture forms embedded in iframes (for example, pardot) due to browser cross domain security restrictions for those cases, see capturing forms in iframes with navattic js about capturing form submissions from iframes it is possible to capture form submissions from pages other than the one your demo is on however, this will require the “domain level visitor tracking” setting to be enabled so that navattic js can associate the visitor to the page the form is on with the one the demo is on cross domain tracking use a cookie to consolidate visitor data across subdomains for example, if a visitor visits embedded demos in docs navattic com and blog navattic com, they will now be recognized as the same visitor crm tracking scripts automatically capture hubspot or marketo cookies from visitors and sync navattic demo data with the corresponding contact in your crm for example, if a visitor was cookied by hubspot last month and now visits your demo on the same browser, their navattic visitor fields (see navattic field mappings docid\ vitmnykrbwtgamu7arwxg ) will be mapped to hubspot contact properties, and their navattic demo activity will appear in the hubspot activity timeline this will not send the visitor's email address from hubspot to navattic, unless you have automatic form submission toggled on as well (see above) if you have "automatic third party form submissions" toggled on above or are manually sending website visitor emails to navattic through javascript ( see here ), this demo visitor's email address will also be surfaced directly in the navattic visitors tab query parameter tracking automatically include page query parameters from the parent page as navattic visitor attributes for example, if a demo visitor views an embedded demo on navattic com/pricing?utm medium=internal\&client id=chromestore, the parameters "utm medium" and "client id" will automatically turn into visitor attributes that can be included in navattic field mappings docid\ vitmnykrbwtgamu7arwxg 1 2 copy the snippet under settings > developer setup , open the dropdown for the specific site, and copy the snippet to add to the head of your website it should look something like the example script below and will include an sdk key that is unique to your navattic workspace and that’s it! you’re all set to start identify visitors docid\ bo4ge6li yczmv2fqllma or subscribe to events docid\ ab tusaayzmufcamewpdr 1 3 developer checklist (optional) visit the developer checklist to make sure everything is connected correctly find the developer checklist in your navattic workspace > settings > developer setup under website configuration, add the corresponding page urls for your application, marketing website, docs website, and blog to see which ones are connected as well as which ones may be experiencing issue the implementation checklist will help you understand which sites you have added navattic js to next steps identify visitors docid\ bo4ge6li yczmv2fqllma (recommended) do this to identify visitors to your navattic demo subscribe to events docid\ ab tusaayzmufcamewpdr (optional) do this to send navattic events like step viewed or flow started to an events based platform