How To Add The Pinterest “Pin It” Button to a Website, WordPress Blog, or ecommerce CMS

February 13, 2012 By Glenn Gabe

There’s a good chance you’ve heard of Pinterest lately. It has been all over the news, as it’s growing like mad, and driving a lot of traffic to ecommerce retailers. If you’re not familiar with Pinterest, it’s a new social network/application that enables users to pin photos to virtual pinboards, organized by topic. Once pinned, other users can view your photos and pinboards, “repin” photos to their own pinboards, comment on photos, and like them. This had led to an explosion of traffic for some websites, especially ecommerce retailers. Many people use Pinterest when researching new purchases, to organize ideas, etc. For example, I just created a pinboard containing the top golf drivers I’m researching for the 2012 season. That’s if I get to play this year. :)

Based on the rapid growth of Pinterest, and all the buzz associated with that growth, I’ve received a lot of questions recently about how ecommerce retailers could get more involved. Also, website owners want to know the best ways to make it easier for Pinterest users to pin photos that are located on their respective websites. So, I decided to write this post to explain various ways to include the “Pin It” button on a website. I will include instructions and information below for how to include a “Pin It” button on a webpage, on a WordPress blog or website, and how to address adding the “Pin It” button to an ecommerce CMS (which is the most challenging of the three).

What is the “Pin It” Button?
Before we hop into the instructions, I’ll quickly cover what the “Pin It” button is. You have inevitably seen Like buttons, Tweet buttons, +1 buttons, etc. as you travel the web. Those social plugins make it easier for users to share content to Facebook, Twitter, and Google+ from websites across the web. Well, Pinterest also wants to make it easier for users to quickly pin content. So, they created the “Pin It” button. In its simplest form, it’s a small button that you can place on a webpage that enables users to quickly pin content to a pinboard, while also showing how many “pins” it has received. You can tailor the code of the “Pin It” button to specify the URL of the webpage, the URL of the image you want users to pin, and the description that populates the “Pin It” form. You can also tailor how the “Pin It” button displays on your webpages.

The “Pin It” button (both horizontal and vertical layout listed below):

Since there are several types of websites, and each brings its own type of installation, I’ll cover a few of the most common methods below. My hope is that the following information and instructions can help you get up and running quickly. Let’s face it, if you make it easier for users to pin content, the greater chance you have of receiving a spike of traffic from Pinterest. Let’s jump in.

Instructions for Adding the Pinterest Button to a Simple Webpage
This is the most basic implementation of the “Pin It” button. Let’s say you have a webpage with a killer photo of your core product. Maybe you don’t have many products, but just sell a handful of core products. If that’s the case, you could use the following instructions to add a “Pin It” button to those product webpages.

Pinterest has created a simple tool on its website to help webmasters create a static “Pin It” button. You can visit http://pinterest.com/about/goodies/ and scroll down to section titled “Pin It” Button for Websites. You will see fields for URL of the webpage the photo is located on, URL of the image located on your servers, and then a description field. The description is optional, but I highly recommend adding that to make it easier for users (since it auto-populates the “pin it” form once the button is clicked). You can also select how the “Pin It” button displays. There is a dropdown that lets you choose if the pin count shows up next to or above the pin button. You can also choose to not show the pin count at all.

Once you enter the required information, Pinterest will generate the code for you below the form. Then you can copy the code and add it to your webpage. There is “Basic” code and “Advanced Code”. The advanced code loads asynchronously, which can help with performance. Also, you should use the advanced code when you want to add several pin buttons to one webpage. You will need to add the resulting code to your webpage (in your html).

Screenshot of what the “Pin It” button form looks like when populated with sample data:

How To Add a Pinterest Button to a WordPress Blog (via a WordPress Plugin)
If you are running a WordPress blog, you are in luck. There are several plugins that you can install that makes it easy to add “Pin It” buttons to your blog posts and pages. I’ll explain two of those plugins below.

The first plugin I’ll cover is called Pinterest Pin It Button, and it provides some great functionality. Using this plugin, you can add “Pin It” buttons to your posts, pages, homepage, archives, etc. In addition, you can choose to show the “Pin It” button either above or below your main content. For even more customization, you can use a shortcode in your post to add the “Pin It” button within your main content. For example, you can use the shortcode [pinit] within your post to add the “Pin It” button within your content (versus just at the top or bottom of the post).

The Pinterest “Pin It” Button plugin settings in WordPress:

The second plugin I’ll cover offers basic “Pin It” button functionality. The Pin It on Pinterest plugin adds a “Pin It” button at the end of your posts, and it enables you to select which image should get pinned, as well as what the pre-populated description should be. Once installed, you will see Pinterest options in your post editor within WordPress.

How to Add a Pinterest Button to an eCommerce CMS
I mentioned earlier that adding a “Pin It” button to an ecommerce CMS is the most challenging to address. The reason is simple. When you have hundreds (or thousands) of products being handled dynamically by a content management system (CMS), you can’t simply add a static pin it button like we did earlier in the post. The code needs to be dynamically tailored based on the product at hand. There aren’t separate pages for each product within an ecommerce CMS, but instead, the CMS dynamically handles each product via database-driven code. This means you cannot simply ftp product pages to your server for each product you sell on your website. The underlying code needs to determine the right URL’s and description for the “Pin It” button.

In order to add any code to an ecommerce CMS that addresses the specific URL, images within the post, etc., you will need to understand the specific functions and variables that your CMS uses. By the way, even WordPress works this way. WordPress is a CMS, although many people don’t realize this. For example, there is a function that WordPress uses to determine the current URL, and it looks like this:

In WordPress, the_permalink() returns the current URL, which can be used to populate the “Pin It” button code. This is the approach you would need to use for your own CMS. The good news is that any reputable ecommerce CMS will provide a reference guide that includes the various functions and variables that can be used. Actually, it’s common to use these functions and variables to perform other tasks.

For example, here is a webpage explaining how to add a pin it button to Shopify. You’ll notice that the example includes variables specific to Shopify for determining the current URL, image URL, and description. Again, your own ecommerce CMS provider should provide similar variables you can use when adding the pin it button to your website.

A “Pin It” button on a Shopify ecommerce website:

My recommendation is to contact your ecommerce CMS provider and track down the necessary code for referencing the current page, images within product pages, and the description you want to use for the image. Once you have that information, you can add the necessary code to your CMS template or theme to handle the “Pin It” button. It will then dynamically pull the correct information for each product page on your website.

Summary – Enable Users to Pin Content Easily
I hope this post helped you understand more about Pinterest, including how to add a “Pin It” button to your website, WordPress blog, or ecommerce CMS. Pinterest is growing rapidly and adding the “Pin It” button to your website can make it easier for users to share your content. This can give you a greater chance of having that content get noticed, shared, etc., which can result in increased traffic, exposure, and sales. And that’s what ecommerce is all about!

I recommend you start thinking about Pinterest today. You should speak with your development team or programmer to see how you can implement the “Pin It” button soon. Pins are waiting. :)

The Gift Card – The Lamest, Most Uncreative Holiday Gift in the History of Gifting

November 23, 2011 By Glenn Gabe

Gifts Cards are a Lame Holiday Gift

The holiday season is fast and furious for me as a digital marketer. I have the opportunity to help several companies with a wide range of holiday campaigns, from Search Engine Marketing campaigns to Facebook campaigns to Email Marketing campaigns. It’s an exciting time of year for digital marketers. But, as I’m brainstorming and developing campaigns, I’m often researching top gift ideas as part of the process (across industries). And it’s not long before I come across the dreaded gift card.

This is a post I’ve been meaning to write for a while, as gift card buying has hit an alarming rate. I have nothing against the idea of a gift card. Instead, I have a big problem with the idea of giving one to family members and close friends (the people you will be gifting the most during the holidays). In a world where most people are moving at light speed to balance work, kids, friends, etc., I think the gift card has been a byproduct of this madness. Unfortunately, it’s not uncommon to see gift lists now filled with “Gift Card From {enter company here}.” And that’s downright pathetic.

Sure, it’s easy, it’s fast, and overall, it gets the job done. But if you take a closer look, it’s not hard to find several key problems with giving gift cards to your loved ones. Let’s explore this in greater detail below.

Nothing Says I Love You Like a Piece of Plastic with a Number on It…
I love you honey, and that’s why I bought you a piece of plastic that looks like a credit card with a 30 digit number on it and a dollar amount. :) Think about it, if you know someone really well, have been observing what they do, while listening to them over an entire year, would you really give them a gift card for the holidays? No, you wouldn’t. You would think about what they like, observe what they need, identify things they would love to have, and then create a gift list filled with those items. Then, when the holidays arrive, you would have a great list of presents to buy them, without having to settle for a lousy gift card.

I don’t know anyone that believes a gift card communicates “I love you more than anything”, or “You’ve been a great friend over the years”, or “Thank you for being a great mom or dad!” Come on people, give up the gift cards. And you wonder why the divorce rate is so high! :)

Low Risk, Low Reward
Anyone that knows me understands that I am not risk-averse. Like business, gifting is a high risk, high reward activity. If you take risks gifting-wise, it could pay off huge dividends for you. On the other hand, if you stay conservative and buy something like a gift card, you may very well get a lukewarm response. Hey, can you blame the recipient? You just handed them a piece of plastic!

When you buy a unique gift, you come armed with the element of surprise. This can be incredibly powerful when gifting. If you hit a home run, that gift will be remembered for a long time. It also shows that you went the extra mile, thought about the person, identified their likes and dislikes, and made a decision to buy a gift. That alone will go a long way… And, if your effort fails, the worst thing that could happen is they don’t like the gift. They’ll still remember that you took a risk and bought them an actual gift. That’s right, an original gift idea, versus that flimsy gift card.

By the way, a recent study by Plastic Jungle found that Americans are sitting on $30 billion in unused gift cards. Think about it, someone receives a gift card, doesn’t really care, forgets about it, and the card is left unused. Wow, what a great gift idea…

A Better Approach to Gifting
OK, so you know where I stand with gift cards. But I’m not here just to hammer gift cards. I’m going to provide a bulleted list of recommendations that can help you break out of the gift card cycle. The approach I’m going to list below is relatively simple to follow, and can make a big impact on your gifting results (yes, I always think in terms of marketing) . Sure, you could still fail and choose the wrong gift, but you could also end up looking brilliant. Remember, high risk, high reward.

Try This Approach to Gifting:
* Identify and list all of the top interests someone has.
* Document the various things they do in a typical week or month.
* Identify pain points for that person. For example, if they jog a lot, do they have the right gear, the right sneakers, do they have a treadmill, are they tracking how far they go, etc?
* Listen to them. That’s right. If you actually listen, you can identify several possible gift ideas. The problem is that most people don’t listen…
* Take Risks. As mentioned earlier, don’t fall for the lame gift card. Sure, it’s easy, but so is buying lunch from McDonalds. The former will make you look dull, while the latter can kill you. Both are bad. Try and come up with something that could surprise them gift-wise. Remember, the element of surprise is powerful.

Leave The Gift Cards Behind, Be Unique, Be Creative
If you follow the bullets above, I’m confident you can find several gift ideas per person that have the potential to blow them away. Gifting should be fun, it should not be an afterthought, and it should not take three minutes at Barnes and Noble or Lowes. Instead, you should take the time and effort to come up with unique gift ideas for family and friends.

Remember, you can be successful at this… You’re not lame. You’re not boring. You remember what people say. You’ve noticed what people need. And when you come through like a gifting superstar, they just might remember what you gave them forever. And as they jump for joy after opening your gift, they can throw the wrapping paper on the person next to them. You know, the person that just got a lame gift card. :)

Happy Holidays.

Welcome to the Jungle, I Mean Boardroom – Presenting The True Return on Investment (ROI) of Social Media Marketing

October 27, 2010 By Glenn Gabe

Last Wednesday, I presented at Trenton Small Business Week on behalf of the Princeton Chamber of Commerce. The topic of my presentation was, “Understanding the True Return on Investment (ROI) of Social Media Marketing”. It’s one of my favorite subjects since it combines two topics that I’m extremely passionate about, Social Media and Analytics. Actually, it combines much more than just those two subjects, which comes across as I take people through the 53 slide presentation.

Although Social has gotten a lot of coverage in digital marketing, it’s clear that business owners are still wondering what the return will be. As I explain during the presentation, there unfortunately isn’t an easy formula for calculating ROI when it comes to Social Media. One of the core reasons ROI is tough to calculate is because Social Media impacts so many other channels and efforts, that it would be hard to run a straight formula. In addition, I’ve found that most companies completely underestimate the time and resources needed to effectively drive a Social strategy. And time and resources can quickly be seen in your costs. So, the combination of not understanding the ways Social is helping your company mixed with easily seeing the costs involved makes for a lethal combination from an executive viewpoint.

The Digital Ecosystem and Tracking
During my presentation, I first want to make sure the audience has a solid understanding of the digital ecosystem, including how all the various parts can work together (and often do). After that, I try and explain the various ways that Social Media can impact the bottom line. That includes impacting both revenue and costs. And weaved throughout the presentation is an extreme focus on tracking and analytics, with the core point being that if you’re not tracking your digital marketing efforts on a granular basis, you’re essentially flying blind. And if you need to make a case for your Social Media efforts to your boss or executive team, then flying blind won’t turn out very well for you. If you are only armed with opinion, you might be kissing your budget goodbye. In my experience, you can debate opinion until the cows come home, while data is hard to ignore. Always come armed with data.

You’re On in 5 Minutes. And Don’t Waste My Time Mr. Social Media Hot Shot
After I go through numerous examples of how Social can impact a business, the presentation culminates with one slide that hits home for many marketers. It hits home because it puts the audience in the role of having to present to an executive team that wants to know how the company’s Social efforts are impacting the business. The slide presents a long list of possible answers to that question (based on the tracking you will hopefully have in place). So, I’ve decided to provide that list here in this blog post. It is by no means complete, but I think it gives you a quick understanding of the types of data that can be presented to make your case.

Before you view the list, here are a few important notes:
1. Every point in the following list will not tie to your own business. I’m simply providing possible answers to questions about Social Media ROI based on what I have seen first-hand. Also, I have been on both sides of the presentation. I have led presentations like this, but I have also helped executives understand the ROI of their social efforts (as a consultant).

2. In order to provide answers like what’s listed below, you must fully understand the various ways that your specific business can be impacted from a cost and revenue standpoint. Every business is unique. Don’t jump in without fully understanding the specific nuances of your own business.

3. You must have a solid strategy in place for Social Media Marketing. That’s not simply setting up a Twitter account and creating your Facebook Page. If you blindly jump in, I can tell you with almost 100% certainty that you will fail. And many companies are failing when it comes to Social Media Marketing. My presentation covers the core reasons why this is the case (but that’s for another blog post).

4. You must have tracking in place. As mentioned earlier, do not fly blind. Map out an analytics strategy in order to track both on-site and off-site metrics. Track as many KPI’s that make sense for your business and have a mechanism in place for tracking and trending that data. Note, you should track both quantitative and qualitative data. Remember, we are talking about “Social”, so some of your data will include actual correspondence (emails, tweets, messages, comments, etc.)

Setting The Stage – Welcome to the Jungle
As you step into the boardroom, you notice that the room goes silent. The CEO gives you a minute to hook up your laptop and then says, “OK, I gave you a budget last year to launch our Social Media efforts. We want to know today how that’s doing. So, what’s the ROI of Social Media FOR US?

{So, if you’ve mapped out a solid strategy, executed at a very high level, have tracking in place, and understand all the ways that Social can impact your business, your answer might look like the following.}

Well, I can’t give you a hard ROI number today. {3 members of the executive team gasp while the CFO snickers.}

But, I do have a number of data points to present.
{Remember, data is good, opinion is bad.}

Since we started our Social Media Marketing efforts 12 months ago…

Overall site traffic levels have increased by x%.

Traffic from Social Media sites has increased by y% (as you show trending graphs for each).

Overall revenue has gone up by x% since we launched our Social efforts…

And revenue directly from Social Media sites has increased by y%, but this doesn’t tell the whole story. More on that shortly. {BTW, to show revenue from Social, you set up an advanced segment to only show data from all Social sites.}

Overall support costs went down by x% as we were able to handle y# of customer issues via Twitter and Facebook.

Further, according to a post on Bitcoin Era Erfahrungen, based on using Social Media to nip support problems in the bud, we saved x # of customers that were ready to leave us. Our typical response time was y minutes from the time of the first sign of a problem (via monitoring real-time updates.)

Here is a document containing all customer and prospective customer correspondence via Social Media for the past year. {Document is so long is rolls out onto the floor.}

Since we know how much it costs to acquire a customer and how long it takes for a customer to become profitable, our Social efforts have saved the company $x in cost (by decreasing the Quit Rate of customers and not having to make up for those lost customers).

Our Social efforts also drove y # of new customer sign-ups, with the strongest number of sign-ups coming from blogging, Twitter, Facebook, and YouTube. Trending shows an increase in new customer sign-ups 4 months after our Social efforts launched, while maintaining higher levels of sign-ups throughout the year. (The black hole of Social Media was 4 months for our company.)

We increased our in-house email list by x number of subscribers…

With a majority of new sign-ups coming from organic search, blog posts, and referrals from both Twitter and Facebook. More on how Social impacts SEO soon.

And our in-house email list drives y% of revenue for the site (our second largest driver of revenue for the site.) Each subscriber accounts for $z per year.

We now have x Twitter followers and y FB fans.

These two assets enable us to engage our customers on a regular basis…

Which leads to powerful insights regarding our company and products, like… (add qualitative data here…) As a specific example, we launched the new version of Product X in March, only to find out via Twitter that many customers were experiencing problems with Y feature. We worked quickly and resolved the issue and formed even a stronger bond with many of those customers. Some of those customers ended up backing us up when other unhappy customers started attacking our company. The resulting positive word of mouth marketing about how we handled the situation resulted in x number of articles written about our company, which led to y number of new visitors to the site, which resulted in x number of new blog subscribers, y number of email subscribers, and z number of FB fans.

Trending shows spikes in traffic, orders, and revenue each time we share special offers, discounts, and exclusive deals via Twitter and Facebook. Here are the spikes I am referring to (showing trending graph with revenue overlaid).

Our blog now has x subscribers…

And our blog has helped us boost our website’s SEO power, which has led to an increase in natural search rankings…

And SEO accounts for x% of revenue on the site. It is currently the top driver of revenue.

Further, our blog accounts for most of our website’s inbound links (the valuable links anyway). These inbound links have a direct correlation to the trending you are seeing in this graph. {showing trending again} We’ve seen an increase in rankings, organic search traffic, and revenue from organic search. And there is no advertising spend for organic search traffic (while showing budgets for paid efforts).

Our increased natural search rankings led to a decrease in paid search spend, which we then reallocated to our Social efforts (to drive more of what I am presenting here).

Our blog also led to guest posts on highly influential blogs and sites. Those posts helped us gain incredible exposure in our industry…

Which led to x # of visitors back to our blog.

Which led to an increase in email subscribers, Twitter followers, and Facebook fans. As presented above, these three assets led to $x in combined revenue.

{Your CEO cuts in: Can you start over? I want to take notes.
The CFO is already through his second pencil, he’s been writing so fast.
Your CMO: {on phone with executive assistant to set up personal Twitter account.}

And after all of this planning, tracking, execution, and presenting, you might just have a new seat in the boardroom (see below). :)

Can You Make A Case Like This?
As you can see, data can be your best friend. You might not be able to easily show the hard ROI from Social Media, but you sure can have a lot of data backing your efforts. In closing, have a strategy in place, understand the black hole of Social Media, track everything you can, trend changes over time, and document both quantitative and qualitative data. This is the type of information that your boss will love (and his boss too). Become obsessed with data. You won’t regret it.

Web Server Monitoring – Give Your Online Marketing Campaigns a Fighting Chance With a Digital Scout

August 6, 2010 By Glenn Gabe

You’ve mapped out an incredible online marketing strategy. Your developers have been frantically working to meet your deadlines, the creative is approved, dates set, and your campaigns are almost ready to launch. Everyone is excited. But, are you missing one critical element that can literally save your campaigns? You just might be… One important thing I learned early in my career is that your online marketing campaigns are only as good as the servers they are run on. For example, imagine driving thousands of people per day to a site that is down 25% of the time. Imagine an e-commerce site that bombs during checkout 10% of the time. Or worse, imagine you receive so much attention and traffic that your site is down for days at a time (wasting significant amounts of budget and an opportunity to land new customers). This is the reality of online marketing, and unfortunately, many marketers learn the hard way how important hosting is to their success.

Enter Server Monitoring, Your Online Marketing Scout
I remember launching a large-scale campaign for a client after starting my own business. There was a critical decision I needed to make as we set up their hosting. I could go with dedicated hosting or go with a webfarm (where multiple servers work together to balance the load). The webfarm was more expensive and we didn’t know the exact amount of traffic the campaign would generate, so it was a hard decision. I decided to go with webfarm hosting, and I was lucky I did. The campaign drove over 950K visits to the site in just a few days (based on the viral nature of the video content). The webfarm didn’t even hiccup. We experienced no downtime, even though the site was getting hammered from all directions. How did I know that we didn’t experience downtime? I set up server monitoring so I would know immediately if one of the servers went down. It was relatively easy for my hosting provider to set up, cost me very little, and enabled me to know exactly how the webfarm was performing.

Ping It Baby
When server monitoring is set up, the web server in question is pinged at a certain frequency (like every second or minute) to ensure the server responds. If it doesn’t, an email gets immediately triggered to you and a ticket will be set up with technical support. Yes, this is brilliant and can save your campaign from technical failure. In addition to pinging your web server, you can also set up monitoring for your mail server. If you heavily rely on email for your business (which most business owners do), then this can also be an invaluable service. Similar to web server monitoring, the mail server can be pinged every x seconds or minutes to ensure uptime. If it’s down, an email will be triggered and a support ticket opened. Again, this is a smart thing to do for online marketers.

Understand Your Hosting Package and Provider
So, you’re sold on the idea of server monitoring, but don’t know where to start. No problem. First, you need to understand the hosting package you have set up and the various services that your hosting provider offers. For example, do you have a shared hosting package, dedicated package, virtual private server, etc? Is monitoring offered for certain packages and not others? Then you need to find out how much monitoring costs and what you need to do in order to have your provider set it up. I recommend giving technical support a call and speaking with them about the possibilities. Also keep in mind that monitoring will require that your hosting provider is fine with complete transparency. This could separate the great hosting providers from the good ones. You will know every time the server goes down and for how long. This could be somewhat uncomfortable for certain hosting providers, especially if they aren’t confident in their service.

The Cost of Server Monitoring
You might find that some hosting providers will set up monitoring for free and others that will charge a small monthly fee. For example, it might cost you $5-$10 per month per server (and per monitor). If you had a monitor set up for your web server and one for your email server, then it might cost you $10-$20 per month for monitoring. Needless to say, that’s a small price to pay for being confident in your hosting setup (especially if you or your clients are launching several online marketing campaigns). Imagine you were spending tens of thousands of dollars (or more) on the campaign. What’s $5 or $10 per month??

Points to Consider and Key Takeaways:

I recommend having monitoring set up for both your web server and mail server. Then you can be confident that your site is up and running and that you can receive email.
When setting up the email address for the monitor (the address that will be emailed if your server goes down), don’t use an email address at your domain. Use a gmail address or another web-based email account. If your mail server is run on the same machine that runs your web server, then you won’t get the email notification when your servers goes down… :) Find out from your hosting provider if your mail server and web server are on separate machines.
Make sure the monitor emails you when the sever goes down and when it’s back up. Then you can identify the true downtime that the site experienced.
Have your hosting provider test the monitor once it’s set up. Then you can make sure you are in fact emailed and that a support ticket is opened. Like everything else in technology, testing can save you from an embarrassing situation.

Monitoring Is Smart, Set It Up
As you can see, I believe server monitoring is extremely important for online marketers. Don’t let web server downtime ruin your online marketing campaigns. There’s nothing worse than doing your job well as an online marketer and then having a server fail. If that happens, your campaign fails along with the server. If visitors cannot get to the site in question, then you’re dead in the water. Think of your monitor as an online marketing scout that will watch over your servers. A scout that never sleeps, checks your servers continually, takes no sides, and can save your campaigns. Set monitoring up now.

How To Track Elapsed Time (or Time to Complete) in Google Analytics Using TimeTracker [TUTORIAL]

June 2, 2010 By Glenn Gabe

Tracking elapsed time in Google Analytics via Time Tracker Over the past few years, conversion optimization has become an incredibly important service that I provide for my clients. Sometimes in order to improve conversion, there are times that I need to analyze a multi-step process that occurs on one page. A good example of this would be an elaborate form that visitors need to fill out (without linking to additional pages). Or, I might be tracking a multi-step process that spans several pages, but want to know more about each specific step. If you run into situations like these, then it might not be sufficient to simply track how many people converted. You might want to analyze how long it’s taking for those visitors to complete a certain process (in order to identify obstacles along the way). This is when using tracking functionality like TimeTracker in Google Analytics can come in very handy.

What is TimeTracker in Google Analytics?
TimeTracker extends event tracking in Google Analytics and enables you to track elapsed time, or Time to Complete. I’ve found that many people aren’t familiar with TimeTracker, don’t use it much, or don’t know how to properly set it up. So, I’ve decided to write this tutorial to walk you step by step through the process of setting it up. Then I’ll quickly show you how you can check the event tracking reporting for TimeTracker in Google Analytics.

For our purposes, TimeTracker will enable us to trigger the start of a process (like clicking a button, entering text, or selecting a checkbox). We will start a timer at that point. Then it enables you to trigger the end of that process (again by some action taken by the user). At the end of the process, we will stop the timer, record the elapsed time, and then communicate with Google Analytics to track the result as an event (via Event Tracking).

Let’s get started. Open up your html editor of choice and get ready to use TimeTracker.

1. Define What You Are Going to Track
For this tutorial, I’m going to keep the process and form simple so you can clearly understand how to use TimeTracker. I’ll show you how to start the timer with the first click of a form element and then how to stop the timer and send the data to Google Analytics when users click the submit button. Again, this will be a basic setup so you can easily follow along. You will probably want to write some custom logic for your own projects, based on the specific process you are going to track.

2. Adding The Form Elements
We’ll start by adding a simple html form to your webpage. In your form, add a group of radio buttons to enable users to select their age. Since this is the first form element, we’ll start the timer via TimeTracker when someone clicks a radio button. After adding the radio buttons, you can add several additional form elements, based on what you need to track. I won’t cover how to add the additional form elements, since they don’t impact TimeTracker. Basically, they can be standard html form elements (text boxes, dropdowns, checkboxes, etc.) At the end of our form, we’ll add a submit button for users to complete the process. The submit button will first stop the timer and then send the data to Google Analytics via Event Tracking. We’ll complete this via a custom JavaScript function that we’ll write later in the tutorial. Don’t worry, it’s a simple JavaScript function. :)

Radio Buttons Will Start Our Timer:

First, add your form, the radio buttons, and your submit button: We will add the TimeTracker code later in the tutorial.



    	18-24

        25-40

3. Download the JavaScript (or link to it from your code)
The TimeTracker JavaScript code can be found on the Google Code page for extending event tracking. You can either link to that code directly from your page or you can include the code in your own JavaScript file. I included the code in my own file by copying and pasting the JavaScript code into a new text file and saving it locally as “time-tracker.js”. Note, you will also need your typical Google Analytics snippet included in the page.

Click the TimeTracker() Title to Access the JavaScript Code:

4. Add the JavaScript code to your webpage
In order to add the code to your webpage, simply include the following line of code in the head of your html document.

Note, make sure you enter the actual location of the JavaScript file on your server and that you reference the correct file name. Replace “yourdomain.com” with your own domain.

5. Create Your TimeTracker Object
You will need to create a TimeTracker object in your JavaScript code, which we will end up calling from our form elements in order to start and stop the timer. The code will also send the data to Google Analytics (via Event Tracking). Add the following code below the code you entered earlier (where you referenced the TimeTracker JavaScript file).

6. Customize the JavaScript (Histogram for Time Intervals)
There is an optional array you can specify when you create the TimeTrakcer object. It’s called setHistogramBuckets() and it enables you to set the time intervals that get passed to Google Analytics (when the event is sent and tracked via Google Analytics). For example, you can specify the time intervals (the buckets of time) that Google Analytics will drop users into (based on how long they spent completing the process you are tracking). If you leave this empty, TimeTrakcer has default time intervals (which might not fit well, given your specific form or process).

The default buckets will start at 100 milliseconds and go up to 5000 milliseconds. In case you are wondering, there are 1000 milliseconds in one second. I highly recommend setting the time intervals, based on the specific process you are tracking. For example, if you think the process could take up to three minutes, then you would set up intervals leading up to three minutes. Three minutes is 180 seconds, or 180,000 milliseconds. For our purposes, we’ll set six intervals starting at one second and that go up to 25 seconds. If it takes someone more than 25 seconds, you’ll see it recorded as 25000+ in your reporting (so they won’t be left out). Here is the code you should add right below the code you added above (where you created your TimeTracker object). Note, add this code within the script tags you already coded earlier.

Specify your own time intervals via the setHistogramBuckets() function:

timeTracker._setHistogramBuckets([1000, 2000, 5000, 10000, 15000, 25000]);

The final block of code should look like this:

7. Add JavaScript to Start Your Timer
Now that you have your form elements in place and you’ve included the necessary JavaScript code, you’re ready to start your timer. In the first form element (the radio button), add a call to TimeTracker to start the timer.

Now here is the code for the JavaScript function called completeTracker(). Add this code to the head of your html document:

function completeTracker() { timeTracker._recordEndTime(); timeTracker._track(pageTracker, undefined, 'Lead From Page X'); }

The code explained:
The first line simply stops recording the time. The second line sends the data to Google Analytics via event tracking. The first parameter is your pageTracker object, which is created via your standard Google Analytics code snippet. The second parameter is optional and will enable you to customize the category of the event in your reporting. Categories are essentially the top-level name of an event in your reporting. The third parameter is also optional and will enable you to customize the label that is reported in event tracking. I added a label called “Lead From Page X”, so you could identify where the event was triggered. You would obviously want to replace X with the actual page name that contained your form. You can read my post about Event Tracking in Google Analytics to learn more about the various parameters involved with tracking events.

9. Upload and Test
When you upload your files, make sure you include both the html file and the external JavaScript file. Also, make sure you are referencing the external JavaScript file correctly or your code will not work. For example, did you upload the JavaScript file to the same directory, a code-only directory, etc? Make any necessary changes in your html code if the JavaScript file isn’t placed in the same directory as the webpage containing your form. If you are all set, then click away. I recommend going through the form numerous times from separate browsers and separate systems. Remember, the first radio button triggers the timer and the submit button stops the timer and then passes the data to Google Analytics via event tracking.

10. Wait and Check Reporting
You will probably need to wait a few hours before you can view the reporting in Google Analytics. After which, you can access the Content tab and then click “Event Tracking”. If you click the Categories tab, you should see a TimeTracker category. If you click that category, you should see the various times listed. These are the time intervals that we set using setHistogramBuckets(). If you click each time interval, you will see the specific form or page that triggered the event. For our purposes, all the events were triggered via one form and page. However, that might not be the case if you have multiple forms running on your site.

TimeTracker Events in Google Analytics:

Congratulations! You have just successfully tracked elapsed time (or Time to Complete) in Google Analytics. My hope is that you’re thinking of many more ways to use this functionality in your own projects. I recommend brainstorming several ideas for using TimeTracker to see the potential impact on conversion. I would start small and then increase the complexity of each project as you get more comfortable. As you can see, it’s relatively easy to set up and can provide insight into how long it takes visitors to complete certain processes on your site.

By the way, it just took you 10:42 to complete this tutorial. Just kidding. :)