ChatWith widget can send interaction events to the data layer. You can capture these using Google Tag Manager and forward them to Facebook Ads. Please follow the steps below to achieve proper tracking:
Prerequisite(s):
- You must have a Google Tag Manager account. If you do not have one, you can open one here: https://tagmanager.google.com/
- You must have a Facebook Ads account. If you do not have one, you can create one here: https://www.facebook.com/business/ads:
(Optional) If you would like to run Advanced Matching, must enable it for the pixel in Facebook Ads; this should not be necessary, but has been the cause of data not processing well in Facebook, so it is advised to do it. To achieve it, follow the steps below and use the image for reference:
- In Ads Manager, select Data Sources main menu option.
- In the pixel list, select the pixel you want to use for this integration and navigate to its Settings.
- Scroll down to the “Turn on automatic advanced matching” and move the toggle to ON position.
- (Optional) Open the dropdown and choose which fields you would like to use; by default, they are all set to on, and we recommend you keep it that way.
If you prefer to skip the step by step process, you can download this file and import it in your Google Tag Manager. Then update the Facebook ID to utilize your pixel ID as such:
Steps to track your Facebook Ads:
(1) Create variables:
1.1. Navigate to the appropriate Workspace, open the Variables menu and click the New button:
1.2. Create the following custom variables with Data Layer Variable, type being Version 1:
- cw_event_category [https://prnt.sc/BPY2KOp2X4qL]
- cw_event_action [https://prnt.sc/Y7HKv45to2u2]
- cw_event_label [https://prnt.sc/ci0e8IeWzQxu]
Note: Please copy and paste Data Layer Variable names as provided in this guide. These are case-sensitive. If you fail to do so, your tracking will not work.
1.3. Create a variable for the Facebook Pixel ID as constant:
Note: your 15 digit pixel ID is located in your Facebook Business Manager, under Data Sources. Make sure to copy that value in this field.
1.4. (Optional) Create variables for the advanced matching:
- Two variables are provided in the guide, but you can follow the same instruction to add more, or use just one; these are provided as best user identifiers and most commonly utilized:
- CW mail
- CW phone
Note: Each of the above variables should be set as Custom JavaScript, with the following code within them:
function () {
return document.getElementbyId(“cw-form-field-ID-here”).value;
}
make this code formatted like this on the website
Once you have created the custom javascript variables, replace the quoted text (cw-form-field-ID-here) with the actual field ID seen in your widget editor. To locate them, in your ChatWith application, navigate to:
1.4.1. Create and Edit under Widgets in the top menu
1.4.2. Select Edit Widget on the widget you wish to track
1.4.3. In the Widget editor, select the Agents menu
1.4.4. Press the Edit Form button next to the Agent of your choice: (do not confuse this with the Edit button, which will take you to the Agent editor)
1.4.5. The field IDs are available in the bottom right corner of each field
1.4.6. Copy the value you want to capture and place it instead of the placeholder under quotes above; repeat for every field you wish to capture (when copying, do not copy the id: part in front of it, i.e. the field IDs from the last image are cw-form-e82fb771-adc0-4166-8443-9a5f5e017e7c and cw-form-c16dc9e1-ccb2-4faf-8bac-b1db02385f25)
(2) Create a trigger:
2.1. Navigate to the Triggers menu and click the New button:
2.2. Create the following Custom Event trigger with the event name chatwith:
Note: Please copy and paste the Event name as provided in this guide. These are case-sensitive. If you fail to do so, your tracking will not work.
(3) Install a community template to enable Facebook Pixel tracking:
3.1. Navigate to Templates and click the Search Gallery button:
3.2. Search and select template Facebook Pixel by facebook archive:
3.3. Press Add to Workspace button. When prompted for permissions, confirm by pressing the Add button:
(4) Create the tags:
4.1. Navigate to the Tags menu and click the New button:
4.2. Select the tag type Facebook pixel:
Note: You will not see this tag type in case you skip step 3.
4.3. The first tag we must add is the Base tag that tracks page views. The key thing here is to ensure the proper variable is placed in the Facebook Pixel ID(s) field, as well as event name being Standard, and in dropdown, the chosen option must be PageView. For the triggering, we used the default provided All Pages trigger, but you can use any other event relevant to page loading:
Note: If you have named the variables the same as in our images, you can overwrite the naming from the image in the value fields. Otherwise, please use your names. The most certain way to add the variables is by clicking on the plus sign next to each item and selecting the variable you need:
4.4. The second tag we must add is the Event tag that will track form interactions. The key thing here is to ensure the proper variable is placed in the Facebook Pixel ID(s) field, as well as event name being Standard, and in dropdown, the chosen option must be Lead:
4.5. Turn on advanced matching and, under Customer Information Data Parameters, specify the data you want to pass, and the variables you have created to capture it:
4.6. Set a trigger created in step 2 for the tag:
Don’t forget to publish your changes to GTM container after testing by pressing the Submit button. You are done. Good luck!
Thank You For Your Vote!
Sorry You have Already Voted!