How to install a Chrome extension from GitHub

I recently had a web page with a long list of Twitter names that were not linked, like @mattcutts. I thought that someone has to have made a Chrome extension that would “linkify” names so they would be clickable like @mattcutts. And with a little bit of searching, I found twlinkfy.

It looked like a great extension, but Chrome (at least in Windows) can only install Chrome extensions from the Chrome Web Store in order to protect against malware.

So how would you go from source code on GitHub to an installed Chrome extension? Here’s how I did it: download the extension as a .zip by looking for the “Download ZIP” button on the right-hand side of the project page on GitHub. Now extract/unzip the code somewhere. Then in Chrome go to Menu (the three lines)->More tools->Extensions. Click the “Developer mode” checkbox and then click the button labeled “Load unpacked extension…”.

Now navigate in the resulting file dialog box until you are in the directory with a manifest.json file. For me, it was in the twlinkfy-master/ext directory. And that’s it! The extension loaded, and when I loaded the page with a long list of @names as text, they turned into clickable links.

You can even modify the local source code and reinstall or reload the extension. For example, I changed line 10 of twlinkfy.js to point to a different destination page on Twitter for links. I uninstalled and re-installed the extension and then the links went to a different page on Twitter.

As always, be careful of extensions/code that you install in case someone is attempting something malicious.

Getting things done with Google Tasks

Someone recently asked me how I manage my to-do list, so I thought I’d write up the software that I use. Fundamentally I use Google Tasks as the backend, but with extensions and apps that improve on the basic functionality in Google Tasks.

Chrome

I use a couple different extensions for Chrome:
Better Google Tasks is a great Chrome extension. Just click a button in Chrome and you have instant access to all your todo items. I like the extension so much that I donated some money to the author, Chris Wiegman. You can get the Better Google Tasks extension from the Chrome Store.

– I also noticed that on the New Tab page of Chrome, seeing thumbnails of my most visited sites (Techmeme, Hacker News, Nuzzel, Google News, etc.) every time I opened a new tab inevitably led me to click over to those sites. The result? I was wasting more time surfing than I wanted. The solution is a great Chrome extension called New Tab to Tasks. It changes Chrome’s new tab page to be your todo list. That way, I get a nice little signal every time I open a tab: “Hey, remember that you’re supposed to be working on stuff, not goofing off.” Thanks to Scott Graham for writing this Chrome extension.

Oh, and one last Chrome recommendation: if you don’t want *any* distractions on Chrome’s new tab page, consider installing Empty New Tab Page, which makes the Chrome new tab page completely blank.

Android

For Android, I use an app called Tasks. It costs $0.99, but there’s also a free version that starts showing ads after 10 days. I like the Tasks app for Android because it syncs with Google Tasks, has nice widgets, you can easily move tasks up and down, and you can indent tasks underneath each other. I only keep a few todo lists (Home, Work, Grocery, etc.), and to switch between lists you just swipe left or right. Tasks works great for me, but if you have tons of different todo lists then swiping between those lists might get old.

I can already imagine someone asking “Okay, but what about Google Keep?” I’m not opposed to Google Keep, but at this point I’ve found various third-party solutions that interoperate with Google Tasks and work well for me on Chrome and Android. Plus I already have my data in Google Tasks, so for the time being I like these solutions for Google Tasks.

Google Chrome Tips

I started this blog post of Chrome tips in 2008. Even though this is a “hairball” post, some of these tips still work.

– control-shift-V will paste your selection as plain text

– control-shift-T will re-open the last tab you closed. You can repeat that to keep re-opening previously closed tabs.

– Hover over a tab to see the title for that page.

– shift-escape to bring up the Chrome process manager

– switch your default search engine: right-click in the Omnibox and select “Edit search engines…” . Select a search engine and click “Make Default”

– Chrome’s user-agent looks like “Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US) AppleWebKit/525.13 (KHTML, like Gecko) Chrome/0.2.149.24 Safari/525.13″

– Click on a tab and drag it to reorder tabs. To move the tab to a new window, click on the tab and drag it away from the tab bar until a “ghost image” of the tab appears.

– Use control-tab and control-shift-tab to shift your tab focus

– The address bar (referred to as an “Omnibox”) in Google Chrome is very smart. You can use it to type urls or to run searches. Once you type a space after a word, the browser will assume that you want to run a search. Once you type a ‘/’, the browser will assume that you want to navigate to a url.

