How to skin the Starter Site Why would you skin the starter site? Perhaps for a proof of concept, a demo just sizzles if it has the corporate look and feel. Or, you may have built your entire site on the starter site basis. It can be a good idea, at least it is a guaranteed solution. You just have to get used to having code not exactly to your personal taste, but it can drastically reduce project times. The starter site came out 3 months after Commerce Server itself. Make sure you install it properly according to the installation instructions. You can use the SpeedSmith installation method of this for a demo, the rights would be too generous for a production system.
Ok. Hold your mouse back. Don't start changing the CSS just yet! Starter Site is a real ASP.NET 2.0 site so you can go to the App Themes directory and see the default theme. Simply right click and create a new Theme. You can start by copying the CSS and gif's into this theme directory. Now change the webconfig to use the new Theme. Why do this work, if you are not planning to change themes programmatically? I find it a debug help to quickly change back to the Adventure Works theme if I have problems. I have seen css bugs make lines invisible, for instance. The CSS has a nice comment at the front as to which colors are used in the CSS, why not comment your changes too? Don't forget to replace search, the colors are used in more than one style.
You probably want to change the logo, this is referenced in the style sheet. (aw-banner.gif) Nice touch, because you will always want to change the logo if you are changing the theme. I usually get my gif's from the company web site if I am doing a demo. You will probably want to change the adverts also, you can put new url's in the adverts using the Marketing Manager. I like to demo the feature of the revolving ads, and make ad's from other divisions of the company, or from their web site directly. Usually goes over well.
Because Starter Site is a proper ASP 2.0 everything page is based on the master page. However every page seems to reference the master directly, so you would have to do a project wide search and replace if you want to switch to another master page. It could have been done better, allowing just a change in the web.config to change the master. I just make a copy and then make my changes directly in the default.master
But this is not real skinning you say? Just getting there. Add a new item to your App theme directory. Make it a skin file and call it default.skin. Now it does absolutely nothing! Well, it is empty apart from a comment. Now copy a button from another page. (e.g. login.aspx) . Now delete everything from the button except runatserver. Add a style change to the button eg(backcolor=lightblue). Save and look at any button on your site. Voila! Try out Text boxes and have fun. If you need more info, just go to the ASP.NET pages in MSDN, this is not a Commerce Server specific feature.
What is left to do? I usually massage the catalog, creating a test category to hide all the Adventure Works categories and creating a little navigation structure to model the customer's. And then I create a few products and gif's for the demo.
The demo awaits. Don't forget to practise your demo in a real dry run. And resist the temptation to make last minute changes.
(Don't ask me why I said that, I don't want to be reminded of the time...)
Happy skinning!
