<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>I Am Awesome &#187; firefox</title>
	<atom:link href="http://iamawesome.net/tag/firefox/feed/" rel="self" type="application/rss+xml" />
	<link>http://iamawesome.net</link>
	<description>Pretending the Internet cares about me since 2009.</description>
	<lastBuildDate>Wed, 07 Jul 2010 17:08:02 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.8.4</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Clean Up Facebook (Duct Tape Pt. 2)</title>
		<link>http://iamawesome.net/2009/02/clean_up_facebook/</link>
		<comments>http://iamawesome.net/2009/02/clean_up_facebook/#comments</comments>
		<pubDate>Tue, 24 Feb 2009 16:30:08 +0000</pubDate>
		<dc:creator>conigs</dc:creator>
				<category><![CDATA[Rants]]></category>
		<category><![CDATA[adblock]]></category>
		<category><![CDATA[design]]></category>
		<category><![CDATA[facebook]]></category>
		<category><![CDATA[firefox]]></category>

		<guid isPermaLink="false">http://iamawesome.net/?p=190</guid>
		<description><![CDATA[So yesterday, I gave you a way to put duct tape over the sidebar in Facebook. But suppose you don&#8217;t want to go full-out like that. To be honest, I really don&#8217;t either. It was just a fun thing to do and I kept it up over the weekend… but what I really want to [...]]]></description>
			<content:encoded><![CDATA[<p>So yesterday, I gave you a way to put <a href="http://iamawesome.net/2009/02/facebook-duct-tape/">duct tape</a> over the sidebar in Facebook. But suppose you don&#8217;t want to go full-out like that. To be honest, I really don&#8217;t either. It was just a fun thing to do and I kept it up over the weekend… but what I really want to do is selectively hide certain elements.</p>
<h1>What I wanted to hide and why:</h1>
<ul>
<li>&#8220;People You May Know&#8221; — Lately, this has turned into &#8220;People you probably don&#8217;t know, but were have the same town and are 10-12 years younger than you!&#8221; and &#8220;People who live in the same city!&#8221;</li>
<li>Invite Friends — I&#8217;m not going to bug people to join Facebook.</li>
<li>Find Friends — I don&#8217;t want to import my IM and Gmail address book.</li>
<li>Maybe sponsors and ads? — This is really a maybe. At first, I really wanted to block them, but then ads for Threadless started showing up. For now, I&#8217;ve just taken to &#8220;thumbing down&#8221; ads that I have no interest in.</li>
</ul>
<p>When all was said and done, I had a <a href="http://iamawesome.net/wp-content/uploads/2009/02/fb-compare.jpg" rel="shadowbox[post-190];player=img;">much cleaner</a> interface:</p>
<p><a href="http://iamawesome.net/wp-content/uploads/2009/02/fb-compare.jpg" rel="shadowbox[post-190];player=img;"><img class="aligncenter size-medium wp-image-223" title="fb-compare" src="http://iamawesome.net/wp-content/uploads/2009/02/fb-compare-300x273.jpg" alt="fb-compare" width="300" height="273" /></a></p>
<h1>How I did it</h1>
<p>Since I already had <a href="https://addons.mozilla.org/en-US/firefox/addon/1865">Adblock</a> installed, I figured I would start there. The nice thing about Adblock now is that it can block based on CSS selectors. Now, you don&#8217;t need to know what that means, only how it works. In Facebook, for example, the &#8220;People You May Know&#8221; section is labeled as &#8220;pymk&#8221; in the source code (div.pymk) and the &#8220;Find Friends&#8221; is identified as, oddly enough, &#8220;findfriends&#8221; (div#findfriends)<sup>1</sup>.</p>
<p>You may be saying &#8220;so great, but how do how do I block them?&#8221; Well, here&#8217;s how: Open up your Adblock filters. Here&#8217;s what I currently use (which you can <a href="http://iamawesome.net/wp-content/uploads/2009/02/fb-clean.txt">download</a> as an Adblock Filterset, which also includes blocking the <a href="http://en.wikipedia.org/wiki/Beacon_(Facebook)">beacon</a>):</p>
<ul>
<li>##div.pymk</li>
<li>##div.invitefriends</li>
<li>##div#findfriends</li>
<li>##div.adcolumn (if you really want to block ads)</li>
<li>##div#home_sponsor (because most of the time, it&#8217;s just a Facebook ad)</li>
</ul>
<p>If there&#8217;s something else you want to block on the page, get ready to get your hands dirty. Goto View:Page Source, then do a search for the text in or near what you want to block. You should see something that looks like&lt;div id=&#8221;somethingorother&#8221;&gt;. Great, that &#8220;somethingorother&#8221; is what you need. Since this is an ID, we&#8217;d use this format in our filter: &#8220;##div#somethingorother&#8221;. If it was instead &lt;div class=&#8221;somethingorother&#8221;&gt; it would be &#8220;##div.somethingorother&#8221;.</p>
<p>But sometimes Facebook can try to confuse you.  For example, the &#8220;People you may know&#8221; section actually had two classes, &#8220;sidebar_item&#8221; and &#8220;pymk.&#8221; In this case, it was easy to figure out which one to use. (Had I used &#8220;sidebar_item,&#8221; I would have blocked other things, too.</p>
<p>Now, this might not be worth the hastle for you. That&#8217;s fine. There&#8217;s other ways. If you have the <a href="https://addons.mozilla.org/firefox/addon/2108">Stylish plugin</a> (mentioned yesterday) for Firefox, there&#8217;a a <a href="http://userstyles.org/styles/site/facebook.com">whole page</a> of easy-to-install scripts that can take care of some of this for you or even change the layout/style of Facebook. Just beware, many of those scrips are outdated and probably won&#8217;t work now. Though there is one that caught my eye: <a href="http://userstyles.org/styles/4205">Cleanup Facebook</a>. It might do too much for you though, it looks like it hides any non-default app boxes &amp; news feed items as well as ads.</p>
<ol class="footnotes"><li id="footnote_0_190" class="footnote">The reason the first uses a period and the second uses pound/hash is the first is a class and the second is an ID. This isn&#8217;t a technical write-up so I won&#8217;t go into too much detail about CSS other than that.</li></ol>]]></content:encoded>
			<wfw:commentRss>http://iamawesome.net/2009/02/clean_up_facebook/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Facebook Duct Tape</title>
		<link>http://iamawesome.net/2009/02/facebook-duct-tape/</link>
		<comments>http://iamawesome.net/2009/02/facebook-duct-tape/#comments</comments>
		<pubDate>Mon, 23 Feb 2009 17:04:43 +0000</pubDate>
		<dc:creator>conigs</dc:creator>
				<category><![CDATA[Creations]]></category>
		<category><![CDATA[duct tape]]></category>
		<category><![CDATA[facebook]]></category>
		<category><![CDATA[firefox]]></category>
		<category><![CDATA[youtube]]></category>

		<guid isPermaLink="false">http://iamawesome.net/?p=192</guid>
		<description><![CDATA[Facebook has officially updated it&#8217;s page. Facebook Duct Tape no longer works. If there is enough interest, I will write one for the new Facebook layout.
UPDATE 3 (03/04/2009): Facebook is updating their home page in the near future, though they don&#8217;t say when. I can almost guarantee that FB Duct Tape will no longer work [...]]]></description>
			<content:encoded><![CDATA[<p><strong>Facebook has officially updated it&#8217;s page. Facebook Duct Tape no longer works. If there is enough interest, I will write one for the new Facebook layout.<span id="more-192"></span></strong></p>
<p><em>UPDATE 3 (03/04/2009): <a href="http://iamawesome.net/2009/03/facebook-updating-home-page/">Facebook is updating their home page</a> in the near future, though they don&#8217;t say when. I can almost guarantee that FB Duct Tape will no longer work once the new home page goes live.</em></p>
<p>Have you seen this video on &#8220;The 25 things I hate about Facebook?&#8221; The important bit is at 2:54…<br />
<object width="425" height="264" data="http://www.youtube.com/v/PVA047JAQsk&amp;hl=en&amp;fs=1&amp;color1=0x3a3a3a&amp;color2=0x999999" type="application/x-shockwave-flash"><param name="allowFullScreen" value="true" /><param name="allowscriptaccess" value="always" /><param name="src" value="http://www.youtube.com/v/PVA047JAQsk&amp;hl=en&amp;fs=1&amp;color1=0x3a3a3a&amp;color2=0x999999" /><param name="allowfullscreen" value="true" /></object></p>
<p>After seeing that, I thought &#8220;It can be done.&#8221; <a href="http://iamawesome.net/wp-content/uploads/2009/02/fb-ducttape.jpg" rel="shadowbox[post-192];player=img;">So I did it</a>. This is not a Photoshop™. This is now what I see when I log in to Facebook:</p>
<p><a href="http://iamawesome.net/wp-content/uploads/2009/02/fb-ducttape.jpg" rel="shadowbox[post-192];player=img;"><img class="size-full wp-image-201 alignnone" title="fb-ducttape_th2" src="http://iamawesome.net/wp-content/uploads/2009/02/fb-ducttape_th2.jpg" alt="fb-ducttape_th2" width="344" height="197" /></a></p>
<p>How&#8217;d I do it? You&#8217;ll need the <a href="https://addons.mozilla.org/en-US/firefox/addon/2108">Stylish Firefox extension</a>, and <a href="http://userstyles.org/styles/15174">this script</a> I wrote. The huge chunk of characters is the image. That&#8217;s the only way I found to get Stylish to load a local image instead of using a server.</p>
<p>Now enjoy your still useless, but now duct-taped sidebar on Facebook..</p>
<p>(I&#8217;m fully aware this is just a simple CSS background image, and it&#8217;s entirely pointless, but so is Facebook. I just wanted to say &#8220;I <em>can</em> duct-tape over that crap in Facebook.&#8221;)</p>
<p>UPDATE: Script has been updated to duct tape over the ad-bar, too.</p>
<p>UPDATE 2: Even Julian loves the duct tape:</p>
<blockquote><p>Dude &#8211; hahaha YOU are my hero. That is incredible. Totally sending that to my facebook list.<br />
[...]<br />
&#8211;Julian</p></blockquote>
]]></content:encoded>
			<wfw:commentRss>http://iamawesome.net/2009/02/facebook-duct-tape/feed/</wfw:commentRss>
		<slash:comments>33</slash:comments>
		</item>
	</channel>
</rss>

<!-- Dynamic Page Served (once) in 0.637 seconds -->
