Would be nice to know how many clic we are getting on the whatsapp button
1 Like
Hello @Chris_Garcia and welcome to Elfsight family
Our devs have prepared a Google Analytics code for you. Please add this part of the code to your website :
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-ID"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-ID');
</script>
In the code above, you need to replace UA-ID with your actual website ID for Google Analytics. If you are using Google Analytics 4, you need to use G-ID instead of UA-ID (see screenshot). This article will help you find your ID - [GA4] Find your Google tag ID - Analytics Help.
And then just add the rest of the script right before closing tag:
<script>
document.addEventListener('DOMContentLoaded', () => {
function sendAnalyticsEvent(config) {
if (typeof ga !== "undefined") {
ga('send', 'event', {
eventAction: config.action,
eventCategory: config.category,
eventLabel: config.label
});
}
if (typeof gtag !== "undefined") {
gtag('event', config.action, {
'event_category': config.category,
'event_label': config.label
});
}
}
function rafAsync() {
return new Promise(resolve => {
requestAnimationFrame(resolve);
});
}
function checkElement(selector) {
if (document.querySelector(selector) === null) {
return rafAsync().then(() => checkElement(selector));
} else {
return Promise.resolve(true);
}
}
checkElement('.eapp-all-in-one-chat-root-layout-component')
.then(() => {
const clicker = (el, label) => {
document.querySelector(el).addEventListener('click', () => {
sendAnalyticsEvent({
action: 'click',
category: 'Elfsight Chat Widget',
label: label
})
})
}
clicker('[class^="Bubble__BubbleComponent"]', 'Open/Close Chat Widget');
clicker('a[title="WhatsApp"]', 'Click to WhatsApp Chat');
})
})
</script>
Could you please check it and let me know how it worked?