Ecommerce Templates > Newsletter > September 2010

Ecommerce Templates Newsletter September 2010

Welcome to the September 2010 Ecommerce Templates newsletter

Welcome to the September edition of the Ecommerce Templates Newsletter where we announce the release of Version 6.0.1, now out of beta, along with some help on some of the great new features.

New release – Version 6 comes out of beta

The version 6 release has been a great success and we’re thrilled to announce that it has now come out of beta with the release of Version 6.0.1. The features were previewed in our July Newsletter where it is available for your perusal.

Updaters as always are available from the updater page - it doesn't matter which version you are currently running, you can always update to the latest and greatest without going through all previous versions first.

The product filter bar

One of the most popular features in Version 6 is the Product Filter Bar. This will appear on your products pages and allows customers to filter the product listings by Manufacturer, Price, Keyword and an additional Search Criteria parameter that can be assigned to products. In the same Filter Bar the customer can dynamically sort by any of up to 10 definable sort options and to dynamically alter the number of products per page. The filter criteria is completely controlled through the control panel, where you can select the filters you want to offer and choose the labels to introduce them.

To turn on this feature all you have to do is go to the main admin settings page of your store control panel and select the filters you want to present to your visitors. The filters should be quite self-explanatory and the only one that requires an extra step is the "Search Criteria". What this does is allow you to group products together by the criteria of your choice. For example if you have an electrical store you might have a category for televisions, and already have manufacturers set up but to further filter the product listing you might also want to split those into something like Plasma TVs, LCD TVs, 3D TVs etc.

To set these up go to your admin dashboard page and scroll down to find the link, "Edit Search Criteria" and enter the groups you want to use there. Once you've done that, go to the product admin page and click on "Modify" for the product you want to add to the recently set up group. You should see two drop down fields labeled "Manufacturer" the second drop down will show the groups you have just defined so select the one you want associated, click on submit and move on to the next one.

You can now go to the products page on your store and check the results. You might feel it looks a tad bare so we have provided some css classes to jazz it up a bit.

CSS tips – styling the product filter bar

Here’s a sample filter bar on our UK demo store.

Product filter bar

The css used there is the following

td.prodfilter{
background-color:#ececec;
border: 1px dotted #42619a;
padding:4px;
font-weight:bold;
color: #42619a;}

The attributes should be quite self-explanatory and you can play around with the values til you get the look and feel you are after.

Remember that the border can be dotted, dashed or solid (or none at all of course). There are some great examples on the CSS tutorial site.

If you want to add a bit more space around the filter bar contents, you can increase the padding value – changing from 4px to 8px if you have the space can look quite good. Make sure the text for the labels is clear and legible and you can tweak that with the font-weight and color settings. You can also add font-family and font-size properties if you don’t want them inherited from your main style settings. There's further reading on CSS fonts here.

All the classes used in the shopping cart can be found on our css help page.

If you have any questions or comments about the content of the newsletter, please feel free to post them on the support forum.