An integration using hidden HTML tags that are generated on the client side is the most suitable custom integration option with Connectif when using Google Tag Manager and dataLayer. It consists of generating hidden tags and once they are correctly rendered, Connectif's JavaScript will automatically collect the information and send it to your account.
How to integrate Connectif using client rendered tags
You can use this integration to configure the sending of information about what happens on your website, however you must use a complementary method to synchronize your catalog and configure the Web Push.
1. Add Connectif JavaScript
Configure the Connectif JavaScript on the web to load on all pages and integrate via events.
2. Add the HTML tags
Below we list all the tags that you must add and to which pages so that the information is synchronized correctly:
1. On all pages:
- "Contact Information" tag: to record the data of ecommerce visitors.
- "Current shopping cart status" tag: to describe the contact’s shopping cart at a given moment.
- "Page Tag": to assign a tag to a page.
2. On product category pages:
- "Page Category" tag: to assign a product category to a page.
3. On product detail pages:
- "Contact has visited a product" tag: to report that the contact has visited a specific product while browsing the website.
- "Contact has searched for a product" tag: to identify a visit to a product as a direct result of a product search.
4. On search result pages:
- "Contact has performed a search" tag: to indicate that a search has been performed and to identify which terms have been used.
5. On the purchase pages (checkout success):
- “Purchase made” tag: to register purchases made by the contact.
6. On the pages where the event occurs:
- "Contact has logged in" tag: to indicate that the contact has logged in.
- “Contact has registered” tag: to indicate a new registration.
- "Newsletter subscription" tag: to indicate that a contact has subscribed to the newsletter.
3. Synchronize the product catalog
Product verification does not support client-side rendering of HTML tags, as Connectif's product verifier expects to get the "cn_product_visited" tag when making an HTTP GET request to the product URL.
You can synchronize your catalog using two different methods:
- Implementing the Visited Product tag with rendering on the server
- Disable automatic product verification and synchronize the catalog via API.
4. Configure Web Push notifications
To complete the integration you will also need to configure the Service Worker to receive Web Push subscriptions and send notifications to your contacts.
5. Validate the integration
Once you’ve implemented the sending of information to Connectif, the next step is to confirm that the integration has been carried out correctly.
Keep learning!
To make the most of your Connectif account, we recommend reading these articles next:
-
Onboarding, to learn all about our interface.
-
Initial workflows, to implement your first strategies in your account.
-
Integrations with external systems, to integrate your Facebook, website forms and webhooks.
-
API integrations, to administrate events such as order registration or contact sign-ups.