Themes and Images
Themes first introduced in VS.NET 2005. As we all know a theme is a collection of property settings that allow you to define the look of pages and controls. Themes can define the look of a specific Web application across all of its pages, or across all Web applications on a server.
Themes are made up of a set of elements: skins, cascading style sheets (CSS), images, and other resources. At a minimum, a theme will contain skins. Themes are defined in special directories in your Web site or on your Web server.
Let’s say that I’m working in a project that as a requirement the web application must have 3 themes available. The easiest way to do it is to include the images folder into each of the theme folders. That is because every css file and skin that references to an image will just have to look for in the current folder(the current theme’s folder) for the images subfolder.
For example:
.Header
{
background-image: url(images/topbackground.png); background-repeat: repeat-x; width: 100%;
margin: 0px;
}
Images folder is a subfolder to the current theme’s folder. So now is so much easier to create a new theme. All I have to do is to create another folder to store the new theme’s elements into the themes folder.What about the images that have nothing to do with skins and css files? These images should be included into the images subfolder that exists into each of the theme folders. So again the only thing I’ll have to do is to use this code:
protected void Page_Init(object sender, EventArgs e)
{
this.imgDelete.Src = "~/App_Themes/" + Page.Theme + "/images/delete.png"; this.imgInsert.Src = "~/App_Themes/" + Page.Theme + "/images/add.png";
}
So now no matter which theme the page is using the images will always be shown correctly.
Keep coding!!!