Luxury Chocolates Store

[Guest offthehook]

This site has just gone online:

Chocolat in Kirkby Lonsdale

If anyone has any comment or criticism please let me know. I've worked hard on this one and I'm really pleased with the results.

There are three (smallish) features I'm proud of:

I was getting comments from customers with larger monitors and laptops that my site designs were too 'thin' (usually 750px wide). Now after having designed only one site which was flexible width I didn't want to go down that route again as it was a nightmare to keep all the elements looking good across many different widths. I finally found a solution via javascript and have implemented it on this chocolate site. Basically it uses two stylesheets while the javascript keeps an eye on the browser width and changes the stylesheet when the window hits either 800 pixels or 980 pixels wide. Try resizing your window while on the site and tell me what you think.

Yep, its more work to make two lots of everything (images and css), and requires a bit more planning but I have to say that the site looks much better when viewed on a bigger monitor or laptop screen. Everything is easier to read and the site does not looked 'orphaned' in the middle of the screen.

Second feature is one I stumbled on late into the design. As I like making tableless designs, I removed the table from the viewcat.tpl and replaced it with divs to contain the products. However all the divs were coming in at different heights depending on the content. That meant that they never floated underneath properly (unlike table cells would). Once again it was javascript to the rescue, and by adding "prototype" javascript I was able to implement a function which resized all the divs on one row to the same height, thereby giving me a table-esque layout but without the table markup. And although I'm still using tables for my cart page this will almost certainly change at some point.

The third feature was to replace all the input buttons with the button tag. I have done this because the button tag allows for greater freedom in styling the buttons – in this case by using background css images to create rollovers. I think the site looks so much better for having a unique button set. There were some issues in getting all the buttons to look right in all browsers through css and because the buttons required a java onClick function I had to write the javascript into the cart.inc.php file as well as rewrite all the input tags in the tpl files, but the result is definitely worth the effort.

Well I hope somebody gets something out of the above. I believe in always creating a custom design to suit the individuality of the client and I feel it is important that shopping sites don't all look alike. Cubecart is a fantastically easy tool to customise and integrate (see my friends' at Tullnet's latest design www.tramigo.co.uk to see how you they seamlessly incorporated CC into a CMS).

If you want any more info you could pm me and if you have any comments about the site, good or bad then please do post.

[Guest pshawny]

Wow, nice looking site. Very upscale. I think you just inspired me :dizzy:

[Guest dpage44]

The site is very nice, but

I don't see the Add to Basket button in IE6.. At least not on my machine. It does show in Firefox, Opera, and Seamonkey however.

[Guest]

I also do not see the add to basket with IE7.

Much better than the previous one you had.

Keep up the good work :dizzy:

[Guest offthehook]

Thanks for the comments.

I didn't realise the add to basket button wasn't showing in Explorer so thanks for that. Sometimes when you look at something for a long time you can miss the obvious!

A bit of trickery in css got it working again.

[markscarts]

Very nicely done; a pleasure to view, to read and to navigate.

Interesting stuff in the js solutions, thanks for sharing.