Measure Page Scrolling in Google Analytics


A Google Analytics plugin for measuring page scrolling

Earlier today I came across a Google Analytics plugin called Scroll Depth, developed by Rob Flaherty. Here’s how he describes Scroll Depth:

Scroll Depth is a small Google Analytics plugin that allows you to measure how far down the page your users are scrolling. It monitors the 25%, 50%, 75%, and 100% scroll points, sending a Google Analytics Event at each one.

You can also track when specific elements on the page are scrolled into view. On a blog, for example, you could send a Scroll Depth event whenever the user reaches the end of a post.

The plugin supports Universal Analytics, Classic Google Analytics, and Google Tag Manager.

Scroll Depth is available on GitHub and on it’s project page. Getting it setup is easy, the only two requirements are Google Analytics and jQuery.

Below is a basic setup.

Just be sure to include jquery.scrolldepth.min.js and the call to .scrollDepth() is made after Google Analytics has been loaded up.

There’s a number of options you can pass, too:. I especially like the elements option. It allows you to define a unique element to record scroll events for. So, if you want to track when users scroll to the footer of a post in WordPress, you could easily set that up!

As stated, the only requirements are Google Analytics and jQuery. If it doesn’t seem to be working for you, ensure that Scroll Depth isn’t being loaded before your Google Analytics tracking code.

Use Google Font Directory Fonts in WordPress

Google has some seriously nice looking fonts available for you to use for free in the Google Font Directory. All the fonts are under an open source license and are served right from Google servers.

Most modern web browsers support webfonts. The Google Font API FAQ would be a good place to visit if you have questions or are curious about some of the limitations.

Making use of these fonts in your WordPress theme is extremely easy, as long as you have a basic understanding of CSS. Now let’s get down to using these in your WordPress theme, we’ll keep it short and simple.

First, head over to the Google Font Directory and pick a font to use. I’ll be using IM Fell as an example, since that’s the font I use for post titles on this site.

Once you find a font you like, click on it. If the font you chose has variants, you will need to click on a variant to use. Once you’re on the font page, click the “Get the code” tab and google will generate the code for the font. You will embed this code in the header.php file for your theme. I usually put it right before the line that calls the theme stylesheet file. Here’s the code I used to include the IM Fell font:

After that, all you have to do is use the font in your CSS, typically the style.css file in your WordPress theme directory. To get my post titles to use the IM Fell font, I did this:

The font-size property defines what size of font to use (duh!). The font-weight property defines the thickness of the font (degree of boldness). You can apply the font-family property using the Google Font to pretty much any piece of CSS that targets text. You can use it for post content, links, widget titles, or whatever you want really.

If you have any questions, feel free to leave a comment and I’ll do my best to help you out!

Use Google Hosted jQuery in WordPress

So, I recently needed to use a google hosted version of jquery for a WordPress theme (don’t ask). I came across this topic at the WordPress forums.

User bazil749 suggested doing this, I’ve updated it to include jQuery 1.4.4:

I added that piece of code to the proper place in the header.php file for the theme and it worked like a champ. jQuery was now loading from Google. The Use Google Libraries plugin does the same basic thing, except it can use libraries other than just jQuery, like jQuery UI, Dojo, MooTools, and Protoype.

There are a number of good reasons to let Google host jQuery for you.

Google Building In Iowa

I flipped on the TV when I woke up yesterday to watch the news on KCCI like I always do. I caught the very end of a piece about Google building two facilities in Iowa. I didn’t believe my ears at first, I just assumed they were looking at Iowa as an option for building.

I got into work and went to the KCCI website. Sure enough, right on the front page was a story titled “Some Not Surprised By Google’s Move”. It was the top story of the day at the time. Here’s some of the article from the KCCI website:

DES MOINES, Iowa — It has been a well-kept secret until Tuesday.

Google Inc. is setting up shop in Iowa. The question is why.

The state’s reputation as a great place to live and work could have played a big role.

” I would like to begin with these four words: Google welcome to Iowa,” said Gov. Chet Culver in a news conference Tuesday in Council Bluffs.

The economic impact is predicted to be huge.

Google will invest $600 million in two new facilities, including a data center that is under construction in Council Bluffs.

The 1,100-acre site will house a data farm. The 200 news jobs are forecast to add up to $10 million a year to the state’s economy.

Google has a page dedicated to the Council Bluffs data center and there’s also a nice FAQ.

Google is currently taking applications for employees in the Council Bluffs data center. Needless to say, my resume will be on its way to them shortly, this position really caught my eye. Too bad I don’t have a degree of any sort, I’ll probably be overlooked for that reason alone.

Google Calendar Gets Tasks

Sort of. I read this over on Ajaxian yesterday but didn’t get a chance to check it out until this morning. The folks over at Remember The Milk have taken notice of the fact that a great number of their users are using Google Calendar to keep track of events, while continuing to use Remember The Milk for daily tasks. So, the fine people at Remember The Milk have come out with Remember The Milk for Google Calendar:

We know that many of you are managing your tasks with Remember The Milk and your events with Google Calendar, and we thought it would be very cool if we could bring the two together. This new feature adds a small task icon to the top of each day in Google Calendar — click on the icon to:

  • Review your tasks for the day
  • Add new tasks and edit existing ones
  • Easily complete and postpone tasks
  • Review your overdue tasks
  • Optionally show tasks with no due date
  • See where your tasks are located on a map

This exciting for me. I’ve been waiting on Google to add official tasks to Google Calendar, but this will suffice. Actually, I like this because I really enjoy using Remember The Milk, and would like to continue using it. Looks like I’ll be able to keep using it indefinitely now that RTM has support for Google Calendar. Yay!!