– Here’s another omnibox trick. Visit Amazon.com and do a search for anything (say, Terry Pratchett). Your browser will see that you did a search and will learn that it can search amazon. Now start typing in the omnibox until “amazon.com” is offered as a suggestion, and then hit tab. You will be offered the ability to search directly on Amazon for what you want. So you could type “am” to bring up the “amazon.com” suggestion, then hit tab and Chrome will say “Search amazon.com:” then if you type “Little Brother” and hit return, you’ll be taken directly to Amazon’s search results for Little Brother.

– On Firefox, you’d use control-l to move the focus to the address bar and control-k to move the focus to the search box. Both shortcuts work on Google Chrome. Note that control-k adds a ‘?’ to the beginning of the address bar/omnibox, which is a shorthand way to write “Do a search.” So entering “?tax codes” would do a search for [tax codes]. After you get the hang of the omnibox, you’ll find yourself just typing searches and hitting enter, because you don’t really need the ‘?’ in front.

– Toggle the display of a bookmark bar on and off with control-shift-B. Even if the bookmark bar is off, it will conveniently appear for you on the “New Tab” window.

– Google Chrome doesn’t offer Google Bookmarks functionality, but if you want to use Google Bookmarks with your browser, you can visit google.com/bookmarks and there’s a bookmarklet at the bottom of the page that you can drag up to your bookmarks bar.

– If you delete a tab by accident, open up a new tab with control-t. In the bottom right is a section called “Recently closed tabs” where you can retrieve a tab. That section only lists three recently closed tabs though. You can re-open up to 10 closed tabs with control-shift-T.

– To maximize the Google Chrome window, you can double-click in any unused/blank part of the tab strip

– An Incognito window isn’t just useful for buying gifts or private porn surfing. If you have two different Google Accounts (maybe a work account and a personal account), you can use Incognito mode to keep two browser windows open and the two windows can each use a different Google Account. Open an Incognito window with ctrl-shift-N.

– control-h will open a history window so that you can search over your browser history

– To help prevent phishing, Google Chrome will bold the hostname of the url in the address bar.

– Attach a file in Gmail with simple drag-and-drop.

– Google Chrome has some neat internal pages that you can access. In the address bar, try entering “about:memory” to get a great breakdown of Chrome’s memory statistics. Enter “about:version” to get version information about Google Chrome. Enter “about:dns” to see the time you’ve saved with DNS prefetching. Enter “about:plugins” to find out more about your browser’s plugins. And “about:stats” shows all kinds of information.

Have you tried Chrome?

If you haven’t tried Chrome recently, you might want to give it a try. PC World recently picked Google Chrome as its top recommended browser. They said that Chrome had the best interface, best security, and best speed. (Firefox took top honors in the other category, best extensions.)

Jeff Atwood recently wrote that

Chrome was a completely respectable browser in V1 and V2. The entire project has moved forward so fast that it now is, at least in my humble opinion, the best browser on the planet. Google went from nothing, no web browser at all, to best-of-breed in under two years.

[I think someone else–Maximum PC?–also recently named Chrome their top browser. I’m on a plane now, but I’ll try to add the other reference if I find it when I get home.]

Linux Format also recently reviewed eight different web browsers for Linux. They gave Chrome a 10/10 and concluded:

The outright winner has to be Chrome. Not only did it blitz everything else in the speed tests, but it holds up in the compatibility stakes too. Although we were amazed by the speed of Chrome, we shouldn’t forget the wonderful array of developer tools that are also embedded.

Looking at the analytics for my blog, about 22% of you use Chrome. So for the other 78% of you, what’s keeping you on another browser?

P.S. Here’s a pro tip: you can use Chrome in four different levels of bleeding edge: stable, beta, developer (also known as “dev”) and canary. I prefer the dev version myself, because you get access to great features early, but it’s still been very stable for me. Here’s how you can download and install the dev version of Chrome. Or if you want something rock-solid, you can download that too.

Switching between dev and beta Chrome channels on Linux

If you’re on Linux (say Ubuntu 10.04, also known as Lucid Lynx), you can switch between the developer (dev) and beta channels of Chrome like this:

Switch from Beta to Dev:
sudo apt-get install google-chrome-unstable

Switch from Dev to Beta:
sudo apt-get install google-chrome-beta

That’s easier for me than going back for the .deb file and doing something with it.

Also, if you want to check whether a new dev version of Chrome is out, you can just repeat the same command:
sudo apt-get install google-chrome-unstable

and if there’s no new version, you’ll get something like this back:

Reading package lists… Done
Building dependency tree
Reading state information… Done
google-chrome-unstable is already the newest version.
0 upgraded, 0 newly installed, 0 to remove and 0 not upgraded.

I figured I’d document this in case I needed to remember how to do it in the future. :)

css.php