About Club osCommerce

Showcasing osCommerce…the good, the bad and the ugly!

Follow osc_pro on Twitter

Category View: Grid or List?

Written By Gary on Feb 20 2012 · Comments (9) Follow osc_pro on Twitter

In the ongoing project that I am working on, the client decided that he would like the ability to choose how each category displays; whether it be a "grid" view, or a "list" view…

There are a few older forum posts about this, and some sites have some good examples of something very close in action. A typical example is Matts site (example category page) where the user can change the view from list to grid and vice-versa.

We needed something slightly different, as we need the Admin to decide the correct view and then not have the ability for the user to change it.

Admin
Has the ability to choose how the category is shown. If "list" is selected (which it is by default), then the usual osCommerce product_listing modules is shown. If "grid" is selected, then a new coded module is shown.

Shop "List" view

Shop "Grid" view

It's a pretty good idea, as sometimes it is better for the end-user to have the available information presented in a different way. Whatever is better for the end-user is usually better in terms of the shops' bottom-line !!


Buy Gary A Beer?
Buying me a "beer" helps me to keep my contributions updated and keep this blog alive - and you get a link from my homepage to your site. Cheers!


9 Comments

  1. Hi Gary

    Do you have the choice to display different categories in different ways (Cat A as grid, Cat B as list, etc) or do you have to stick to either grid or list for the whole shop?

    What would also look good for some shops is that "cover flow" system they use in itunes :)

    Comment by Isa — February 22, 2012 @ 9:45 am


  2. Hi Isa

    Yes, Cat A could be grid, B list and so on. Admin can choose the style when creating or editing a category.

    A cover flow system would be cool to – but I'm not sure on it; http://www.engadget.com/2010/04/08/apple-granted-design-patent-on-cover-flow/

    I'll have a think about adding some type of jquery gallery effect if I can find one.

    Comment by Gary — February 22, 2012 @ 9:55 am


  3. Hi Gary & Isa,

    I found this and I think it is pretty cool! It is kind of like cover flow and the images get a reflection effect-

    http://www.jacksasylum.eu/ContentFlow/

    -and also this one with jquery ui-

    http://addyosmani.com/blog/jqueryuicoverflow/

    Matt

    Comment by Matt — February 22, 2012 @ 2:13 pm


  4. thinking a little further (as I was already thinkering along these lines) – will you introduce product listing modules ?
    In an ideal world, you would just drop in a product listing module in the directory, enable it, possibly configure a little, and have the option to select a specific layout, or have a default applied if no specific one is selected.

    Comment by Carine — February 22, 2012 @ 6:38 pm


  5. @Matt
    I like the links you found, especially the first one.

    @Carine
    I love your idea, selecting a specific layout for each product would be great, or even just for each category. I could use that on my shop.

    Comment by Isa — February 22, 2012 @ 8:04 pm


  6. The grid/list view of the category is great, as it serves a very specifik purpose for me..
    Huge categories with spare parts that almost sell themselves, or cheap products that don't need any special attention, are best listed in grid view.

    More expensive products deserve a more special deisplay, and therefore would be best displayed as a list.

    I like the idea of special product layouts, but at the same time i'd be afraid to confuse the customer. Once the user has seen one product page, they expect certain ellements to be at the same place (add to cart, price, stock etc). . If you move those around for each product, it might do more harm than good..

    Comment by Steph — February 23, 2012 @ 10:44 am


  7. I pretty much have to agree with Steph – I think it's important to keep a product layout the same.

    Comment by Gary — February 23, 2012 @ 11:48 am


  8. hi,
    I will developp a dynamic product listing for osCommerce 3.(grid or line views could be changed by visitors to Website)
    stay tuned on my tweeter. :)
    see ya !

    Comment by Laurent — March 2, 2012 @ 1:14 pm


  9. In case anyone wants to follow Laurent; @foxp2projects

    Comment by Gary — March 2, 2012 @ 1:22 pm


Leave a comment

RSS feed for comments on this post

Hot 100 osCommerce Shops

View the osCommerce HOT 100These are the best looking, most exceptional osCommerce Stores as voted for by you.

New to osCommerce - get inspiration from these beautiful shops. Reckon your site has what it takes to become a member of the HOT 100? Submit it!