Nov
10
I think everyone has a list of FF applets they recommend. These 6 I would not live without.
1. Plain Text Copy
Allows you to copy just the text from the highlighted selection without any embedded html. Let me say that again: You can copy the text without copying the html code that will screw up the formatting in whatever you’re pasting to. No more weird tables, h1, or links.
Just clean copy, just like the name says. This applet is the reason I wrote this article. When I found this today and I almost started to cry. Do yourself a favor and get it here before even moving on to the rest of the list
If you really like this then you might want to check out Pure Text 2.0, which strips the HTML from any copy and paste function you do on your computer. (Think about not using Word to Notepad to Blogging software)
2. SEO QUAKE
A browser bar that gives you tons of information about the current page. You get Alexa & Google PR and inbound yahoo links on one side, Keyword density and whois info on the other at the click of a button. Awesome.
There is an option to also have the information appear on screen. Generally I have this turned off as it slows page load time but it does provide additional information and PR info for each link on the page.
3. Stumble Upon
Whats not to love about this program? Sure, its a time waster – but depending on how you set it up you’ll find some of the most interesting (and sometimes relevant) tid-bits of information on the web. Click a small button on your task bar to be taken to content other users have previously tagged as worth stumbling on or add your own sites to the growing list. The more people that stumble to your content and give it a thumbs up – the more it will circulate.
I don’t even remember how Firefox did with downloads before, but I LOVE how it handles them with this add on installed. Downloads appear at the bottom of the browser window and track the percent complete. Once downloaded you can open the file, the container directory, or clear the item from the list. Otherwise you can continue to access the file in following sessions, and files even continue to download from one session to the next if they did not finish.
5. PDF Download
Simple popup that allows firefox to open a PDF directly from the website, without having to download it first. This might not seem like much, but I get sent a lot of pdfs and this is a handy way to check the file out quickly and then decide where to save it. Its a better order of opperations for me – I dont know what Id do without it.
6. Web Devlopers Toolbar – A few tips I’ve learned
Everyone has the WebDev toolbar on their “must have” lists. What they dont have are these tips:
* Press Alt-E to open the CSS of any page. You can edit it here on the fly and it will render as newly written in the content area above. Once you’re done with it you can save the CSS file locally and then open the page with dreamweaver.
Vuala! CSS is done. (For FF – make sure to test in IE & good luck with that!)
* You can edit the HTML of any page by going to Miscellaneous drop down menu. Why these two are not closer together I don’t know, but they appear as a tabbed interface at the bottom of the browser. Very handy to have them both open when you’re trying to do build outs. Doesn’t auto complete like dreamweaver, not for the novice.
* Stick and Unstick – Once you have written your code you can “stick” it. Normally if the CSS of a page chages so does the code you can edit. If you make changes and the page refreshes or reloads, your code is lost. This prevents that and you can refresh the css to reload the content from the current page.
* Press Ctrl Shift F to open the Element Info panel. This thing rules. Not only does it tell you the type, class and id of the element you select, it also tell you the width and height, plus parent and child elements. This is hugely useful for trying to decode the miles of css rules accompanying most wordpress, sharepoint, or similar template driven services. There is a window which displays the css path to get to an element. If you copy and paste this line into your CSS file you WILL select that element. Trouble is: The only way you can copy it is to get to field without overlapping any other elements. On a mac you can use spaces to trick the mac into letting you move screens and come back with your cursor near the top. Coming down from the top allows you get to copy the text without rolling over another element and resetting this field. PC users can use another window over the content (or alt-crt-delete – not kidding you) to move over inactive content and selected the text.
Why is this useful:
Say you wanted to select a specific link in your WP template and dont have a clue how the author wrote the template, you can either spend an hour going back and forth trying to find the rule for comment h2 links from new users alternating between even and odd posts OR look at the string:
html > body > div #frame > div #container > div #content > div .left_side > div .entry > div #end > ul .related > li > a
which becomes:
html body div#frame div#container div#content div.left_side div.entry div#end ul.related li a
and now it targets that element exactly. You can slim it down and it should still work fine. Too far though and you’ll start selecting other elements, which may or may not be your intent.
Good luck with these tips.
Hope they save you some time and aggravation.
Thanks going to Porto, that last bit was almost all you.
![[Post to Twitter]](http://blog.hattersworkshop.com/wp-content/plugins/tweet-this/icons/tt-twitter.png){kind=icon}
