(or how to use Firefox web developer to impress your wife )

Looks like Friendster is suffering from some kind of CSS attack.
So, if your Friendster profile page is showing up a blank page, go to this link – Friendster Hacked and follow the instructions there to fix it.

Now on to how Chris Pederick’s Web developer made me look like a hero (at least in my wife’s eyes) :-

Wifey comes home and tells me her Friendster site is not working. Being the good samaritan that I am, I immediately open up my browser to have a look. The page shows up all blank, so of course the first thing I do is View – Source.
All the page data is there in the source, it just isn’t showing up.
Hmmm…time to download and install Web Develoer and Firebug in her browser. That done the following few steps led to resolution of the problem :-

Using Web Developer extension -
1. Try Disable -> Javascript – no effect
2. Try CSS -> Disable Styles -> All Styles – Cool! The page shows up without all styles; time to narrow it down
3. Try CSS -> Disable Styles -> Embedded Styles – The page shows up
(CSS -> Disable Styles -> Inline Styles has no effect, so the problem is in an embedded style)
4. Do CSS -> View CSS – All the different styles are listed in a new tab. Luckily there are only two embedded styles, and one of them immediately seems like the problem -

Embedded Styles from http://www.friendster.com/user.php?uid=XYZ
body {background-color:#ffffff;
background-attachment:fixed}
.commonbox h2 {background-color:transparent; color:#ffffff}
.commonbox {border-color:transparent}

div{display:none}


Back to View – Source, and a search for div{display:none} brings up the offending code -

Ha! I actually LOL when I saw this.
It was easy to fix this after getting so far. Go to the Profile page, bring up the edit box for the shout out. For my wife’s account, it came up as this -

Remove, reset and save, and the profile was back to the way it was.

After fixing it, I google for friendster hacked, and one of the first few links is the one mentioned above.
Darn! Could just have googled first, but then I would have missed out on having all this fun, and my wife wouldn’t have been as impressed he he.

BTW, anybody at Friendster looking for an exceptional software developer?

P.S. If you use Firefox, go get the web developer extension. It is priceless for the web developers and the power users alike.

Adding a key to a blog post is easy enough, but the free wordpress.com account does not allow you to edit your template. No problem…just add a text widget to your blog and add the second key there.

BTW, when adding the first key in a blog post, I was only able to get it to work by including it using the code tags.

(Suggested by Jack Whitsitt, via Wordpress forums. Thanks, Jack.)

Recently, I decided to try out Flock for a few days, and the script didn’t work with it.

Thanks to Dive Into Greasemonkey, here is a quick fix.

This part of the script fails when running on Flock browser -

//to prevent submit to stupid site which put fake login / pass value
if (thisElement.value != thisElement.defaultValue) {
passfield = true;
thisElement.addEventListener(’keypress’, al_KeyPress, true);
}

For some reason, thisElement.value is always empty on Flock. On Firefox, it shows the actual value of the field.
Anyway, since I only use this script to login into a particular web page, I removed that if condition, and it works fine.