Click Statistics for Slider Images

Wishlist Slider
1

I would like to suggest a feature that provides statistics on how many times each image in the slider has been clicked. It would be helpful to see the number of clicks per image over a selected time period, such as daily, weekly, and monthly. If possible, a simple graph or table for better visualization would be appreciated.

2 Likes
3

Hi there, @user21404 :wave:

Sounds great, thanks for sharing your idea! If this idea gets more votes, it might be considered in the future.

In the meantime, our devs can create a Google Analytics code for you to track clicks on the slides. If you’d like to get this code, just let me know and I’ll pass it on to the devs :slightly_smiling_face:

4

That sounds great! I would love to get the Google Analytics code to track clicks on the slides. Please pass it on to the devs. Thanks!

1 Like
5

Sure, your request is with our devs now! I’ll update you once the code is ready :wink:

6

Happy to say that our devs prepared a 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 right before closing </body> tag:

<script>
function eappsDispatchAnalyticsEvent(event, selector, config) {
	function sendEvent(config) {
		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)) {
		sendEvent(config);
	}
}
document.addEventListener(
	'click',
	function (event) {
		const numbersElem = document.querySelector('.eapp-slider-numbers-number');
		const number = Number(numbersElem.textContent.split('/')[0].trim());
		eappsDispatchAnalyticsEvent(event, '.eapp-slider-slide-slide', {
			action: 'click',
			category: 'Click to Slider',
			label: `Click to ${number} Slide`,
		});
	},
	true
);
</script>

Important: Do not disable the pagination in the widget, as it helps the code identify the number of the clicked slide.

Just in case, here is an article explaining where you can find statistics - Google Analytics 4 (GA4): Where to find my events - Elfsight Help Center

Check it out and let me know if it worked for you :wink:

1 Like