Search Wiki:
Project Description
Allows developers to create compiled, and therefore reusable themes for their ASP.NET web sites and projects.

See updates and more on my blog at www.dandoes.net.

Important! This code will only work with ASP.NET Web Sites, not Web Applications! See here for more information.

Creating a compiled theme

I recommend using a standard for creating a compiled theme. For example:
  • Use a common base namespace for themes, like YourCompanyName.Web.UI.Themes.
  • All theme resources should be kept in a subnamespace that is the name of the theme.
  • The result is that each theme will have its own namespace containing all theme resources.
    • For example, the "base.css" file in the "Default" theme would have a fully qualified name in its assembly of YourCompanyName.Web.UI.Themes.Default.base.css. I know it seems like a bit of a mouthful, but you'll never actually have to type it out or anything.

Creating Your Theme and Adding Files

  1. If you are creating your theme, add a folder to the Themes folder of your library project (not your web site) with the name of the theme.
  2. Add the theme files into the folder.
  3. Select all the files in the theme folder.
  4. In the properties panel (hit F4 to display it), locate the Build Action property. It should be the first in the list.
  5. Select the Embedded Resource option. This will cause all the files to be compiled into the assembly.
  6. Save and compile your project.

Using a compiled theme

Using a compiled theme involves adding the CompiledThemeBuildProvider to your web.config file and creating a theme definition file in your web site.

1. Modify web.config

Add the following code to your <compilation> section:

<compilation>
  <buildProviders>
    <add type="DanDoesDotNet.Web.UI.CompiledThemeBuildProvider, DanDoesDotNet.Samples.CompiledThemeBuildProvider" extension=".ctheme" />
  </buildProviders>
</compilation>

2. Create a Compiled Theme definition file

Create a file in your web project with a .ctheme extension. I recommend naming it web.ctheme so that it is sorted with the rest of your web. configuration files.

The web.ctheme file is an xml file that defines the themes to copy, and the assemblies and namespaces they are located in. Use the following example for reference:

<?xml version="1.0"?>
<assemblies>
  <assembly name="DanDoesDotNet.Samples.CompiledThemeBuildProvider">
    <themeNamespace name="DanDoesDotNet.Web.UI.Themes">
      <theme name="Default" purge="false" usePrefix="true">
        <skip>KeepThis.css</skip>
        <skip>KeepThisToo.css</skip>
      </theme>
    </themeNamespace>
  </assembly>
</assemblies>

  • purge is an optional attribute the specifies whether that theme's directory will be deleted each time the site is compiled. This should not be used if you plan on making modifications to the theme. The default value is false.
  • usePrefix is an optional attribute that specifies whether the prefix _ctr_, standing for Compiled Theme Resource, should be prepended to each file. If you are planning on customizing a theme, this option is handy for organization because it forces all compiled resources to be sorted at the top of the directory. The default value is false.
  • <skip> elements tell the BuildProvider not to overwrite the specified file. This can be used to swap out images.
  • All other elements and attributes are required.

Known Issues

  • There is almost no error handling. I know, sorry. I haven't run into any actual problems yet though.
Last edited Jul 17 at 1:57 AM  by DanielSchaffer, version 7
Updating...