Contact Collector

The goal of Voxie's Contact Collector is to allow you to capture potential subscribers through an a pop-up or form on your website and seamlessly transfer them to your Voxie instance.

Introduction

This feature is actually a group of platform capabilities that allow the Customer to capture potential subscribers through out different means, those being:

• On web site Pop-up
• On web site Form

All of the options above are variations of the same functionality which is the Contact Rest API, which the difference that some of them have extra wrappers around but ultimately they all leverage the Contact Public API endpoint.

As part of this document we will explain each one of those into detail

Pop-up Contact Collector

This variation of allows the user to add a Pop-Up snippet in their Web Site code, resulting in a white label pop-up that will prompt the web visitor for its first_name and phone_number

How to configure it

You can locate the Feature under Team Settings > Integrations > Contact Collector

This process is pretty self explanatory, the user will need to follow the quoted steps in the UI.

Additionally the User will need to have access to the target web site code to add this piece of code. The code snippet is going to to un-package the pop-up application

<!-- Voxie Contact Collector -->
<link rel="stylesheet" href="<https://unpkg.com/@voxie/contacts.js@0.2.4/dist/index.css>"></link>
<script src="<https://unpkg.com/@voxie/contacts.js@0.2.4/dist/contacts.js>"></script>
<script defer>
    (async function () {
        window.voxie = await Voxie.init({
            publicKeyId: '***************************',
            publicSecret: '***********************************************************************************',
            connectBaseUri: '<https://connect.voxie.com>',
        });
        const popUp = window.voxie.popUp();
        popUp.auto();
    })();
</script>

Further Configuration

The user can change the piece of HTML code and define which is the Timeout in which the Pop.Up will wait till it opens in milliseconds.

popUp.auto(1500);

User can change the value based on its preferences.

On web site Form (contact.js)

In the scenario in which the Customer’s Web Site already counts with a form or any sort of artifact that captures potential subscribers as contacts, It can leverage the usage of Voxie Form Sharing Library component. It enables the capture of the potential subscribers in addition to the creation of Custom Attributes if the form extracts contact enrichment fields

In order to authenticate this feature, it will require publicKeyId & publicSecret that gets generated in the Contact Collector UI, following the next steps:

1. Access Team Settings > Integrations > Contact Collector
2. Click on Generate ↻
3. Copy both Values:
   1. publicKeyId
   2. publicSecret

More Information and Installation options in: Overview

Additional Fields Capture

In case the customers artifact collects additional data points or properties from the potential subscriber, the (contact.js) code snippet can be modified to post those values as either Tags or Custom Attributes in the Voxie

voxie.share(
  document.getElementById("purchase"),
  {
    // values are field names within the form
    phone: "phone",
    firstName: "first-name",
    lastName: "last-name",
    email: "email",
  },
  {
    // tags and custom attribute keys must be lowercase
    tags: ["purchased", "online"],
    customAttributes: {
      last_purchase_sku: "vxe123",
      last_product_viewed_sku: "vxe456",
    },
  }
);