My experiences from installing EPiServer CMS 5 on Windows XP

Installing EPiServer CMS 5 on a Windows XP developer VM turned out to be a bit of hazzle, maybe because XP is not a “supported” OS any more?

Ok, so first installed the EPiServer CMS5 5.2 R2 application files to the default location. No problem so far.

Since I am working on an existing web site, I created a folder on disk and got latest version from TFS.

I then copied the EPiServer binaries into my bin-folder (XCOPY-deployment), and attempted to browse the website. I got this message:

Could not load type 'EPiServer.UI.WebControls.ControlAdapters.HtmlHeadAdapter'.

This error message originated from the App_Browsers / AdapterMappings.browser file.

I then went into my web.config file and verified that my VPP paths were mapped correctly to files in the Program Files\EPiServer\CMS\5.2.375.236\Application folder.

So my next thought was to open the edit/admin mode. Alas, it looked all messed up, missing both styles and graphics.

This gave me my next clue, because in EPiServer 4.x you had to remap the 404 http error status to /utils/NotFound.aspx to make the admin/edit modes look as they should, as I described in my previous posting: http://stgaup.blogspot.com/2009/10/styles-missing-in-episerver-editadmin.html.

That trick does not seem to work on CMS 5 (only works on EPiServer 4.x). Now in stead you need to do something a bit different:

1. Open the “Properties” for your web site in the IIS manager.
2. On the “Home Directory” tab, click the “Configuration…” button.
3. On the “Mappings” tab, click the “Add” button.
4. Click the “Browse” button next to the “Executable” text box.
5. Navigate to the Windows/Microsoft.NET/Framework/v2.0.50727 folder.
6. Select “Dynamic Link Libraries” in the “Files of type” dropdown.
7. Select the “aspnet_isapi.dll” file, and click the “Open” button.
8. Fill in the “Extension” as “.*” (dot-star).
9. TRICK: There’s a bug in Windows XP that has never been fixed, that causes the “OK” button to remain disabled. Click in the “Executable” text box again and then voila, the “OK” button is enabled.
10. Click OK as many times as it takes to get back to the “Internet Information Services” application.

Now try to reload your admin/edit mode. It should work.

Some good links:

• Dropit blog – Checklist for deploying EPiServer Sites
• EPiServer CMS 5 R2 Installation Instructions
• IIS 5.1 OK button unavailable when you add application mappings

Themed CheckBox check mark

Themes for ASP.NET applications came probably in 2005 with .NET 2.0, so it’s been around for a while.

I am creating different themes to adapt my web appliction to different clients.

So the problem I came across with the ASP CheckBox control is that setting the size of the control does not change the size of the check mark. Neither does it have any properties for setting the size.

Also, I want to be able to theme my control, so the control needs to have some kind of property that could be set in the skin file, and there is no such property on the standard asp CheckBox. It does have a method for setting properties on the inner input control, however, but as I said, I need a property.

The CheckBox control is rendered inside a span tag, like this:

<span class="checkbox">   <input id="ContentPlaceHolder1_chkPersistLogin"          type="checkbox"          name="ctl00$ContentPlaceHolder1$chkPersistLogin" />   <label for="ContentPlaceHolder1_chkPersistLogin">Remember me</label> </span>

Now, as you can see, if you set the CssClass property of the control to something, then it will be applied to the span, not to the inner controls directly.

So, as I mentioned, the CheckBox control does have a way of accessing the inner input control. It is by using the InputAttributes propertys methods. For example, the following code will add a “class” attribute to the <input type=”checkbox” /> tag:

MyCheckBox.InputAttributes.Add("class", “MyCheckBoxCssClass”);

If I want to set the class on my inner input control, then I could create my own custom control that inherits from the asp CheckBox control. Here’s my CheckBoxPlus class:

using System; using System.Web; using System.Web.UI.WebControls; namespace MyWebApp.WebUI.Common.CustomControls {     public class CheckBoxPlus : CheckBox     {         private string _inputCssClass;         public string InputCssClass         {             get { return _inputCssClass; }             set             {                 _inputCssClass = value;                 this.InputAttributes.Add("class", _inputCssClass);             }         }     } }

To be able to use my custom control in a page, I need to add a directive to the web forms where I want to use it:

<%@ Register TagPrefix="custom" Assembly="MyWebApp.WebUI" Namespace="MyWebApp.WebUI.Common.CustomControls" %>

Now I can use the control im my page, and set the new property:

<custom:CheckBoxPlus ID="chkPersistLogin" runat="server" Text="Remember me" CssClass="checkbox" />

The last part is to enable theming/skins for the control. The only thing you need to do is to add the same Register directive at the top of the skin file, and then you can create a template for you control in the usual way. Here’s an example skin file:

<%@ Register TagPrefix="cd" Assembly="MyWebApp.WebUI" Namespace="MyWebApp.WebUI.Common.CustomControls" %> <asp:Button runat="server" /> <asp:TextBox runat="server" /> <asp:Label runat="server" /> <asp:Panel runat="server" HorizontalAlign="Center" /> <cd:CheckBoxPlus InputCssClass="checkboxplus" runat="server" />

When I load my page now, the rendered HTML looks like this:

<span class="checkbox">   <input id="ContentPlaceHolder1_chkPersistLogin"          type="checkbox"          name="ctl00$ContentPlaceHolder1$chkPersistLogin"          class="checkboxplus" />   <label for="ContentPlaceHolder1_chkPersistLogin">Remember me</label> </span>

As you can see, the theme sets the InputCssClass, and thus I am able to control the size of the check mark of the CheckBox control.