We came across an error today with our drop down menu system that uses a PNG-24 semi transparent drop shadow image around the border where the transparency would appear black in IE 7 and IE 8. After searching and trying all possible fixes we found the solution to the problem and it was quite simple.

Our menu system uses jQuery (doesn't everything these days?), and had a nice fade in and fade out transition. jQuery handles the fade transitions by setting the opacity which IE does not like very much. So using the fadeTo() functions in jQuery is a no-no in IE. The solution, use hide() and show() instead. It's not as elegant but the transparency issue was fixed on all modern browsers.

Other solutions to the problem include:

1. Using a background colour instead of transparent on the style so you would do:

.my-transparent-stuff{background: #fff url('image.png') repeat-y scroll left top;}

instead of

.my-transparent-stuff{background: transparent url('image.png') repeat-y scroll left top;}

2. Using PNG-8/transparent gifs (hey, it's a solution)

3. Forcing IE8 into IE7 mode by adding the following meta tag:

<meta http-equiv="X-UA-Compatible" content="IE=7" />

I still can't understand what Microsoft is doing!

Let me start off by saying, Magento is an EXTREMELY powerful and well built ecommerce platform. It contains all of the features necessary to deliver a stable and scalable solution for ecommerce (and more). That being said, I do have a few issues. So far, I find the system quite slow. Maybe it is just the current hardware but it does seem a bit sluggish. The next issue is documentation or lack thereof. The system documentation is VERY sparse and you rely mostly on community support and google. Of course, you can get premium support and Varien is well within their rights to charge for support but I think a bit more on the way of documentation would be a good way to gain more users.

I am attempting to implement this system and have had some success so far. Let me start by covering what has worked to this point.

• Installation of Magento on a Windows 2003, IIS 6 platform.
• Addition of inventory

The installation was a bit scary since I couldn't get it to work locally using the wizard. Eventually I got it working using a manual install. The site works for the most part but does not use url rewrites at this point. I have installed ISAPI Rewrite Lite but couldn't get it to work. I honestly haven't put enough time into it so I can't say if there is a bug or not.

Inventory takes a bit of getting used to. The interface is quite good however, it is a complex system and it can be a bit daunting for first time users. One thing I find quite annoying is the fact that the stock level defaults to Out Of Stock, which is a bit counter intuitive especially when you are adding products. I am sure that there is a global override somewhere, when I find it I'll make the change!

Now, the most important thing (and most difficult thing by far) is implementing a new design. This really takes some dedication to put all the pieces together. The designers guide offers some help in this area and you really have to sit back and digest it. Read ALL of it before you attempt to look at the code and ensure that you have some sort of understanding about how the system is designed and what each element does.

After doing some research I've noticed that what most people do is to simply change the styles for the default design that comes with Magento. The entire front end is governed by one stylesheet that can be customised as need be. I however don't want to simply change the look of it, I want to put things where I want them and really shake things up!

At the core of the design or theme is the layout. The layout is an xml file that defines the structure of any page. The layout references templates which contain the actual logic and markup to be displayed. This is an extremely flexible implementation. It gives you the ability to create custom content blocks and use them in multiple places. The only problem though is getting things to work the way you want them is quite another story. One very invaluable setting is the Template Path Hint which highlights on the screen and well, shows the template paths so you can fiddle with them as necessary. To turn this on follow the instructions found here. Another tip is to set all caching to off. This was extremely frustrating when I first started. To do this:

• Go to System > Cache Management
• Select Disable from the All Cache drop down
• Save Settings

It would be wise to also Refresh Layered Navigation Indices, which are found at the bottom of the Cache Management page.

I'll continue to work on this and post more about my success or failures as I go along.

I was digging around at alexa.com today and noticed that www.stripegenerator.com was getting a lot of traffic so I headed over there and made the background that I use on this site. I would like to see the preview change without having to click on it to refresh but all in all it is really cool. Check it out.