LAB 13

Google Analytics and Google Apps Script - OMIS 675

Lab Objective: Using Google Analytics you will integrate website tracking into your website as well as create a page in your site that will display your traffic in a visual format. Due 4/23

Google Docs Version

Add Google Analytics to your website
1. Login to your GMAIL acct. (either student or personal is fine)
2. Once logged in, visit Analytics.Google.Com from the same browser
3. Create a new Analytics account if you don’t already have one.
4. Give the Account and Website a name
5. Paste your website URL into the Website Name field
6. Complete the rest of the information

Select Get Tracking ID
Copy the tracking code to your clipboard
Login to your Azure VM, open your OMIS 675 website.
Open your MasterPage (should be site.master)
In the Source view, paste the code between the closing </head> tag and the opening <body> tag

Save. This will ensure that every page in your site that uses the Master page, which should be all, will get tracked by Google Analytics.
Open your website in a browser on your laptop (not the VM).
Simultaneously open your Website Data in Google Analytics
Select Real-Time > Overview from the left pane. You should see one visitor. That’s you.

Use Google Apps Script to create an Analytics dashboard into your site.

Adapted from this video (please consult video for any questions) https://developers.google.com/analytics/solutions/report-automation-magic

While logged into your GMAIL account (student or personal)
Open http://drive.gooogle.com
Create a new Spreadsheet, name it ‘Analytics Dashboard’
Select Tools > Script Gallery... Search for "Google Analytics Report" (include quote

Install the Google Analytics Report Automation (magic) script
Click Continue to Authorize
Accept
Close
Tools > Script Editor
Resources > Use Google APIs

Select OK
Go back into Resources > Use Google APIs
Select Google APIs Console link at the bottom of the screen
Turn on the Analytics API

Select the < Google Analytics R… to go back a screen

p. Select Create Project. (keep the randomly generated Project-ID

Select Create
Back in your Spreadsheet tab, refresh the browser
After a few seconds you’ll see a new menu appear called ‘Google Analytics’
Select Google Analytics > Create Core Report > OK > Accept.
Should see some cells auto populate

Select Google Analytics > Find profile/ids, copy the ids value to your clipboard

Close
Back in the spreadsheet, paste the ids ga number in column B, row 3.

Fill in the remaining information shown in the graphic below (last-n-days, metrics, dimensions, sheet-name)

Select Google Analytics > Get Data
Hopefully you are seeing a Success message.

Close the Report Status message, and give it a few minutes to pull in the data. If it’s taking a long time, refresh the browser
You should now have a tab called Visitors Report, filled with information about your website visits.
Select the data, then select Insert > Chart. Change to a Trend style

Select Insert

Use Google Apps Script to display a Google Analytics chart showing top pageviews.
Select your gaConfig tab in the spreadsheet

Select Google Analytics > Create Core Report
Copy/Paste your ga id from the original ids cell to the new one

Enter the following data

Select Google Analytics > Get Data
Close the status message
You might have to refresh to see the new PageViews Report tab.
Visit the PageViews Report tab.
Select the data, then Insert > Chart > More > More > Table Chart.

Insert

Setup Google Apps Script Triggers to automate pulling data from Google Analytics
1. In your Google Spreadsheet, select Tools > Script Editor
2. Select Resources > All your Triggers. (Triggers allow you to automate scripts)
3. Select Add a new trigger
4. Change the first dropdownlist to getData
5. Change the second dropdownllist to Time-Driven
6. The next two dropdownlist should have Hour timer/Every hour selected.

Click Save
Close the Script Editor

Create the Dashboard
1. Modify the spreadsheet sharing settings make it Public on the Web, Save, Done.

Back in your website, Create a new page called Site.aspx (select your site.master page)
Add a 2 x 2 table to the MainContent section
Type Visitors Trend in the first cell, and PageViews in the upper right cell.

Back in your Google Spreadsheet, select the chart from your Visitors Report tab.
Select File > Publish to the Web > Close
Select the dropdown arrow, then select Publish chart.

Select the code, copy to clipboard
Return to Visual Studio, put your cursor in the lower left cell and select the Source View
Paste the script code into the html

Save
Repeat for the Pageviews chart. Save
Visit your site from a browser that you’re not logged into GMAIL with to ensure your sharing/publishing setting are valid since I will be visiting as a guest.
Should look something like this http://omisapps.niu.edu/omis675/site.ASPX

Google Sites

Report abuse