New Demo site

Out of date

This post is marked as "Outdated". Newer posts, snippets or tutorials may be available: you can look for them using tags, categories or typing a keyword into the search form on top of the page.

One of the most boring things to do (after you spent hours or days coding) is to prepare a fake demo website for a new design. They are all alike, with only slight differences the user doesn’t even notice.

And they are boring for the user too because the main goal of a demo site is not just to show how a design looks (a few pics would do the job) but also to show the differences between designs or various flavours of the same design.

Problem solved.

Now there’s only one website and you can switch design on the fly with just one click. Only Sandvox 2 designs will be shown there, old designs still have their old, specific demo sites, one each, accessible from their own pages.

Even if there’s only one design (Carbone) at this time, you can already try because it comes in six variations – and you have them all in there.

I had to postpone the work on Sugar a little bit, but I think it was the right time to do this (I was thinking about it since the very beginning…).

Technical details, for geek’s eyes only: I created a very basic Sandvox site, then I modified by hand the HTML to add the switchbar, the alternate styles (one for each design), a javascript and a css file (all via php include); drop-down menus are entirely done with CSS (no JQuery here); the switcher js is an old script I’ve had on my Mac for years – I don’t even remember where I found it – and uses a cookie to store the last design you selected.