HomeArticlesDemosContact

Customization Reviews - CSS, Templates and Themes

Each of the reviewed shopping carts has some different mechanisms for customizing the "look and feel" of the shopping cart. The key customization mechanism was generally CSS, but some used various templating systems. Your goal as a merchant or a developer for a client is to provide that unique branding to your site. This develops brand recognition and adds to your professionalism, reliability and trust.

It is important to remember that customization at this level requires some knowledge of CSS and HTML at the least and often some PHP skills. The rating is largely based on how "easy" the process was for someone of limited CSS and HTML skills (and no PHP skills). Lower ratings will be for greater complexity and more required skills, even if it is more extensive.

Why CSS (Cascading Style Sheets) ?

In the "old days" changing the look of a website involved tedious hours of search and replace to update a simple logo, text style, formating, or graphic. This process is not difficult, but is very time consuming. It also can result in errors and in some cases very expensive "fixing" caused by those adjustments. The "Style Sheet" technology pulls the various attributes (graphics, text fonts, styles, formating, colors) out of the document and places those attributes in a separate document. In this way those changes can be made in a central location and will update the entire website. This is much more cost effective and is not as subject to errors and other costly "repairs"

Templates

Many websites, and especially complex websites tend to be based on a lesser number of common layouts. Layouts represent the "structure" of a page: where the content, menus, sidebars and footers will occure. These layouts are often called "templates" . It is very common to see this technique in content management systems (CMS) and a shopping cart can be thought of as a specialized CMS that focuses on eCommerce. Like any technique it has its pluses and minuses. On the plus side it creates a more manageable organization to the site and minimizes the "pages" that must be edited to change the layout and basic structure of the site. On the minus side, old or poor code techniques can be carried into the future and create serious issues in meeting the new web standards and compatibility with new browsers. In relation to the carts reviewed OSCommerce is a good example of the burden of that old technology and how it now handicaps that shopping cart in todays "web standards" oriented world.

Marketing Issues

Branding

The key to branding your shopping cart is to create the same visual "look and feel" that you created in your primary website and marketing materials. This allows your customer to both immediately recognize that they are on "your" site but also brings in all of the associated confidence and trust you have established in your relationship with a customer. This relationship could be as simple as your business card or a recomendation from a friend.

Notes on Customization for reviewed carts.

Following are notes used to score each cart in the feature matrix for Ease of Customization - CSS category of the main "Features" discussion:

PrestaShop

PrestaShop was one of the few shopping carts that had detailed instructions for creating a theme. This is found at:

http://www.prestashop.com/wiki/Themes/

The theme is entirely based on CSS and they provide excellent suggestions to get you started. Add to this their "Positions" tool in the Admin and our shopping cart can take on any look that you can imagine. This rated PrestaShop a solid 5 for this feature.

OpenCart

Unlike PrestaShop, it was hard to fine good instructions for customization. Once found it was simple and clearly designed similarly to PrestaShop. The best instructions were found in their forums at:

http://forum.opencart.com/viewtopic.php?f=21&t=4060&p=19566&hilit=templates#p19566

Scroll to the bottom of this thread where the last poster outline the process. The theme is also based entirely on CSS so from this point, the same skills and effort apply. OpenCart also has a basic "positioning" feature found in the Extensions|Modules configuration. It is simple but effective. This rated OpenCart a (4) rating. If they would added the contents of that thread to their wiki, it would be a (5).

Zen Cart

In this area, Zen Cart is not for the beginner. It has about every option you might imagine for customizing your cart, and because of that is very extensive and complex. Everything you might want to know on this topic is here:

http://tutorials.zen-cart.com/index.php?category=4

Pull up a chair and pour a cup of your favorite stimulant, you will need it. The documentation is good but it can be overwhelming if you are new at PHP programming, CSS, and HTML. It rated a (3) because of that complexity, for completeness it would have rated a 10.

OsCommerce

Like Zen Cart this cart is not for beginners. It also has an incredible array of options. OsCommerce has an extensive community of developers that are selling templates. It is clear from a number of comments on the forums that "buyer beware" is important, as there are many compatibility and version issues to consider. Because you can purchase a template, this makes it easier to get a new "look and feel" without any programming. The downside is finding a template that completely meets your needs. There is a contribution called "Simple Template System" (STS) that provides documentation and instructions for a more "do it yourself" effort. It still may require more skills that the average merchant might have at their disposal. That link is here:

http://www.oscommerce.com/community/contributions,1524

Without the STS contribution it would have rated a (1) because of both the complexity, very poor W3C compliance, table based structure, and the learning curve required. STS bumps it up to a (2) and this technology at least makes it reasonably possible (Though there is a learning curve involved.).

Chromium Cart

Chromium Cart (formerly OpenCart Zero) is just release a new version and now is on par with the other CSS based carts. A wiki has been devoted to explaining the underlying framework and how to develop modules and extensions.

http://wiki.chromiumcart.com/index.php?title=Main_Page

As yet there is not the level of help found in PrestaShop, but it does follow many of the same techniques and therefore a skilled CSS/HTML coder will beable to customize this cart quite extensively.