Docs

Docs

menu-to-close

Integration with analytical tags

It’s important to know how users interact with your site and where they contact most through WhatsApp. Joinchat automatically recognizes if Google Analytics, Google Tag Manager and Facebook Pixel are present on your site and sends an event when the user launches WhatsApp.

Google Analytics 4

It is compatible with Global Site Tag (gtag.js) and Universal Analtics (analytics.js) (UA removed from v5.0.16). Since version 5.1 Joinchat supports the Google tag with multiple destinations.

If Google Analytics 4 is detected, the recommended event "generate_lead" will be sent:

// GA4 generate_lead event
gtag('event', 'generate_lead', {
 event_category: 'JoinChat',
 event_action: 'whatsapp: 99999999999',
 event_label: destination_url,
 chat_channel: 'whatsapp',
 chat_id: '99999999999',
 is_mobile: 'yes' | 'no',
});Code language: JavaScript (javascript)

🌟 Since version 4.5.10 you can customize the GA4 event and use something other than "generate_lead".

add_filter( 'joinchat_get_settings', function( $settings ){
 $settings['ga_event'] = 'my_GA4_event';
 return $settings;
} );Code language: PHP (php)

Google Tag Manager

If GTM is detected a custom event "JoinChat" will be triggered with the following parameters:

// GTM JoinChat event
dataLayer.push({
 event: 'JoinChat',
 event_action: 'whatsapp: 99999999999',
 event_label: destination_url,
 chat_channel: 'whatsapp',
 chat_id: '99999999999',
 is_mobile: 'yes' | 'no',
 page_location: current_url,
 page_title: page_title,
});Code language: JavaScript (javascript)

If your site does not use the standard name for the data layer (‘dataLayer’) you can set your custom name with this filter:

add_filter( 'joinchat_get_settings', function( $settings ){
 $settings['data_layer'] = 'dataLayerCustom';
 return $settings;
} );Code language: PHP (php)

Google Ads

Since version 4.4 you can set up a Google Ads conversion directly from the Joinchat settings. All you have to do is enter the Conversion ID and the Conversion tag previously defined in your Google Ads panel.

gads configuracion

Facebook Pixel

If Facebook Pixel is detected a “Custom Event” is sent with the name “JoinChat” and the parameters:

// Facebook Pixel JoinChat event
fbq('trackCustom', 'JoinChat', {
 event_action: 'whatsapp: 99999999999',
 event_label: destination_url,
 chat_channel: 'whatsapp',
 chat_id: '99999999999',
 is_mobile: 'yes' | 'no',
 page_location: current_url,
 page_title: page_title,
}); Code language: JavaScript (javascript)

Other integrations

Joinchat fires the 'joinchat:event' event before triggering analytics events and before opening WhatsApp. This can be used to add custom tracking code (or other needs).

The event sends an array with the parameters of the events to be sent to the different platforms. New parameters can be added, modified or deleted.

// Joinchat default parameters
{
 event_category: 'JoinChat', // Name
 event_label: 'https://wa.me/999...', // Destination url
 event_action: 'whatsapp: 999999', // "chanel: id"
 chat_channel: 'whatsapp', // Channel name
 chat_id: '999999', // Contact (phone, username...)
 is_mobile: 'yes' | 'no',
 page_location: location.href,
 page_title: document.title || 'no title',
}Code language: JavaScript (javascript)

Example, send webhook to Zapier:

// Send webhook to Zapier
jQuery(document).on('joinchat:event', function (event, params) {
 jQuery.post('https://hooks.zapier.com/hooks/catch/123456/xxxxxx/', params );
});Code language: JavaScript (javascript)

Example, add a parameter to differentiate logged in users:

// Add custom param "user_logged"
jQuery(document).on('joinchat:event', function (event, params) {
 params.user_logged = jQuery('body').hasClass('logged-in') ? 'yes' : 'no';
});Code language: JavaScript (javascript)

The event can also be canceled if false is returned, for example to disable analytics for logged-in users:

// Cancel analytics events if user is logged
jQuery(document).on('joinchat:event', function (event, params) {
 if (document.body.classList.contains('logged-in')) return false;
});Code language: JavaScript (javascript)
Integration with analytical tags