How To Create Custom Skins For DotText（如何为DotText创建自定义风格的皮肤）

Creating custom skins for DotText is quite easy I've found.  It only took a few minutes to be well on m way to making skins.

1. First find where the default skins are saved so that you do not have to start from scratch.  We are just going to copy one of the existing ones and edit that.
   
   Install Directory>/Skins
    
2. Open up the skins directory and choose one of the existing skins folders to copy.  I used Marvin3 (thanks Marvin, who ever you are) because I like the columns down each side of the page.  Make a copy of that folder.
    
3. Now that you have a copy, rename it to something you like.  I called mine EIce because it is largely based on blue -- the color of ice and the constant coating on my car.
    
4. Open up your newly named folder and depending on which previous skin you copied you will notice several Css files.  Marvin3 has a few while others only have one.  For each Css file you have, that will be a version of your skin.  You will also notice PageTemplate.ascx (Asp.Net Custom Control).  This is the file that holds the information about the positioning of your new skin.  Open it up to see how it works.  You should see that the normal tag prefixes are registered at the top of the file and where they are used to draw how your skin will look.  There is also a mix of Html in there -- feel free to edit that if you like but be sure your syntax is correct!  You should also plainly see how you can move elements, such as “News“ around by using the tag.
    
5. Back to the Css file now.  Most skins refer to the elements in the ascx file by their ID's, so take a look at which ID's go with which elements and you will know which Css selectors edit them.  I added a bunch of stuff to the a:hover selector so that when you mouse over my links, they do something crazy -- like highlight.  Customize this file as much as you like but again be sure that you use only proper syntax!
    
6. In your skin's directory, find the Images folder.  This is where you can store images that your skin requires.  I put Dave M.'s blue duckie that I took a picture of in mine because I used it as a background.  You may put whatever you like in there and reference it from the Css file just one directory up.  I have background-image: url(Images/blue_duckie_bg.gif);
    
7. Now lets look in the Controls folder in your skins directory.  Here you can edit each element of your blog via even more ascx (Asp.Net Custom Control) files.  If you open one up such as BlogStats.ascx, you can see just how the stats are printed out on your blog.  You can reformat or change the way they, or any other control, displays.  Pretty cool huh?  Good job Scott!
    
8. The next and final step to creating your own skins for DotText is to update the Skins.config file.  It is stored in the Install Directory>/Admin folder of your blog.  Once you have this file open you will see entries inside of the tag, .  You need to create a new entry for each on of the versions of your new skin -- in other words, for every Css file (color scheme perhaps) you will need an additional entry.  The SkinID attribute needs to be the name of the skin you created (in my case EIce) with a hyphen and then the name of the Css file.  The Skin attribute is the display name of the skin that shows up in the drop down box inside of the config.  Then the SecondaryCss attribute is the file name of the corresponding Css file.  Here are a few entries from my new skin:
    
   

   <SkinTemplate SkinID = "eice-green" Skin = "EIce" SecondaryCss = "green.css" />
   <SkinTemplate SkinID = "eice-blue" Skin = "EIce" SecondaryCss = "blue.css" />
   <SkinTemplate SkinID = "eice-red" Skin = "EIce" SecondaryCss = "red.css" />
    
   I have three Css files named green.css, blue.css, and red.css.  My skin name is “EIce“.  Do you see the theme here? :-)  Be sure you save this file, again with no syntax errors (look over your code!), and upload it back to the webserver in the Admin directory.

That's really all there is to creating custom skins.  The only repetitive part is making many versions of your Css file to have different color schemes (which I'll do later, maybe, when I get sick of blue).  Everything is in plain text so you don't even need to open Visual Studio .NET (but I use that as an editor because it colors the code so nicely).