UserScript: Showing Page Titles & URLs in Google Analytics

Often, when you're using Google Analytics, you want to be able to segment by the page's title, but there is no default way to do this with Google Analytics.

Well, a couple of hours ago I started catching up on my reading in Google Reader, and I noticed a blog post from LunaMetrics titled "Showing Page Titles & URLs in Google Analytics", and that post pointed out exactly how to segment by page title.

So, I took a couple of minutes and wrote a userscript to add this dimension to the 'segment by' drop down with a userscript so that you can easily segment by page title, without having to think about how to do this. Here's the code:

This userscript is available on userscripts.org as well, here: Google Analytics Page Title Segmentation

Enjoy!

User Script Tip: Using jQuery

A very common question that I see asked on stackoverflow.com, the greasemonkey-users mailing list, and in #greasemonkey on freenode, is how to use third party libraries with a user script.

The common response is to use @require, but these days people want their user scripts to work on Google Chrome too, and unfortunately Google Chrome user scripts do not support a lot of the Greasemonkey metadata block, including @require.. so another method is required.

Cross Browser Solutions

Use script element & setTimeouts

One method that has been mentioned elsewhere is to create a script element and add it to the page, and use setTimeout's to wait until the third party js, in this example jQuery, is loaded. The example in the link I provided is for Greasemonkey, but with little effort it can be made to work with Google Chrome.

Use script element & associated onload event

This method creates script element for jQuery (or some other third party script), and appends it to the body element, and listens to the load event to figure out when the library is loaded and ready to be used.

Google Chrome does not allow user scripts to access javascript objects in the page scope from the user script's scope, so in order to use jQuery at all on Google Chrome you must load jQuery into the page scope and inject your script into the page scope. So this is what my example below does essentially, more specifically it stringifys a callback function which is called when jQuery is done loading.

Example

Easier GitHub Fork Switching

There are many issues I have with my favorite site to host git repositories, GitHub, but today I decided to solve one of them.

The Problem

When you are on a page in one of your project forks on GitHub for say some file in the repository, and you want to switch to see the same page for the project that you forked from, then you have a number of clicks and page loads ahead of you. My feeling is that there should be a single link that allows you to do this, and vice versa.

[More]

Building a Jetpack Package for Userscripts

Most members of the userscript community already know about Anthony Lieuallen's User Script Compiler, and Gina Trapani's Greasemonkey Multi Script Compiler (GMSC) which she based on Anthony's compiler. These two compilers allow a user script author to convert their userscript in to a Firefox extension, at which point the author can add functionality/features that Firefox extensions have, and usersripts do not have. So for example they can add UI elements to the browser that work with the userscript, or read+write files from the file system, etc..

I've used both compilers in the past and I find they are very handy, especially when you want to package disparate user scripts together in a single Firefox extension, or add functionality to a existing userscript, essentially upgrading the user script.

Now, around the time that the Jetpack SDK was released last month I started thinking about how the possibility of creating compilers similar to the ones above but for making Jetpacks that use userscripts. The other goal that immediately struck me was to make a userscript manager out of Jetpack, which is an idea I know others have been thinking about, at least Tim Smart expressed the same idea in the #greasemonkey irc channel not long ago.

Well, last week I was toying around with the idea of running a userscript within a Jetpack, and I had a lot of success, because within a few hours I was able to create a Jetpack which contained a collection of userscripts and it worked perfectly!

After I accomplished this, I started thinking about a road map for these ideas, so here it is..

Roadmap

Here are my goals for this project:

Complete the Userscript Package

This package has got to be dead simple to use, so that adding a userscript to a jetpack is as simple as dropping the userscript(s) in to the data folder of your jetpack, requiring the userscript package, and adding a line or two of code to your jetpack's main module which would make the jetpack aware that it has a userscript and act accordingly.

Furthermore, I want this package to be extendable so that third party's can create APIs that will be available in the userscript sandboxes. For example, a common question asked by new userscript authors is how to store data to disk in a file, which they quickly learn that they cannot do. But, when this package is complete their new option would be to write their userscript as they normally would, then if they come to the point where they want more API features than the GM_* API provides, then they will have the option to compile their userscript in to a jetpack, at which point they can start providing their userscript with more APIs that allow things such as storing data to a file on the file system.

Create a Userscript to Jetpack Compiler

This could be a website, command line package, or both, I don't really care at this point, but this must exist, and shouldn't be difficult once the Userscript package is complete. All that should be needed is a sparse Jetpack skeleton, which takes 1 or more userscripts and dumps them into the data folder, then creates a basic main module to run the userscripts.

Create a Jetpack to Manage Userscripts

Simply put this would be an alternative to Greasemonkey, maybe not quite as advanced as Greasemonkey, or with as nice a UI, but works and has all of the advantages of a Jetpack, namely you can install/update/remove without the need to restart, and takes advantage of the jetpack-core APIs which should mean that I won't have to worry as much about platform changes.

The Userscript Jetpack Package

I've posted the code I was working with last week in a git repo which is available on Github here. If you'd like to help out then fork this project and start hacking.

Example

If you would like to see the example I was working on last week, then it is available on Github as well here. This example is a remake of the BetterGWO Firefox addon that I created last year with Gina's GMSC.

Conclusion

If any of those goals sparked your interest then consider helping out, I would enjoy the company. Otherwise, I hope to have at least the userscript package mainly complete by the end of this month, so stay tuned.

Skip Validation Of A/B GWO Tests

If you're like me and you get sick and tired of validating GWO A/B tests that you setup then this userscript is for you.

The "Skip GWO A/B Validation" userscript will turn the step 3 "Preview and start experiment" text near the top of the page into a link which will take you directly to step 3 (which is preview & launch), allowing you to skip/bypass the validation step (which is step 2). This userscript also adds a "Skip" button near the bottom of the page between the "Back" and "Continue" buttons (the "Continue" is disabled until you have validated your code).

Screen Shots

Before

After

Goo.gl Now Open For General Use

Screen shot of Goo.gl fixed up with the userscript mentioned below

Three days ago Google announced it's release of Goo.gl a url shortener which is more reliable and trust worthy (to a user) than other services such as tinyurl.com, tr.im, bit.ly, etc.

Now I think all web publishers should maintain their own url shortener which only they can create urls for and control, for example I bought the domain evold.ca, and use the subdomain r.evold.ca as my url shortener. I primarily use this domain to shorten urls to my other domains, like erikvold.com, but I can and do occasionally use it to create short urls for domains that are not mine. As a user, when I see a blog post that I want to share, I first check if the publisher has published a short url for the page, which any smart web publisher does, but for the other web publishers (the majority atm) I have to create a short url, which I can now use Goo.gl to do.

The problem is that Goo.gl does not allow users to use it to shorten links directly. Currently, the Google URL Shortener is only officially available via the Google Toolbar and FeedBurner.

Well, I noticed that this problem was solved yesterday by a Google Chrome extension called goo.gl shortener. Amit Agarwal drew my attention to this extension in a blog post he wrote yesterday, where he pointed out the important javascript parts needed to create goo.gl short urls. So I took this information and opened Goo.gl up with a userscript, a ubiquity command, and a jetpack to help everyone create short urls with Goo.gl, check them out!

Would You Like To Know More?

This is just a last moment idea inspired by the movie Starship Troopers which flashed in to my mind a couple of days ago as I was thinking about Jetpacks for the Jetpack for Learning Design Challenge. It is primarily a Microformat/Link Type proposal for rel-info with some ideas and prototypes demonstrating how it could be used.

Abstract

When you are reading something on the web there are usually pages which exist elsewhere on the web that would provide background information, and further reading if you desired to dig deeper into the subject(s) you are reading about. Sometimes some of those pages are linked to from the article you are on, but often the link wouldn't make sense in the context of the content, and using a link tag isn't very useful to a user, so the link is not made.

I propose a rel-info link type, even if just as a Microformat, for 'a' and 'link' tags to provide a link to context-sensitive information.

With rel-info a user can read more about the Movie that was discussed at Netflix or IMDB easily for example, because the publisher (or a script the user subscribes to, more on this later) provided a rel-info link which the user can easily find and follow with a Jetpack, Firefox extension, or some other browser extension.

Proposal

When rel-info links are provided on a page browser extensions can easily extract them from the page, which can lead to a large number of use cases, of which I am sure I have only just scratched the surface. There is another side to this coin however which is that there are a large number of ways that rel-info links might be added to a page.

Let's explore the latter case, first the person who published the page could add rel-info links, but then browser extensions could add rel-info links, they could also search for and remove rel-info links. A user could subscribe to a person's or institution's suggestion feed or script which adds and/or removes rel-info links to pages, along with using a AI based browser extensions to add rel-info links.

When the rel-info links are going to be consumed there are some other interesting possibilities, for example a browser extension could filter the links by a HTML 5 'data-topic' attribute by keeping a list of topics that the user dislikes or likes, the domain could also be used for filtering. A browser extension could allow the user to mark pages as read so that they are removed from pages in the future as another example.

Prototypes

To test this link type out with a Jetpack I first had to add it to some pages, so I decided to write a couple of UserScripts to do this demonstrating how they can be dynamically added to pages by anyone even users themselves. The first userscript was to add the rel-info link type to IMDB links, and another to add the rel-info link type to Wikipedia links.

If you install the above UserScripts then you should find rel="info" or rel="... info" on your IMDB and Wikipedia links. Once you have done that you can check out and install the "Would You Like To Know More?" Jetpack. This is a slidebar Jetpack, and when you open this slidebar the focused tab is then scanned for rel-info links, if any are found then they are displayed in a list for you to choose from, if you click one of the provided links a new tab will be opened for the new page.

These UserScripts and the Jetpack take advantage of HTML 5 'data-' attributes, by adding a 'data-source' attribute to the rel-info links added on the userscript side, which the jetpack was written to check for and display if found. This is an example of how HTML 5 'data-' attributes can be used with the rel-info link type which I propose to create more interesting results.

The Daily UserScript: UserScripts.org Linkify Tag Clouds

This userscript will linkify some (maybe all) tags clouds on userscripts.org that are not already linkified.

The Unpleasantry:

The tag cloud on user profile pages is not linkified, meaning users have to manually search for the tag..

The Alleviation:

Once you install the "UserScripts.org Linkify Tag Clouds" UserScript the tag clouds on user profile pages will be linkified.

The Daily UserScript: Add The "I'm Feeling Lucky" Button To Google Searches

This userscript adds the "I'm Feeling Lucky" button to Google search result pages.

Once you install the "Add The "I'm Feeling Lucky" Button To Google Searches" UserScript then Google search results pages will have the "I'm Feeling Lucky" button.

The Daily UserScript: Stumble On Blank "I'm Feeling Lucky" Google Searches

If you leave the Google search field blank and hit the "I'm Feeling Lucky" then this userscript will have StumbleUpon send you to a random page.

Get the Stumble On Blank "I'm Feeling Lucky" Google Searches UserScript here.

More Entries

© Erik Vold 2007-2010. Contact Erik Vold. Top ^