Customize Google Reader’s Appearance with CSS

by Brandon on August 31, 2011

Google Reader

I use Google Reader to keep up with all my favourite websites and blogs. Since I am currently looking for a new job, I have also been using Google Reader as a job search tool.  Each day, several hundred new job listings pile up inside my job search folder. Sounds great, right? One problem: It can be quite strenuous on the eyes sifting through the entire list.

In order to relieve my eye strain, I decided to seek out a way to improve the appearance of Google Reader. I thought to myself, “What if every other entry had a light grey colour like you often see in data tables?”

Excel Data Table

After a quick Google search, I came back empty-handed. A few days later, however, I came across this article on advanced CSS3 techniques, and I decided to implement a solution myself.

Here’s a snapshot of the end result:

End Result

As you can see, I’ve made a few minor changes that I feel enhance the readability and functionality of Google Reader.

What you’ll need:

  1. A Google Chrome Extension to modify the site’s CSS.
  2. The code:

Install one of the extensions, then copy and paste the code in the relevant area.

For Minimalist Google Reader, it’s on the extension’s options screen as seen here:

MinGoogRead

For Stylebot, click the css button in the omnibar, then click the ‘Edit CSS’ button:

Stylebot

 

That’s it. Feel free to make any additional CSS changes you desire. If you have any questions, please leave a comment.

 

Leave a Comment

{ 1 trackback }

Previous post:

Next post: