WordPress.org

Ready to get started?Download WordPress

Forums

Jetpack by WordPress.com
[resolved] Adding Google Analytics to Jetpack Carousel (10 posts)

  1. dionsis
    Member
    Posted 10 months ago #

    Hi guys

    Does anyone know if it's possible to add Google Analytics pageview tracking to Jetpack Carousel. People click around and view all the images and only 1 page view is ever loaded.

    Other sites have no such Ajax thing and each image in a gallery loaded is a page view, which increases their traffic, arugably artificially but people are clicking around. Is it possible to use this in the next and previous buttons to launch a Google Analytics page view function to track it.

    http://wordpress.org/plugins/jetpack/

  2. George Stephanis
    Automattic Lead Code Monkey
    Plugin Author

    Posted 10 months ago #

    It's totally possible to track it with some custom javascript. However, I don't believe it's something we'd be interested in supporting internally, I'm afraid.

  3. dionsis
    Member
    Posted 10 months ago #

    not even as an option that could be enabled?

    Would be extremely handy and helps make those that use AJAX functions like Carousel not sacrifice traffic stats.

  4. George Stephanis
    Automattic Lead Code Monkey
    Plugin Author

    Posted 10 months ago #

    Here's how you can add extra tracking:

    https://gist.github.com/georgestephanis/6907038

    There's a custom event triggered here that the above code hooks into. From that, you've got the data of the carousel, the event, and the slide, and can pull out whatever data you'd like and pass it to Google Analytics however you please.

    As I said, this isn't functionality that we are likely to add to Jetpack itself, but you can certainly publish a custom addon that offers that functionality if you'd like. :) We try to add hooks and actions and events where we can to enable third-party developers to create just that sort of modularity.

  5. dionsis
    Member
    Posted 10 months ago #

    Hey George,

    I think I understand that stuff, I'll try implement what you are saying there and see if it works for me. The github code should go in around line 700 or can the function go anywhere in the jetpack-carousel.js and that line 700 will trigger on that and use that functions contents (and I add GA related code there)

    I really appreciate you taking the time to show that.

  6. George Stephanis
    Automattic Lead Code Monkey
    Plugin Author

    Posted 10 months ago #

    The GitHub code shouldn't go anywhere in Jetpack. It should go in your own plugin or theme's enqueued JS file. It's made to let you trigger off the action happening, without modifying core plugin files that would get overwritten with an update.

  7. dionsis
    Member
    Posted 10 months ago #

    Gotcha, I've used my functions.php to enqueue the script and I'm seeing readings in the console now, so just have to put in some analytics code and see if it works.

    Thanks for the help on this.

  8. sandstar
    Member
    Posted 8 months ago #

    Hey Dionsis, could you share how you did this? I'm having the same issue you originally had. Thanks!

  9. roseba
    Member
    Posted 7 months ago #

    I haven't the first clue how this:

    jQuery(document).on( 'jp_carousel.selectSlide', '.jp-carousel-wrap', function( event, slides ) {
    	// This is just to show you what values get passed in.  Delete it before going to production.
    	if ( window.console ) {
    		console.log( this );
    		console.log( event );
    		console.log( slides );
    		console.log( slides[0] );
    	}
    	// Do whatever extra stuff you want here.
    } );

    would be implemented.

    Can someone provide code that wrapper for implementing this into child functions.php?

  10. roseba
    Member
    Posted 7 months ago #

    I've been working on this for days. I didn't understand what I am supposed to do with this code.

    It took me a while to get the script to show up. I had trouble with the child theme.

    I added this to the functions.php file in the child theme.

    function my_analytics() {
    	wp_register_script('carousel-analytics', get_stylesheet_directory_uri() . '/carousel-analytics.js', true);
    	wp_enqueue_script('carousel-analytics');
    }
    
    add_action( 'wp_enqueue_scripts', 'my_analytics' );

    And I copied the code from the link verbatim. It seems to load but doesn't record the individual hits in the carousel slideshow.

    Is there something I'm supposed to add to that Javascript file.

    I have scoured the web to understand what I am supposed to do. The information is thin, at best. So if anyone has made this work, please tell me.

Reply

You must log in to post.

About this Plugin

About this Topic

Tags

No tags yet.