The default ASP.NET skinning structure is to have a masterpage file in the 'Masterpages' folder, and then to place a CSS theme in the 'App_Themes' folder. Kartris originally followed this arrangement.
From Kartris v1.3 onwards, the arrangement was changed a little. A new 'Skins' folder was created, and subfolders within this hold the skins themselves. A skin folder contains the masterpage, the CSS files that were formerly in the 'App_Themes' folder, and associated images and other files. The advantage of this system is that skins are self-contained; this makes it easier to package skins for distribution as well as making it possible to switch a skin with one menu in the back end, instead of having to select a masterpage and theme separately.
Fortunately, the bulk of the CSS and XHTML code has remained the same - the majority of the changes just involved a little housekeeping to move things around. The following are our suggested steps for upgrading a v1.2 or earlier version skin to v1.3 - you will first need Kartris v1.3 set up and running, and have access to a full copy of your v1.2.
1. Create a new folder for your skin
This should be located within the 'Skins' folder, for example 'MySkin'.
2. Copy the Template.master from the default v1.3 'Kartris' skin
Copy the Template.master (and its .vb code file) to your new skin folder from the 'Kartris' skin.
3. Copy source code from your old .master to the new one
Open up your old masterpage file and copy everything from the DOCTYPE declaration (one or two lines from top) downwards. Open up your new Template.master file and paste this over everything from the DOCTYPE declaration downwards. So effectively you have replaced the bulk of the code in the new masterpage, but retained the part at the top which links to the VB code-behind file.
4. Import and link your CSS files
Copy the CSS files (for example general.css, sections.css and template.css) from your old theme in the 'App_Themes' folder
to the new skin folder. They can site alongside the Template.master page - you don't need to create a separate folder for them. Next, you will need to put links to these CSS files in your Template.master. This is because we no longer use the default 'App_Themes' folder where this is done automatically:
<link href="general.css" rel="stylesheet" type="text/css" />
<link href="sections.css" rel="stylesheet" type="text/css" />
<link href="template.css" rel="stylesheet" type="text/css" />
You should also copy across the Images folder from your theme to your skin too. This holds images used as icons and backgrounds in some CSS styles.
5. Additional javascript files
If your skin uses Javascript files, you will also have to link these in in a similar way to CSS files above.
6. Change the category control
In Kartris v1.2, only a dropdown/foldout style menu was supported. Kartris v1.3 has support for alternative menu types including an accordion. You will need to find the old category menu tag:
<user:CategoryMenu ID="UC_Categorymenu" runat="server" />
and replace with this:
<asp:PlaceHolder ID="phdCategoryMenu" runat="server"></asp:PlaceHolder>
7. Change images links
In previous Kartris versions, images embedded within your skin such as logos didn't have a obvious storage location. So there were typically located in the Images/FrontEnd folder or elsewhere. In Kartris v1.3, it makes sense to store them within the skin's 'Images' folder. You will then need to find any embedded images on the page (which will include traditional IMG tags as well as 'asp:Image' tags.
Once all these changes are complete, go to your back end and click to edit your language. If Select the appropriate skin for this language (e.g. 'MySkin') and then save. If you don't see the skin selection, make sure 'expertmode' is on from the config settings (search for 'expertmode' in the back end to find this). If everything is ok, the front end should now display using your upgraded skin, and should appear similar to your v1.2 store. Minor CSS fixes may be needed, but these should be relatively small.
In Kartris v1.3, the CSS for the dropdown menus on the front end skin is stored in a separate menus.css file. If you intend using the alternative menu types such as the accordion, you will need to grab CSS from here.
If the front end is on error, check the error logs in the DB admin section of the back end. Typically the error messages will easily help address any problems.