Clicks analytics not just page views

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 :tada:

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?