Google Analytics Event Tracking for Slider Revolution
Track your Slider Revolution clicks with Google Analytics
- Quick Tip:
Already have your GA tracking code installed and your slider links setup? Skip to step #3.
1. Setup your Google Analytics account for your site
If you’re reading this article, chances are you already have Google Analytics (GA) setup for your site. But if not, here are a few good places to start for setting up GA for your WordPress site:
Getting Started with Google Analytics:
Where to find your Tracking Code:
Setting up your Tracking Code:
WordPress Plugin to connect your GA Account to your site:
https://wordpress.org/plugins/google-analytics-for-wordpress/
2. Hyperlink your Slides and/or Layers
Hyperlink an entire slide:
Hyperlink a Layer:
https://www.themepunch.com/revslider-doc/layer-actions-links/
3. Add the "ga-button" class to your hyperlinks.
If hyperlinking an entire Slide:
If hyperlinking a single content Layer:
4. Add the following script to your slider's Custom JavaScript section.
This code does not need to be modified (straight copy and paste)
Track Outbound Links:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
jQuery('body').on('click', '.ga-button', function() { var $this = jQuery(this), data = $this.attr('data-link') || $this.attr('href'); if(!data) { data = $this.attr('data-actions'); if(data) data = data[0].url; if(!data) data = $this.attr('id'); } __gaTracker('send', 'event', 'outbound', 'click', data, {'transport': 'beacon'}); }); |
Track All Slide Changes:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
jQuery(window).on('load', function() { jQuery('.rev_slider').each(function() { var ids = jQuery(this).attr('id').split('rev_slider_')[1].split('_')[0], api = eval('revapi' + ids); api.on('revolution.slide.onchange', function(e, data) { var data = 'Slider ' + ids + ' changed to slide #' + data.slideIndex; __gaTracker('send', 'event', 'outbound', 'click', data, {'transport': 'beacon'}); }); }); }); |