UPDATE: Current version of Explainum has more simple process of chart creation and more secure authorization for Google Analytics, so some forms may look differently. Also, now you can create new series
in one click.
Two days ago I wrote about
what's missing in Google Analytics charts. In this post I will show how to build chart with Google Analytics stats using
Explainum and add it to your website. The result will look like this chart below (it's interactive -- try clicking comments, selecting areas on chart, zooming, scrolling, etc.; see
help for more):
So, how to get the same? Briefly, you should do the following:
- Go to explainum.com, create chart and launch Add Series wizard
- Choose Google Analytics as data source, enter Google Analytics credentials, select GA metrics and historical time interval to load (if you want to have history as well)
- Fetch and preview data, save series
- Embed widget into your website (if you need to)
Let's go through the process step by step.
Sign in, create chart and launch wizard for adding series
First, log in to
Explainum and create a blank chart. Then go to Series tab, press the button "Add series" to launch wizard and select Google Analytics from the list of data sources.
Provide your Google Analytics credentials (wizard's step 1)
Then, provide your credential for Google Analytics account and profileID. Please note that currently these credentials will be sent once using non-secure connection. If this makes you feel discomfort about privacy please use credentials for GA guest account. We're working over using OAuth for authorization by Google API and going to roll it out in a few weeks.
Please note that GA profile ID
does not contain any symbols like "UA-". If you don't know your profile ID then go to your Google Analytics Settings page and click the link "Analytics Settings" (see
how to get ProfileID in the new GA user interface):
Then press Edit...
... and get your ProfileID number.
Select metrics and time interval (wizard's step 2)
If you're done with GA credentials, press Connect. When you moved to step 2:
- select metrics (visitors, pageviews etc.),
- choose start date of historical time interval to load (e.g. since 1-Jan-2011),
- make sure checkbox Autoupdate is checked (for recurring daily updates),
- press Fetch data to load data from Google Analytics and move to step 3.
When choosing dates use calendar, which can be invoked by pressing calendar button nearby date field.
Preview data and save new series (wizard's step 3)
On step 3 you can preview a sample from loaded stats just to make sure that data was loaded correctly. If everything is OK -- press Save series and finish.
If something went wrong -- correct your settings for Step 1 and press Connect again, or settings for Step 2 and press Fetch data again. We tested this wizard many times, so if you entered correct parameters everything should work smoothly. If you still experience problems -- feel free to send us email to support(a)explainum.com with description of problem.
Embed graph with Google Analytics stats into your website
Final step -- press Get HTML button on the chart, get HTML snippet and insert it into your web-page. The snippet should look like this one:
<script type="text/javascript">
//<![CDATA[
explainum_chart_id = 38;
explainum_widget_width = 500;
explainum_widget_height = 350;
//]]></script>
<script type="text/javascript" src="http://explainum.com/scripts/loader.js"></script>
As result, you will get interactive widget similar to the one on top of this post. Look in
Explainum Wiki for more details about widget -- about navigation, selection, commenting etc. Feel free to ask questions either here in comments or send them to support(a)explainum.com.
PS. Dimensions and filters in GA currently are not supported.
UPDATE! Filters and dimensions now are
supported!