Enhancing Your Portal
One of the best things to happen to the Internet in the last several years is RSS, Firefox, and extensions, and with the emergence of websites like NetVibes, it is now easier than ever to get all of your information in the same place.
The following will show you how to get the most out of your homepage or portal by using RSS, Netvibes, and a couple of firefox extensions.
I'll show you my homepage and what it does, tab by tab.
My General Page
Here I put all my high level stuff. The Google Search, My 30boxes events, MySpace profile, email, weather, Flickr contact photos, del.icio.us bookmarks, and interesting Digg stories.
All of this stuff is available through Netvibes modules, except for the 30Boxes embedding, which is used by a module called EmbedHTML or EmbedURL, available here. It's a very powerful module that lets you embed any URL in to your Netvibes page.
My RSS Page
This page is pretty basic. Just a bunch of RSS feeds that I have organized.
My Friends Page
This page is also straight RSS. Friends blogs, del.icio.us links, and etc are here, so I can see what my friends are writing about or find interesting.
My Tools Page
Ahh, this is the good stuff. As you can see, I've used EmbedHTML again to put Meebo and DiggSpy in to my Netvibes page. What's nice with Netvibes is, as a travel from tab-to-tab, it doesn't lose the state of things that are going on in my other tabs, so chats I have going on in Meebo wont be affected by my going back to RSS to view recent news stories and etc.
DiggSpy has been altered from its usual look by using a Firefox extension called Stylish. It's a very powerful extension that lets you modify any page's CSS by adding your own rules. You have unlimited capability to tweak pages to your desire. I use it in tandem with another extension called the Web Developer Toolbar. There's an option under the "information" toolbar icon that lets you display element information. This will show you class names of certain elements on the page that you want to hide, change the color of, etc.
Check out the following image. It's me, on DiggSpy, with the web developer toolbar and element information turned ON. I then hover my mouse over the element I want to remove.
As you can see, the arrow is pointing to the name of the class of the element I want to remove. In this case, the class name is ".extra-nav"
I should mention that it takes a fair amount of HTML experience to really do this effectively, but you can learn by doing a couple tutorials online.
Once I have the class name, I load up Stylish's configuration window...
The code "@-moz-document url-prefix(http://www.digg.com/spy) {" sets a scope for the css rule that you're making. If you didn't do this, I think it'd apply the rule to every webpage. I created the rule by clicking on Insert -> Site Rules -> and then just checking "Starts with" and entering "http://www.digg.com/spy" and then clicking OK.
Then I just plug in the CSS for the element name that I got a bit earlier, turning the display to none. I find it helps to stick "!important" at the end so that it overwrites any inline rules that the site might have on the elements in their page.
That's it! I hope you found this informative.
