Beginner's Guide to Themes in ASP.NET

Using Themes with ASP.Net 2.0 is very simple. Most web designers by now understand the concept of ‘skins’. That’s the way Theming in ASP.Net 2.0 is built, by creating skins, or a ‘look and feel’ for a web site.

Here are the absolute necessities to build a theme:

  1. A folder called ‘App_Themes‘ in the application’s root directory
  2. At least one folder, with the name of the ‘skin’ as its name.
  3. Within that folder, at least one ‘skin’ file

Number 1 is fairly straightforward, but if this is your first time learning about Themes in DotNet 2.0, you may not know what a ‘skin’ file is. Basically, it’s only a text file, with ‘.skin’ used as the extension. Inside that text file is where you build what will be your ‘skin’. The only things that are required inside this .skin file is a list of all the ASP.Net server controls, the look of which you want to control. Let’s say that, for each and every textbox you have in your website, you would like the border color to be solid, 1 pixel in width and Light Gray in color, and you want it to have an Antique White back color. No problem. In the skin file, you build an ASP.Net Textbox, including the Runat=”Server” designation, but WITHOUT the ID attribute, using the look and feel you desire. For instance, in this example, it would look something like this:

  Runat="server" />

Now, you create a look and feel for each and every ASP.Net server control you want to include in this skin file. There’s no real need to include EVERY server control in the skin file, but you probably should include each server control that you’ll most likely be using in the application. Then, save that skin file, with a .skin extension, with the same name as the designated skin, and inside the designated Theme directory.


Leave a Reply

Your email address will not be published. Required fields are marked *


You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>