I have a TV in my office that’s connected to a PC and generally does very little during the day. Since I’ve relaunched my site and starting to see some traffic, it’s great to watch the real-time statistics from Google Analytics while I’m working or writing. I have a nice Dashboard with all my important stats on it. But, all the junk that GA adds on the top and left of the page is really a waste of perfectly good space.

After a bit of searching, I found a few people who have done similar things with Bookmarklets, but they are woefully out of date. Using their work as a base, I decided to roll up my sleeves and fix it myself.

Below are the 2 Bookmarklets that I made to make my Dashboarding a lot easier. Feel free to use one or the other (or both). Let me know in the comments if they don’t work for you and maybe we can try and figure out why. It’s very possible that Google has changed the HTML again and it may require some tweaks. That being said, I use this myself, so I should know if it stops working.

Full Screen Dashboard

Create a new Bookmark. Give it a nice name so you can tell what it is. I call mine “GA Dashboard”. Then, set the code below as the URL:

Now when you’re on your Dashboard that you want to full screen, just click your Bookmarklet and all the Chrome around the page will be removed and it should be nice and clean. If you’re in Chrome, additionally hit F11 and the browser will go full screen as well.

Note: This will only work from a fresh tab. I’ve tried fixing it to work from another page by adding window.location.reload(); to the end of the script, but then it doesn’t work from a fresh tab. I’ll keep messing with it.

Dynamically Setting the Date Range

Then next thing I wanted to do was always show the last week of statistics, including today. If you select This Week, it will start from yesterday and not add today’s stats in. The only way I saw to do it the way I wanted was to dynamically generate the URL that had the date range I wanted in it. Another Bookmarklet to the rescue!

Log into Google Analytics and select the Dashboard you want to display. Give it a date range so you can visually see what part of the URL you need to cut and paste for the next step. The URL will look something like:

Notice the date range in the URL there. It’s the u.date00 through u.date01 section where they just put the start and end dates in YYYYMMDD format.

Create another Bookmark. I call mine “GA Dashboard”, but the name doesn’t matter. Copy the code below into the URL section. Then, take everything before the /%3F_u.date00 section of the URL and replace the section in the code below with that part of the URL. The -6 in the code represents the number of days back that you want to include in your range. If you’d like to make it something else (like -13 for two weeks), that’s the place to do it.

Voila! Click this Bookmarklet and your Dashboard will have the correct date range on it. Then, click your Fullscreen bookmarklet and all the junk around it will fall away. Then hit F11 and it’ll be a nice window ready for your beautiful graphs and stats to be viewed by the world (or at least the people in the room).

Ted Kulp

Ted Kulp is a professional developer, author and technologist with over 15 years of experience from the suburbs of Philadelphia. In 2004, he created the popular content management system, CMS Made Simple and continued to run the project for over 8 years. These days, he makes his living from writing Javascript full-time, writing books, and hacking on open source.

More Posts - Twitter - Facebook - LinkedIn - GitHub


Notice: mc4wp_form is deprecated since version Mailchimp for WordPress v3.0! Use mc4wp_show_form instead. in /var/www/html/wp-includes/functions.php on line 4440

Find this interesting?

Sign up for my newsletter for more interesting content.