This plugin is for everyone who want to analyse his visitors with Google Analytics. This plugin replaces the usual use of the tracking code but it can also work together with it. Only with this plugin it's easier for everyone to track pageviews or even actions and events such as clicking on a button. (read more about Google Analytics Event tracking)
To use the Google Analytics plugin, you have to include the jQuery library in your <head> tag of your HTML document:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
For the plugin you have the choice, you can include it in the <head> or just above the closing <body>-tag. When you put it in the <head> you can call the plugin from everywhere in your HTML-file. On the other hand: inline javascript is bad so use an external javascript-file to call the plugin.
In my examples I have the separate file in mind. So add the end of your HTML-document you should have something like this:
<script type="text/javascript" src="/js/jquery.glam.ga.js"></script>
<script type="text/javascript" src="/js/general.js"></script>
</body>
</html>
We will use the general.js-file for the specefic jQuery-code to call our plugin.
$(document).ready(function(){
$.glamGA('UA-*******-*'); //replace 'UA-*******-*' with your specefic UA-code
});
Yes, it's so simple! The code above is pretty the same as this:
$(document).ready(function(){
$.glamGA('UA-*******-*', {
debug: false,
localhost: false,
localextension: ['dev','stag'],
trackPage: true,
trackLinks: true,
trackMails: true,
trackFiles: true,
categoryLinks: 'External',
categoryMails: 'Email',
categoryFiles: 'Download',
titleLinks: true,
filetypes: ['pdf','doc','xls','csv','jpg', 'mp3', 'rar','txt','ppt','zip','dmg','xml','exe','air']
});
});
The above example is the basic use of the plugin with all his default preferences. You can change them for customize the plugin, but a little explanation is in his place here. First of all, for tracking an event this is the Google Analytics Code:
_trackEvent(category, action, optional_label, optional_value)
Where:
- category: the name you supply for the group of objects you want to track
- action: a string that is uniquely paired with each category, and commonly used to define the type of user interaction for the web project
- label: an optional string to provide additional dimensions to the event data
- value: an optional integer that you can use to provide numerical data about the user event
(source: Google)
These parameters from trackEvent you can find also in the default prefereces (categoryLinks, categoryMails, categoryFiles and titleLinks):
- debug: when true, it will output informational console logs (firebug) or alerts
- localhost: when true, it will be available (and tracking) when developing on the localhost too
- localextension: default is this an array with 'dev' and 'stag' so you can use an URL like http://website.dev instead or http://localhost/. Using is a single string is still possible
- trackPage: when true, the basic pageview tracking is enabled
- trackLinks: when true, it will tracking all external links as events with label 'Visit'
- trackMails: when true, it will tracking all
mailto:-links as events with - trackFiles: when true, it will tracking all links to files with an extension in the array you provide in the settings parameter filetypes.
- categoryLinks: this 'label' is the 'category' for tracking events for external links
- categoryMails: this 'label' is the 'category' for tracking events for
mailto:-links - categoryFiles: this 'label' is the 'category' for tracking events for file-links
- titleLinks: when true, it will use the
titleattribute from the link as optional_label when it's filled in. Otherwise it will use thehrefattribute. - filetypes: this is an array of all extensions that this plugin has to track
It's also possible to call the plugin for one specific need, like tracking a special action or something else without the need of track all the other stuff.
$.glamGA.customTrack('UA-*******-*', {
type: 'event',
category: 'Action',
action: 'Register',
label: 'Member'
});
In the example above, the setting are necessary to set for a custom _trackEvent. For the basic use for a _trackPageview you can do someting like this:
$.glamGA.customTrack('UA-*******-*', {
type: 'view',
url: '/AJAX/example'
});
There are a little more options for both of them:
- debug: when true, it will output informational console logs (firebug) or alerts
- localhost: when true, it will be available (and tracking) when developing on the localhost too
- localextension: default is this an array with 'dev' and 'stag' so you can use an URL like http://website.dev instead or http://localhost/. Using is a single string is still possible
- type: 'event' or 'view': 'event' is for
_trackEventand 'view' for_trackPageview - url: only necessary when type is 'view': this 'url' will then be tracked as a pageview
- category: category for the
_trackEvent - action: action for the
_trackEvent - label: label for the
_trackEvent
Maybe you prefer to do some cool jQuery scripting to call the plugin.
$('a.coolstuff').glamGA('UA-*******-*', settings);
All the settings from the custom call you can use here. Just one is extra setting is necessary so the plugin can do his work.
You have to provide an extra setting event. Default is this click.
If you find one, please inform us with the issue tracker on github.
0.8.3 - 27/09/2010
- Changed the way localextension works. It's now an array ['dev','stag'] but for backward compatibility passing a string is just fine.
0.8.2 - 08/06/2010
- Refactor some code for a better performance.
0.8.1 - 08/04/2010
- Clean-up + minified version
0.8.0 - 08/04/2010
- [bug] Closes some little bugs
- [feature] Possibility to use custom URL instead of http://localhost/ by adding different extension
- [improvement] Delete logging. Still available by loading the jQuery-Utilities class before this class
0.7.1 - 22/01/2010
- [bug] Closes #1: Error with links without a 'href' attribute
0.7 - 16/11/2009
- Addes 2 semicolons add the ends of the functions
0.5
- This is the first version of the plugin but not bullet-proof so not a 1.0 release for now...
- More inline documentation
- Examples and demo's
If you want something to add on this plugin, feel free to fork the project on github or add an issue as a feature request.
This plugin has a BSD License. You can find the license in license.txt that is included with plugin-package