February 7, 2010

The Worst of MSN.com – Wasting My Time

I use a few different browsers during my working day. To do my simple browsing, email checking, etc etc, I use Google’s chrome – because it’s fast. To do any web development; I use Firefox – because of the plugins. I can’t work without Firebug, the w3c Validator, and the Web Developer tool bar.

But near the end of a project, there comes that time to check the… other… browsers. Internet Explorers 6-8. I don’t use IE for even accidental surfing – strictly for cross browser checking. So I haven’t changed it’s settings or anything, and I’m forced to view it’s default home page.

Yeap. MSN.com.

Somehow, whenever I’m in the middle of debugging a site under IE6, I always manage to learn some new facts courtesy of Microsoft’s top notch web editors.

Bill Gates(‘ company) drops some knowledge on you:

  1. The average annual salary of an janitor… in 1958. ($3,455)
  2. The ever pressing issue of “Who looked hot” at the People’s Choice Awards
  3. Fruit bats get kinky, just like us
  4. Miley Cyrus! Not Hannah Montana Anymore!??
  5. Old people get married at Whole Foods. Good old fashioned, hard hitting online journalism.
  6. Does this city make my butt look big?
  7. Puppy CPR

More to come!

December 30, 2009

Magento – Adjust the HTML Body Class of your pages via Layout XML

magento_logoWhen it comes to Magento, I’m mostly a frontend developer. I’ve written some modules – some of which I’m working on sharing with you, public –  but for the most part I stick with it’s core functionalities and just edit the template HTML & CSS files.

As such, I found myself wondering how I could add a new class name to the body tag in the HTML. I at first checked the skeleton template files in the page/ directory of the template; and it just referenced a function. After a little hunting, I found out the correct way to add a new class in Magento – via the layout files.

If you don’t get the layout file concept of Magento, you really ought to look into it. I’m not here to enlighten you about that.

Anyway – you can add new body classes on a per module basis. So let’s say we want to give all the “my account” pages a body class of… account-control. This can be very useful to add a generic style across the board to each account page that is separate from the styling of the rest of the site.

You’d need to find the appropriate module block (I believe it is customer_account) and paste the following code in

  1.  
  2. <reference name="root">
  3.   <action method="addBodyClass"><classname>account-control</classname></action>
  4. </reference>
  5.  

That’s it! Make sure you refresh your cache if necessary, and refresh the account pages after logging into a user account. Check the source – an additional body class of “account-control” has been added!

I wasn’t as specific as I could have been about things in this article; let me know if you have any troubles and I’ll update as necessary for all you n00bs.

Cheers

2 responses
December 11, 2009

Custom Magento Pages using your Text Editor, not the Admin CMS

magento_ecommerceFor me, one of the most annoying things about Magento is the fact that the home page needs to be written in the Admin’s CMS. For that matter, any “custom” page you wanna build in Magento has to be done through the CMS.

I heart my text editors, and I hate writing HTML code into a CMS. It’s just not friendly. Tab indenting is impossible; if you hit tab your browser thinks you wanna select the next button! Think a textarea is gonna give you code hinting? Forget it!

Futhermore; I’m not a big fan of hosting files whose code I must edit regularly within the database. It’s just not practical.

Brad Frost recently blogged about the power of using Magento’s CMS blocks. I’m gonna take it one step further – let’s use the short code Brad Frost shows us in his blog to create custom pages that we can control through PHTML files in our theme; not code that is stored in the database. All you have to do is follow these steps:

  1. In the backend, create a new CMS page. Make sure to choose the appropriate layout (in the sidebar, click “custom design”) and enter in the page’s title, as well as it’s URL reference.
  2. Instead of writing your code in the textarea, stick this guy in there:
    {{block type=”core/template” name=”yourPageTitle” template=”cms/custom/your-file.phtml”}}
  3. In the above line, replace “yourPageTitle” with your page’s title – this isn’t terribly necessary, but good practice.
  4. More importantly, replace “cms/custom/your-file.phtml” with the directory that your PHTML file will be stored within the template folder of the theme you’re using. I store all my files in the “cms” folder under the template folder, and I created a folder called “custom” to store all my custom PHTML files. You can do the same or choose your own path; whatevs.

And that’s it! Save the page within the CMS, write some code into the PHTML file, and you should now be able to visit the URL you specified and see the code you wrote OUTSIDE of the CMS!

one response
November 17, 2009

One Big Mistake that Could Ruin your Projects

us-0125-40582-frontJust read the latest article at Fuel your Interface entitled “Three Big Mistakes that Can Make or Break your Design Career.” Super informative; one of the three tips were to never sit around waiting for work to come – go find it! In this day of social media, personal branding, and transparency, there’s no reason to wait for anything. Go out and get it!

The third tip was to not stretch yourself thin. I’ve personally committed this foul many a time. And everytime, it results in me stressing out, having a lesser quality of life (dramatic, but serious), and most importantly, my work suffers in one of two ways: It’s either terribly late or not as good as it can be. And both of those are unacceptable flaws; so don’t ever take more work than you personally can handle! Try to find someone who you can outsource work to; they may come back to you with work just when you need and don’t expect it.

But the second tip really interested me. Jokingly, it’s referred to as the “Garmon principle” – Garmon being some friend of the author (sorry to belittle your existence, dude named Garmon). From the article:

The first thing you should do is close your laptop, put away your cool bag of tricks, and think. Think, “What would be the perfect site for this? What would it look like? If there were no boundaries, what is the coolest thing, or the most functional way, to make this happen?” Also think, “What will make this worth existing as much or more than the next guy’s interface?” Once you have decided what the best possible solution would be, figure out how to do it. If there is something in your original idea that just simply isn’t possible, then amend it. “Re-idea,” if you will. But never, ever, EVER sit down and start doing things simply because you know how to do them. Because the truth is, no one really cares how much you know about coding or development. The people who are looking at this site aren’t thinking about what it took to make it, or how many advanced lines of code you wrote. They’re thinking about how it is now, as a whole.

So much sense! My feedback after the jump.

(more…)

no responses
November 12, 2009

Lazy Web Development

lazy-cat5I spend most of my working hours on the front-end side of web development, so I tend to be pretty anal about… everything. Work related, that is.

So my buddy Neil Sarkar recently wrote about being lazier when it comes to programming. Though there’s some wavering of topic, the main idea is that as programmers, it’s not so important to know everything all the time – it’s more important to know what you need, when you need it.

This is all based on the premise that everything you don’t know – or used to know – is only a Google search away.

While reading, I found myself agreeing and disagreeing all at the same time. Or maybe separate times. Anyways, more past the break!

(more…)

no responses
Older Posts »

Best of Blog

  1. Let’s do the kids a favor: HTML as a classroom language
  2. USTORE.js – cross browser local and session storage
  3. Add Facebook Connect to your PHP Web App
  4. Setting up your website on Rackspace Cloud Servers – Manage Your Own Hosting
  5. Tutorial: Using Zend_Captcha_Image

Search if you must