The Formstack integration allows you to embed DataGuard CPM consent capture points into your Formstack forms, enabling the automatic synchronisation of consent data collected via your forms with the DataGuard CPM platform. This integration is simple and requires embedding a code snippet into your Formstack form.

Prerequisites

Before you begin, ensure you have the following:

  • Access to the DataGuard CPM Platform.
  • Administrative access to a Formstack account.

If you don't have access to the DataGuard CPM Platform, please contact us.

Integration Setup

To integrate DataGuard CPM with Formstack, follow these steps:

Step 1: Paste the Code Snippet

  1. Log in to your Formstack account and navigate to the form where you want to embed the DataGuard CPM consent capture.
  2. Edit your form and find the section where you can add HTML or custom code.
  3. Insert the following code snippet into the form:
var SCRIPT_URL = '<scripts-url>/capture-point.min.js';
var TEMPLATE_ID = '<template-id>';

var EMAIL_ID = 'Lead.Email'; // Might be different
var BUTTON_ID = 'btnsubmit';

var widget;
var email;

$(document).ready(function() {
    var dgScript = document.createElement('script');
    dgScript.setAttribute('src', SCRIPT_URL);
    dgScript.onload = function() {
        var widgetId = 'dataguard-widget';

        var dgTag = document.createElement('div');
        dgTag.setAttribute('id', widgetId);
        dgTag.setAttribute('class', 'ff-group-row');
        var footerGroup = document.querySelector('.ff-footer-group');
        footerGroup.parentNode.insertBefore(dgTag, footerGroup);
        
        widget = ExpressStatelessCapturePoint.load({
            id: widgetId,
            templateId: TEMPLATE_ID,
            display: {
                location: 'inside',
                closeOnSubmit: false,
                displayButtons: false,
            },
            contactDetails: {
                verification: {
                    emailAddress: function() {
                        return email
                    },
                },
            },
        });
    }
    document.body.appendChild(dgScript);
});

function FF_OnBeforeSave() {
    email = document.getElementById(EMAIL_ID).value;
    return true;
}

async function FF_OnAfterSave() {
    await widget.submit();
}

Step 2: Choose the Correct Script URL

Replace the <scripts-url> with the appropriate script URL. The URLs can be found on the Environments page.

Step 3: Replace the Template Id

Replace the <template-id> with the Template id for your DataGuard CPM widget. For details on how to set up your Template, please refer to the Template Setup page.

Additional Resources

For more information on how to customise and configure your DataGuard CPM widget, check out our Sign Up Widget page.

Conclusion

Your Formstack integration with DataGuard CPM is now complete. Any consents collected through your Formstack form will be automatically synced with the DataGuard CPM platform!