Apr
4th
Play with Socialgo Guts with Firefox Plugs
By ezra vancil
If you have not seen this plug in prepare to drop your jaw. Ok, in
the screen shots it doesn't look like much. You have to see it in
action. I will be returning to podcasting this week and will
feature this plug in on a episode.
View Source Chart
Yes it is a terrible name. View Source chart allows you to view Socialgo's or any web sites code structure in a beautifully simple way. I come to this plugin allot more than dreamweaver or other code editors, especially when I just want to get a handle on what's going on with the site structure in whole or just one element. See what makes this so cool is the collapsable tags. Each element or tag is color coded in a box, and you can collapse any tag or element in the site. This makes for easy study of a site. I used this allot when creating the drop down menu style categories on this blog page. Dreamweaver does this collapsing also and also has a tool for auto finding the end of a tag... But, as with many things with DW, it doesn't work well, sometimes not at all.Bad News
The bad news is it only works in Firefox 2.0. this is not really a problem for those on the Mac because you can download older versions and run both of them 2.0 and 3.0. For PC?? I don't think so, but let me know if I'm wrong. So it's time to switch to mac.
Jan
24th
5 CSS Hammers for 5 Jobs
By ezra vancil
If your like me you have a mound of tools in your garage but know
where everyone is and the reason you bought each one. My wife asks
why i need another hammer when i have four in the garage, well, of
course, it's because one is a tacker, another a roofer, a decker
and a nut scratcher. Duh! I'm the same way with CSS inspectors, I
have a bunch and they all help me in different ways and in
different circumstances, and, of course they are all firefox
plugins.
Firebug
This is my big ass deck hammer... You probably have heard of this one or have it. In it's most basic use, it allows you to analyze visually the html next to the CSS. f I use this allot when I can't seem to find a sneaky attribute or tag in dreamweaver or cssEdit. for some reason I always find it with this little bug. It does allot more too, like inspecting DOM, which has helped me a ton lately on finding how a certain effect is constructed on a site. But, overwhelmingly I use it at the very end of designing my network. After I've carefully coded my page design in a css editor I plop it in socialgo and low and behold my footer is shooting off 20 miles to the west. This is usually because I deleted a CSS declaration instead of replacing it, and now the socialgo template is trumping my selector. So, I pull it up in firefox, find the offending selector and fix it right there, copy and paste it into my CSS. (IMPORTANT! Remove the code line data!!! or your $%^&) So it's more like a de-bugger for me.
Css Veiwer
This is my tack hammer I use all over the house and is always in close reach. It is a very simple plugin and does it's job beautifully. Just hover over an element and you get a very easy to read style guide to that element. Ya firebug does this too, but this is for quickies when I'm on a site and I just want to see quickly and clearly how someone accomplished an effect. You don't have to go back and for to the firebug window pain, it just pops up on screen and you are enlightened and face a deep moral de-lima whether you will just swipe it and run, or actually learn something and do it yourself and escape the fires of web developer hell where you are force to view all your creations on IE5 (mac) on a 600x401 screen (it's that one extra pixel that kills you) for eternity.
EditCSS
Just recently turned on to this one and man it's cool. It's my big fat monkey roof hammer (that I know all too well). I can just pound away and always seem to hit something I'm supposed to. Once I have been working on my style sheets for a couple of weeks I can read them like Joseph smith (mormon founder) throu a funky hat, one selector at a time. So when I know it this well it's easy to open up EditCSS and make a few big changes on the fly. firebug doesn't allow you to add selectors (if I'm wrong please help) though you can add declarations. You can addanything with EditCSS and watch it change on the fly. This would be great for those of you that want the live preview but don't want to drop the dough on CSSEdit, or that other PC version that just slipped my mind.
Web Developer
This one is my scratcher hammer. I used to use it much more than I do today. the CSS editor is a steaming pie and some other functions also are useless in my book. I actually
said I liked this plug-in on a podcast, I think I was mixed up. But I do scratch with it every once in awhile and where it gets the itch is downloading style sheets for my network, keeps the format most of the time when I just copy and paste and of course you can just use the url it gives you.
I have a few others but they are just nostalgia. Enjoy, and let me know which one is your favorite hammer.
Firebug
This is my big ass deck hammer... You probably have heard of this one or have it. In it's most basic use, it allows you to analyze visually the html next to the CSS. f I use this allot when I can't seem to find a sneaky attribute or tag in dreamweaver or cssEdit. for some reason I always find it with this little bug. It does allot more too, like inspecting DOM, which has helped me a ton lately on finding how a certain effect is constructed on a site. But, overwhelmingly I use it at the very end of designing my network. After I've carefully coded my page design in a css editor I plop it in socialgo and low and behold my footer is shooting off 20 miles to the west. This is usually because I deleted a CSS declaration instead of replacing it, and now the socialgo template is trumping my selector. So, I pull it up in firefox, find the offending selector and fix it right there, copy and paste it into my CSS. (IMPORTANT! Remove the code line data!!! or your $%^&) So it's more like a de-bugger for me.
Css Veiwer
This is my tack hammer I use all over the house and is always in close reach. It is a very simple plugin and does it's job beautifully. Just hover over an element and you get a very easy to read style guide to that element. Ya firebug does this too, but this is for quickies when I'm on a site and I just want to see quickly and clearly how someone accomplished an effect. You don't have to go back and for to the firebug window pain, it just pops up on screen and you are enlightened and face a deep moral de-lima whether you will just swipe it and run, or actually learn something and do it yourself and escape the fires of web developer hell where you are force to view all your creations on IE5 (mac) on a 600x401 screen (it's that one extra pixel that kills you) for eternity.
EditCSS
Just recently turned on to this one and man it's cool. It's my big fat monkey roof hammer (that I know all too well). I can just pound away and always seem to hit something I'm supposed to. Once I have been working on my style sheets for a couple of weeks I can read them like Joseph smith (mormon founder) throu a funky hat, one selector at a time. So when I know it this well it's easy to open up EditCSS and make a few big changes on the fly. firebug doesn't allow you to add selectors (if I'm wrong please help) though you can add declarations. You can addanything with EditCSS and watch it change on the fly. This would be great for those of you that want the live preview but don't want to drop the dough on CSSEdit, or that other PC version that just slipped my mind.
Web Developer
This one is my scratcher hammer. I used to use it much more than I do today. the CSS editor is a steaming pie and some other functions also are useless in my book. I actually
said I liked this plug-in on a podcast, I think I was mixed up. But I do scratch with it every once in awhile and where it gets the itch is downloading style sheets for my network, keeps the format most of the time when I just copy and paste and of course you can just use the url it gives you.
I have a few others but they are just nostalgia. Enjoy, and let me know which one is your favorite hammer.
Viewing 1 - 2 of 2
