Tracking Blog calls with Analytics

Ask the Community General Questions
1

Hello Elfisght

How can we detect the opening of a single Blog item?
I see there is URL parameters set on opening the blog item.
image
But how can we “measure” this iin Analytics or Tag manager?
Is there a way using “customer specific JS?”

Thanks a lot
Piero

1 Like
3

Hi @Piero_Biasi1 :waving_hand:

Our devs will try to come up with the code for tracking clicks on the posts. I’ll update you once the solution is ready :slightly_smiling_face:

1 Like
4

Thanks a lot !!

1 Like
5

Hi @Piero_Biasi1 :waving_hand:

Our devs came up with the Google Analytics code for you! Please add this part of the code to your website <head>:

<script async src="https://www.googletagmanager.com/gtag/js?id=G-ID"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-ID');
</script>

In the code above, you need to replace G-ID with your actual website ID for Google Analytics. This article will help you find your ID - Find your Google tag ID.

And then just add the rest of the script to the Custom JS field on the Settings tab of your widget’s settings:

function eappsDispatchAnalyticsEvent(event, selector, config) {
	function sendEvent(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 isHitClass(e, selector) {
		return e.target && e.target.closest(selector);
	}

	if (isHitClass(event, selector)) {
		setTimeout(function () {
			sendEvent(config);
		}, 10);

		return true;
	}
	return false;
}

document.addEventListener(
	'click',
	function (event) {
		const clickedContainer = event.target.closest(
			"[class*='card-container__CardContainer-sc']"
		);
		
		if (clickedContainer) {
			const postTitle = clickedContainer.querySelector(
				'[class*="card-content__CardContentTitle-sc"]'
			)?.textContent;

			eappsDispatchAnalyticsEvent(
				event,
				"[class*='card-container__CardContainer-sc']",
				{
					action: 'click',
					category: 'Click Post',
					label: `Clicked Post: "${postTitle || ''}"`,
				}
			);
		}
	},
	true
);

Please let me know if it helps and if you have any other questions :slightly_smiling_face:

1 Like