How to generate your Contact State Claim URL

Contact State is a regulatory technology platform specifically designed to build trust in two-sided markets like lead generation and affiliate marketing.

Contact State Certify allows Data Sellers to generate Certificates that serve as a record of provenance for consumer data, and then pass these certificates onto Data Buyers. This provides a trusted reference point for Data Buyers and Data Sellers.

Credentials

In order to continue with the integration you will need credentials configured within Contact State.

  1. Landing Page ID – Provided by Contact State. This identifies the landing page that your form is setup on.
  2. Secret Key – Provided by Contact State. This is used to sign claim requests on behalf of a particular Data Buyer.
  3. Form ID – The HTML element ID of the form you wish to attach to.

If you need help getting your credentials please email support@contactstate.com

Integration

1. Create these 2 custom fields under Admin > Custom Fields (text type)

contact_state_cert_url
contact_state_reclaim_cert_url

2. In your decision tree canvas click Settings > Scripts

3. Under Decision Tree Scripts, paste the code below

<script>
  (function (w,d,s,o,f,js,fjs) {
    w['ContactStateCertify']=o;w[o] = w[o] || function () { (w[o].q = w[o].q || []).push(arguments) };
    js = d.createElement(s), fjs = d.getElementsByTagName(s)[0];
    js.id = o; js.src = f; js.async = 1; fjs.parentNode.insertBefore(js, fjs);
  }(window, document, 'script', 'cscertify', 'https://js.contactstate.com/certify-latest.js'));
  cscertify('init', { landing_page_id: 'REPLACE_ME_WITH_YOUR_LANDING_PAGE_ID' });
</script>

4. Setup your form node and add this html code inside the content source

<div id="contact-state-protected-by-widget" style="text-align: center;">0</div>

5. Add 2 node level scripts (Note of the event enter or exit)

Contact State Widget Node Level Script
<script>
  setTimeout( ()=> cscertify('widget'), 100)
</script>
Contact State Node Level Script
<form id='REPLACE_ME_WITH_YOUR_FORM_ID' style="display: none">
    <input name="first_name" value="{first_name}"/>
    <input name="last_name" value="{last_name}"/>
    <input name="email" value="{email}"/>
    <input name="mobile_number" value="{mobile}" />
</form>
<script>
  const saveCertToLh = (cert_url, reclaim_cert_url) => {
    DT.setField('contact_state_cert_url', cert_url);
    DT.setField('contact_state_reclaim_cert_url', reclaim_cert_url);
  }
  const getCertUrl = (claimUrl) => {
    const requestOptions = {
      method: 'POST',
      headers: {
        'Accept': 'application/json',
        'Content-Type': 'application/json'
      },
      body: JSON.stringify({"secret_key": "REPLACE_ME_WITH_YOUR_SECRET_KEY"})
    };

    fetch(claimUrl, requestOptions)
      .then((response) => response.json())
      .then((result) => saveCertToLh(result.cert_url, result.reclaim_cert_url))
      .catch((error) => console.log('error', error));
  }
  
  cscertify('send', { form_id: 'REPLACE_ME_WITH_YOUR_FORM_ID' })
  .then((claimUrl) => getCertUrl(claimUrl))
  .catch((err) => console.error('Page script: There was an error!', err));
</script>

6. Create a transition node and set delay to 3 seconds

You can display the claim URL in an information node or result node to see the generated claim URL. You may use the sample content below.

Contact State Cert URL: {contact_state_cert_url}
Contact State Reclaim URL: {contact_state_reclaim_cert_url}

Tagged: