Wednesday, November 6, 2013

Tracking Vimeo Video Events into Google Analytics, the Easy Way!

So you've got an awesome website and an awesome video hosted on Vimeo. You dropped the Vimeo hosted video into your page like so:

But now you have no way of tracking the video events in Google Analytics. Did your paid traffic play the video? Did your organic traffic complete your video? Did most people stop watching after the first 25%? These questions can now be answered by dropping in a single jQuery powered JavaScript.

Big thanks to Sander Heilbron for the original which supports ga.js, Google's widely used asynchronous tracking script. I have built on his code and added support for the Universal Analytics analytics.js syntax at

The script detects which version of Analytics you have (ga.js or analytics.js) and tracks events accordingly.

Events being tracked include:
  • Vimeo played
  • Video paused
  • Video completed
  • Video skipped forward or backward
  • Video reached 25%
  • Video reached 50%
  • Video reached 75%

Thursday, October 24, 2013

No Code Required - Auto Analytics Event Tracking with Google Tag Manager #GASummit2013

Coming off of the Google Analytics Summit 2013, some exciting things have been officially announced!

The most exciting to me is an update to Google Tag Manager that allows Analytics Event Tracking to be setup without writing any code! As a developer, it is an ongoing battle to keep Analytics running at its best with some random SEO/marketing group messing around with URL based events and sloppily throwing together Analytics goals without even telling anyone. This is a dangerous practice when the person setting up the goals doesn't understand how the site works.

Event-tracking is the best solution for tracking site data in a surprisingly large number of cases, but if the client doesn't communicate their needs to the developer and the marketing company doesn't reach out either then how can the developer know that Event Tracking should be implemented? They can't... and even if there is great communication all around and all parties agree that Event Tracking should be implemented, it still takes custom coding to make it happen. With these barriers, Event Tracking surely doesn't get used as often as it should.

With the new Auto Event Tracking in Google Tag Manager, a developer simply needs to implement tracking via Tag Manager and then the client, marketing company, or developer themselves can login and add custom Event Tracking without ever editing the code on the website. Too good to be true? It kind of is... Auto Event Tracking isn't for the faint of heart. It requires some Analytics know-how and a certain degree of developer style logic to make the pieces come together. In the end, someone experienced with Analytics implementations should still be generating the Auto Event Tracking rules, but this new system does allow for much better transparency and collaboration across all parties involved.

Thanks to Justin Cutroni for a good Auto Event Tracking video tutorial of the changes and features.

I am looking forward to trying this out on my next project. Anyone implemented it already? What do you think?

Google Music Adds "I'm Feeling Lucky Mix" Automatic Playlist

Tired of Pandora and iTunes Radio playing the same songs over and over, no matter what station you listen to? That's why you listen to Google Music right? That's the case with me.

Personally, I love Google Music.... everything about it actually. Though I admit I have been waiting for a more automated way of listening. Instant Mixes are great, but are still too 'dictated' by me so they can grow stale. That is all changing as Google Music's new "I'm Feeling Lucky Mix" has added some new excitement to listening habits.

Login to Google Music and you'll see this:
Click the magic "I'm Feeling Lucky Mix" button and, based on my experience so far, you won't be disappointed. You can expect songs that match your listening preferences, not just a long list of songs from your most played playlists or a bunch of songs you've "thumbs up'ed" like previous attempts at this sort of thing may have you expecting. You can also expect the mix to be very diverse across all genres which makes it more interesting.

Thursday, May 16, 2013

Change Background Image with a Fade Transistion Using CSS and jQuery

I came across a question recently regarding how to use a 'fade' effect when changing/rotate through various background images. The sites I've been working on lately seem to all utilize large background imagery and I have written several custom background rotation scripts to accomplish rotating homepage hero type effects with background images. The jQuery involved is something for another posts, but the CSS to achieve a fade effect is very simple.

You can fade a background image using CSS3 transitions. I have accounted for non-CSS3 browsers in jQuery implementations using more complex strategies, but for most applications this CSS3 strategy will do just fine. It will offer a nice fade on compatible browsers and just a plain transition on others.

Set up jQuery to change the background image, but apply the transition style using the below CSS. Anytime the background changes, it will transition according to the CSS3 style.

    background: url('images/header_slides/slide_1.jpg') no-repeat;
    transition: background 0.5s linear;
    -moz-transition: background 0.5s linear; /* Firefox 4 */
    -webkit-transition: background 0.5s linear; /* Safari and Chrome */
    -o-transition: background 0.5s linear; /* Opera */

Saturday, May 11, 2013

Using Multiple Google Accounts with Chrome

Google Chrome's ability to keep your history, bookmarks, passwords, and even tabs in sync across devices is awesome, but what happens when you bookmark a great new article for work and you are on your personal computer logged in to your personal Google account? You get to work the next day and have to sign out of your work Google account in Chrome and sign in to your personal Google account which is time consuming and too much trouble. What if you could take your work Chrome browser home with you and have access to your personal Chrome browser at work? It would be amazing right?

Well, it is possible and it truly is amazing. Imagine RDP'ing into your work computer just to access a saved login and bookmark... forget it! Now you can just switch Google accounts and Chrome and you are practically on your work computer using your work browser. How is it done? Pretty easily actually!

To setup and switch between multiple Google Account on Google Chrome:
  1. Login to Chrome with Google Account A.
  2. Click the Options/Tools/Settings icon Chrome menu.
  3. Click 'Add New User' under the 'Users' heading.
  4. Login with Google Account B.
  5. Click Google Account B in your User list and click 'Edit' to set a custom icon and account name.

  6. Switch back to Google Account A by clicking the (newly appearing) icon in the top left corner of Chrome and selecting Google Account A.
  7. Go back to the User settings and click on Google Account A and then 'Edit' to change the icon and account name, just like Step 5.

  8. You can now easily switch between accounts by clicking the icon at the top left corner of Chrome.
  1. You cannot have multiple accounts open in the same window. Each account must have a dedicated window.
  2. You cannot drag tabs between Chrome windows that are logged in on different accounts.

Tuesday, May 7, 2013

Finding Latitude & Longitude on Google Maps

Why is finding Latitude and Longitude with Google Maps so annoying? Why do we even need it anyway? Well, sometimes the application calls for it and we must dig in and discover the lat/long coordinates of a location on a map... a Google map. There are ways to do this and everyone seems to have their own way, but there is a magic button that can do this for you so easily it will make you embrace lat/long all over again!

  1. Simply drag this bookmarklet to your bookmarks bar.
  2. Visit Google Maps and find your point of interest whichever way you like.
  3. Right click and center the map on that point.
  4. Click the bookmarklet and you'll be presented the Lat/Long.
The script ties in with Google's scripts and returns the lat/long of the center point of the map. This has been incredibly useful for me and I suggest keeping it handy for that dreaded day you need to look up multiple lat/longs for some project of your own.

Credit goes to: Ian at iTowler

Friday, May 3, 2013

ColdFusion cfqueryparam MS Access Data Types

Once you get comfortable with it, ColdFusion's cfqueryparam is an excellent tool. It can enhance security, tighten up code, and conveniently ensure the correct data types are being used in your database statements. If you have looked in cfqueryparam at all, you've surely noticed that Adobe provides an excellent cfqueryparam cross-reference of data types for all sorts of databases... except MS Access.

I inevitably ran across the need to use cfqueryparam with a MS Access database and was struggling to match the data types. Access data types can be obnoxious, especially when the db designer has taken it upon himself to establish an obscure Access data type for every column. Thankfully, cfSearching provided a helpful table cross-referencing Access data types with cfqueryparam data type attribute values. I can vouch for the note that "when using the Unicode driver, the correct type for MEMO fields is CF_SQL_CLOB (not CF_SQL_LONGVARCHAR). "

Credit goes to cfSearching for the cross-reference, but here it is in case their page is down or goes away for whatever reason... it would be a shame to lose this information!

ColdFusion                  Jet                     MSSQL
CF_SQL_BIT                  Yes/No                  bit
CF_SQL_DECIMAL              Decimal, Currency       decimal, money, small money
CF_SQL_FLOAT                Double                  float
CF_SQL_INTEGER              Long Integer            int
CF_SQL_LONGVARBINARY        OLE Object              image
CF_SQL_LONGVARCHAR          Memo                    text, ntext
CF_SQL_MONEY                                        Double                      
CF_SQL_REAL                 Single                  real
CF_SQL_SMALLINT             Integer                 smallint
CF_SQL_TIMESTAMP            Date/Time               datetime, smalldate time
CF_SQL_TINYINT              Byte                    tinyint
CF_SQL_VARCHAR              Text                    varchar, nvarchar, sysname

Tuesday, April 30, 2013

How to Temporarily Unroot Your Android

I previously posted about Flixster not allowing me to watch my Ultraviolet Digital Copy of Dredd since my Galaxy S3 was rooted (CM10.1). I have since seen lots more complaints about apps that block rooted Android phones. Most of these apps have to do with digital media, so the anti-root lockdown isn't surprising... even if it doesn't really make sense. The debate as to why a rooted Android would be blocked from using a specific app is immaterial. The fact is, Android root blocking apps exist and there is something you can do!

It is actually a simple and awesome app called OTA Rootkeeper, by none other than Project Voodoo. The techno-wonder that brought you Voodoo Sound and many other great Android utilities and apps. OTA Rootkeeper allows you to 'unroot' your Android temporarily. It backs up your 'root' and stores it away for safekeeping until you need to go back to using root-required apps like Titanium Backup and Root ExplorerOTA Rootkeeper keeps your phone 'unrooted' as long as you need to use stingy anti-root apps like Flixster, but can restore root on command to set everything back to normal again!

Using OTA Rootkeeper is a very simple 3-step process, though be sure to read all the warnings.... it is not compatible with all Androids and configurations. I am running is on a Galaxy S3 CM10.1.

  1. BACKUP ROOT: Launch the App, give it Superuser permissions and tap 'Protect root'
  2. UNROOT: Tap 'Temp un-root (keeps backup)'
  3. RESTORE ROOT: Tap 'Restore root'

Wednesday, March 27, 2013

How to Switch Between Multiple Accounts for Marvel War of Heroes for Android

Marvel War of Heroes has got me hooked! It is available on both iOS and Android and allows playing between players on both platforms. Like many mobile games out there, this game 'throttles' you as you only have so many energy points or attack points to spend before they recharge. This results in only a few minutes of gameplay at a time before you can't really do anything else and have to wait for your energy/attack to recharge.

You can keep the Marvel War of Heroes gameplay going by setting up multiple accounts and switching between them on your Android. It is as easy as tapping a widget and selecting a different account before you re-launch Marvel War of Heroes! There are a few different ways to do this, but this specific method couldn't be easier!

How do you switch between multiple accounts on Marvel War of Heroes for Android?
*Each account needs a UDID (Unique Device ID). If you create the accounts on different phones, you don't need to worry about this. If you are creating accounts from one phone, you'll need to force the UDID to change which can be done a few different ways. I am not going to explain how to change your UDID. I don't recommend doing it and it can cause issues with other apps that are installed. The best practice is to just create alternate accounts on alternate devices.

Use Titanium Backup Pro and setup multiple profiles for the app.
First of all, Titanium Backup Pro is a must-have Android app (see here and here). The main point here though is that setting up multiple profiles in Titanium Backup is easy and quick.

  1. Select the option to setup/switch profiles toward the bottom right of the main Titanium Backup screen.
  2. Tap "Create a new data profile..." (this is your primary account, so name it appropriately).
  3. Go ahead and make additional profiles for any additional Marvel accounts you have.
  4. Tap Backup/Restore at the top of the main Titanium Backup screen and find Marvel War of Heroes.
  5. Long press on Marvel War of Heroes and select the option "Enable 'multiple profiles' for this app"
  6. Now add the Titanium Backup Data Profile switcher widget to your home screen. You can tap this widget to quickly change between profiles/accounts.
  7. Use the widget to change to one of the alternate accounts you've setup and then re-launch Marvel War of Heroes normally... it will ask you to login. This login will be associated with the currently selected Titanium Backup profile.
  8. Use the widget to change to your primary account and re-launch Marvel War of Heroes. You'll be logged in as your original/primary account.
  9. Now you can easily switch between accounts and keep the game going!

Monday, March 25, 2013

ColdFusion and "Reserved Words" for MS Access

While I normally only use SQL Server, Oracle, or PostgreSQL, the need inevitably arises to work with an Access database in ColdFusion. Sometimes it is solely for data migration, sometimes to meet a client's specs, but regardless of the reason... there is this annoying thing that must be dealt with when using Microsoft Access databases: "Reserved Words".

You see the issue is that you can't use Microsoft Access reserved words in ColdFusion queries or they will blow up... and the kicker is: there are a LOT of reserved words. Check out this list of reserved words for Access 2000 alone. This means you will inevitably encounter issues when writing queries.

There is a very simple solution though! Simply escape these reserved words by placing inside [brackets]. For example, a column named DATETIME will need to be referenced as [DATETIME].

Hopefully you found this blog post helpful. Sometimes the simplest solutions are the hardest to find!

Friday, March 22, 2013

How to Dynamically Restrict From/To Dates with jQuery UI Datepicker

It has been awhile since my last post, but things sure have been busy over at Limelight Web Development! Anyway, I figured it was time to update the blog and pass along a useful piece of jQuery magic!

You are probably familiar with jQuery UI Datepicker already. It has a lot of options built in, a couple of which allow you to restrict the selectable 'to' and 'from' dates. The provided examples over at the jQuery UI site are useful on a single implementations, but what if you want to implement this across your entire site and not have to mess with it any more?

Let's assume your forms have a consistent structure across your entire application/site, like so:

 <!-- To/From Date Form Block -->
<form action="/action/" id="myform" method="post" name="myform">
  <div class="horiz">
    <div class="leftColumn">
      <label for="from_date">From:</label>
      <input class="datepicker" name="from_date" type="text" value="" />
    <div class="rightColumn">
      <label for="to_date">To:</label>
      <input class="datepicker" name="to_date" type="text" value="" />
  <div class="submitWrapper">
    <input name="submit_dates" type="submit" value="Submit" /> 

The main requirement being that all date inputs have class "datepicker", all from fields contain "from" in the name attribute and all to fields contain "to" in the name attribute and they are each descendants of a 'form' element. They don't have be direct children as you can see in the example code block above.

Now to implement datepicker across the entire site with automatically restricted maxDate and minDate on the appropriate fields, the following code will do all the work for you. It will make the to-date's minDate the same as the from-date's selected date. It will make the from-date's maxDate the same as the to-date's selected date.

 //jQuery UI Datepicker Universal Config
  showAnim: "slideDown",
  dateFormat: "mm/dd/yy",
  onSelect: function(dateText, inst){
   if( $(this).attr('name').indexOf('from') > -1 ) {
    var $from_date = $(this).datepicker("getDate");
    var $to_date_input = $(this).closest('form').find('.datepicker[name*="to"]');
    $to_date_input.datepicker("option","minDate", $from_date);
   } else if( $(this).attr('name').indexOf('to') > -1 ) {
    var $to_date = $(this).datepicker("getDate");
    var $from_date_input = $(this).closest('form').find('.datepicker[name*="from"]');
    $from_date_input.datepicker("option","maxDate", $to_date);

Thursday, February 14, 2013

Google 'Flaw' Puts Users' Details on Display

A friend recently shared this article with me, entitled "Google 'flaw' puts users' details on display" which was posted at It basically trashes on Google for sharing your personal info with the app developers from which you purchase apps. First of all, the last time I bought something at +Lowe's Home Improvement and used self-checkout I had a camera staring me in the face the whole time. The last time I ordered something from, I gave them all my personal contact info. An app market mining your info shouldn't be surprising either.. after all you are still a customer buying a product.
That being said, this may be concerning if Google users weren't already used to giving up privacy in return for services. As soon as you signed up for that first Gmail account, you were on board whether you knew it or not. Nothing privacy related should come as a surprise at this point when it comes to Google or any other company. Every time these types of articles pick up steam the biggest shock to me is that people still think this is news. Ever since you plugged your computer into the internet, you were done...

I was shocked the first time I setup a years ago and had to provide personal info including address and phone number to register the computer before using it. Remember the iPad/iPhone setup process (assuming some Apple employee didn't do it for you)? You gave your life story standing there in the Apple Store or at the cell provider just to get setup. It is nothing new.
If you want full privacy, throw away your phone and pull the plug on your internet connection. Otherwise, be prepared to have your identity and everything about you mined by every company out there... especially the ones that provide the services you use every day. If you still get squirmy thinking about Google 'spying' on you when you use services like +Gmail, +Google, and +Google Maps I hate to think of your reaction to the news of Intel's new Internet-TV Set-Top Box which is on its way to market. +Intel will be deploying it with a camera that recognizes you and learns everything it can about you... it is a TV that watches you!
In summary, if you still get unsettled over privacy, Google, the internet, and so on, I don't blame you. I am just saying I waved the white flag a long time ago and in return fully embraced the wave of resulting technology. My advice to you: consider waving the white flag or face the fact that you will be left in the dark ages until you get on board. I doubt this culture of personalized technology is going to slow down any time soon!


Friday, January 11, 2013

Google Analytics for Beginners (Charlotte, NC 11/17 @ 11:30AM)

Don't miss my presentation on Google Analytics for Beginners at the next @cnpcharlotte meeting!
  • Have you heard of Analytics, but don't know what it is?
  • Have you been told you need Analytics, but don't know why?
  • Have you ever thought about implementing Analytics, but thought it was too much trouble or too complicated?
  • Moreover, do you currently have Analytics running on your website but don't know what to make of the data or how to access the data you want?
If the answer to any of those questions is "Yes," come on over to the presentation! I will be covering those topics and answering questions. I will also throw in some tips that I use on sites like

I have been developing websites since 1998 and was an early adopter of Analytics. Since then I have deployed Analytics onto countless websites and became a Google Analytics Qualified Individual through Google's certification program. I am the Website Development Manager at Limelight Web Development and a member of Charlotte Networking Professionals. Come by and meet everyone, have some good lunch, ask me some Analytics questions, and have a great time!

Location: Villa Antonio Italian Ristorante
                 4707 South Blvd
                 Charlotte, NC 28217

Lunch/Admission: $14

RSVP (optional): Facebook Event Page

Tuesday, January 8, 2013

How to Watch UltraViolet Digital Copy Movies on Your Android

So you just bought a new DVD or Blu-Ray and it includes a Digital Copy/UltraViolet copy... what does that mean? First of all, Digital Copy refers to a digital version you can unlock to watch via iCloud/iTunes... basically for Apple people. Since we are talking about Android, that is not what we are trying to achieve... that is where UltraViolet comes in.

If you unlock the UltraViolet version of the movie, you'll be able to watch it via Vudu (WalMart's media streaming service) which is accessible via your computer/PS3/blu-ray player/smart tv/etc. Unfortunately, Vudu's Android app is not supported across all Android devices. It also has some performance drawbacks (currently at least). The alternative? Watch your UltraViolet copy via Flixster for Android. Flixster is a free app and it can tie to your UltraViolet account to access the digital movies you've unlocked. It won't allow you to stream if you're on a rooted device, so you'll either need to be on a non-rooted Android phone or use something like OTA RootKeeper (as described here and at your own discretion).

Another thing to note is that when you buy a DVD or Blu-Ray with Digital Copy/UltraViolet, you'll have to choose one or the other. You can't access both digital versions and you can only redeem the code once. Apple's Digital Copy is only usable via iTunes/iCloud which greatly limits the devices it can be used on. UltraViolet can be used on many more devices (including Apple products), therefore being more flexible and my suggestion.

Here is a screenshot of my Samsung Galaxy S3 playing the UltraViolet copy of "Dredd" (released today!) via Flixster. The performance has been perfect!

Get Notified of Google+ Posts Important to You!

Have you caught yourself logging on to Google+ only to notice a friend or business has posted something you would have otherwise completely missed?

Now you can stay on top of the posts from users of your choice by getting notifications from Google+. How? Well, it isn't the most straightforward option to get to via Google+, in fact I don't even know if you can. Instead, you have to access to settings for this directly at the URL below.

When I say you'll get notifications, I mean you not only get emails, but you also will get Android notifications on your Android smartphone. This is a nice touch.

Before you do this, be sure and create a circle like "VIP" or "Important" that you can use for receiving notifications of every post. You certainly want to be able to manage this before your email gets flooded uncontrollably.

All that being said, simply visit to turn notifications on for the Circle(s) of your choosing. Add me while you're at it ;-) +Robert Waddell