Super Easy Customization of Citrix Web Interface 4.x

24

UPDATED (now includes 4.2 template). There are several resources out there explaining how to customize or brand Citrix Web Interface. The easiest method I’ve found by far is to modify the layout.ascx user control. Using the technique outlined in this article, you can quickly give your Web Interface site a brand new look and feel.

There are several resources out there explaining how to customize, or brand, Citrix Web Interface. The easiest method I’ve found by far is to modify the layout.ascx user control. Using the technique outlined in this article, you can quickly give your Web Interface site a brand new look and feel.

The layout.ascx user control
The heart of the Web Interface layout is a file called layout.ascx. Layout.ascx is a user control that “constructs” the Web Interface authentication and applications page’s HTML. There are two different layout.ascx files for every Web Interface site. These layout.ascx files can be found at path_to_your_wi_site\auth\include (login page) and path_to_your_wi_site\site\include (applications page).

UPDATE: The layout.ascx files in Web Interface 4.6 are located at path_to_your_wi_site\app_data\auth\include (login page) and path_to_your_wi_site\app_data\site\include (applications page).

Cutting layout.ascx to the core
To get started, open up the layout.ascx file located at path_to_your_wi_site\site\include. Next, strip out all the markup and code between the opening and closing <body> tags except the <wi:Welcome runat=”server”/>, <wi:MessageCenter>, <wi:Toolbar>, and <asp:PlaceHolder> tags. These tags are the “meat and potatoes” of the Web Interface applications page. The <wi:Welcome runat=”server”/> tag displays the welcome message. The <wi:MessageCenter> tag displays the message center. The <wi:Toolbar> tag shows the toolbar holding the refresh, settings, and help buttons. The <asp:PlaceHolder> tag shows all the published applications for the authenticated user.

Note: it is not necessary to use any of these tags in your final markup although it would be pretty silly not to include at least the <asp:PlaceHolder> tag.

The end result should look something like this:

<body text="#000000" bgcolor="#FFFFFF" LINK="#000000" VLINK="#000000" ALINK="#000000" topmargin='0' leftmargin='0' marginheight="0" marginwidth="0" onLoad="onLoadLayout();" dir="<%=getString("TextDirection", currentLocale)%>">

<wi:Welcome runat="server"/>
<wi:MessageCenter runat="server"/>
<wi:Toolbar runat="server"/>
<asp:PlaceHolder id="ViewPlaceHolder" runat="server" />

</body>

This produces a “bare bones” Web Interface page.  Check it out:

Click to enlarge
Click to enlarge

If you would like a copy of this “bare bones” layout.ascx file, you can download it below:

layout_40.zip (for Web Interface 4.0)

layout_42.zip (for Web Interface 4.2)

layout_46.zip (for Web Interface 4.6)

Giving layout.ascx a facelift
Now, start adding your markup to the layout.ascx file and place the above mentioned tags where you want. If you want to modify text and color properties of the application links, the easiest place to do that would be the style.inc file located in the same place as the layout.ascx file. You can use this same technique for the layout.ascx file located at path_to_your_wi_site\auth\include to customize the login page.

Note: if you need to grab the username and password of the authenticated user, check out this article for instructions on how to do it.

Using the method described in this article, I made Citrix Web Interface look and feel like Microsoft SharePoint Portal Server 2003. Check it out below:

Citrix Web Interface with a Microsoft SharePoint look and feel
Click to enlarge

You may ask yourself, “Why would I ever want to do this?”.  Well, in this case the company was migrating from a custom written Intranet portal to Microsoft Office SharePoint Portal Server 2003 at the same time they were migrating from Citrix MetaFrame XP to Citrix Presentation Server 4.0.  The SharePoint migration would take place after the PS4 migration.  So, to minimize end-user impact, the custom portal was replaced with this SharePoint “fake-out”.  When the portal migration was ready, the front end never really looked that different to the end user, but the back end was vastly different.

If you would like a copy of the templates I used to make Web Interface look and feel like SharePoint, you can download them here

.

24 thoughts on “Super Easy Customization of Citrix Web Interface 4.x

  1. age_embedded.js
    Event Type: Error
    Event Source: Web Interface at c:\inetpub\wwwroot\Citrix\MetaFrame
    Event Category: None
    Event ID: 0
    Date: 10/12/2006
    Time: 10:11:25 AM
    User: N/A
    Computer: WIN2K3R2
    Description:
    A critical server error has occurred: System.Web.HttpParseException: Parser Error: Could not find file “c:\inetpub\wwwroot\Citrix\MetaFrame\site\clientscripts\age_embedded.js”. —> System.IO.FileNotFoundException: Could not find file “c:\inetpub\wwwroot\Citrix\MetaFrame\site\clientscripts\age_embedded.js”.–File name: “c:\inetpub\wwwroot\Citrix\MetaFrame\site\clientscripts\age_embedded.js”– at System.IO.__Error.WinIOError(Int32 errorCode, String str)– at System.IO.FileStream..ctor(String path, FileMode mode, FileAccess access, FileShare share, Int32 bufferSize, Boolean useAsync, String msgPath, Boolean bFromProxy)– at System.IO.FileStream..ctor(String path, FileMode mode, FileAccess access, FileShare share, Int32 bufferSize)– at System.IO.StreamReader..ctor(String path, Encoding encoding, Boolean detectEncodingFromByteOrderMarks, Int32 bufferSize)– at System.Web.UI.Util.ReaderFromFile(String filename, HttpContext context, String configPath)– at System.Web.UI.TemplateParser.ParseFile(String filename, String virtualPath)– at System.Web.UI.TemplateParser.ProcessServerInclude(Match match)– at System.Web.UI.TemplateParser.ParseStringInternal(String text)– at System.Web.UI.TemplateParser.ParseString(String text, String virtualPath, String basePhysicalDir)– — End of inner exception stack trace —– at System.Web.UI.TemplateParser.ParseString(String text, String virtualPath, String basePhysicalDir)– at System.Web.UI.TemplateParser.ParseFile(String filename, String virtualPath)– at System.Web.UI.TemplateParser.Parse()– at System.Web.UI.TemplateParser.GetParserCacheItemThroughCompilation()– at System.Web.UI.TemplateParser.GetParserCacheItemInternal(Boolean fCreateIfNotFound)– at System.Web.UI.TemplateParser.GetParserCacheItemWithNewConfigPath()– at System.Web.UI.TemplateControlParser.GetReferencedType(TemplateControlParser parser, String virtualPath)– at System.Web.UI.TemplateControlParser.GetUserControlType(String virtualPath)– at System.Web.UI.TemplateControlParser.ProcessDirective(String directiveName, IDictionary directive)– at System.Web.UI.TemplateParser.ParseStringInternal(String text)– at System.Web.UI.TemplateParser.ParseString(String text, String virtualPath, String basePhysicalDir) [Log ID: e94b36ca]

    For more information, see Help and Support Center at http://go.microsoft.com/fwlink/events.asp.

  2. HI,

    How do i add my outlook webmail (OWA) Link into “Welcome” Area or “Message Center” Area which page i need to edit

  3. Is there any limitation for WI customization.Is it possible for adding a Enduser computing policy on the WI.whixh will only appear at the intil time of the user log in and wont appear on the later ones.

  4. Hi,

    I need to add an additional field in addition to user name & password and name the third field as company. When i select login button user name and company field should get concordnate and it should be authenticated as username.companyname please let me know ehich file i should edit to perform this action.

  5. I’ve tried using .jpg files and they simply don’t work, is there a reason for this, or workaround ?

    I’m trying to match it in with Corporate branding and have come up with a design that looks terrible as a GIF (256 colours).

    Any ideas ?

  6. I’m working with Citrix Web Interface 4.6 and am wondering if this works with it or if there are some things I should look out for prior to starting. I’ll post again when I get it to work…

  7. This doesn’t work with WI 4.5 or 4.6. I think the paths need to be updated in a way or another because two folders have been introduced app_code and app_data.

  8. Navigate to: %systemdrive%\Inetpub\wwwroot\Citrix\YourDirectory\app_data\include

    Open lowStyle.inc

    .navBar,
    .navUsefulLinks,
    .navLogoutArea
    {
    visibility: hidden;
    margin: < %=wiContext.getString("LGVertBigGap")%> 0 0 0;
    padding: < %=wiContext.getString("LGVertBigGap")%> 0 < %=wiContext.getString("LGVertBigGap")%> 0;
    border-top: 1px solid #CDCDCD;
    }

    you will be adding the visibility: hidden;

    This is if in fact you are using low style. If not you must edit the other style files

  9. Hi,

    I want to launch application automatically once user logs in citrix server successfully. I am using WI 4.0. Please let me know your suggestions.

    Thanks in Advancec,
    Venkatesh.

  10. I want to include weblink into a citrix web server interface such that when user log in they will be able to see linl=ks to certain pdf files…….please help

  11. We are using 4.52. Is there a sample layout.ascx file for this version? I tried v4.0, 4.2, and 4.6 and each version breaks our Citrix.

  12. “There are several resources out there explaining how to customize, or brand, Citrix Web Interface.”

    Perhapse you would be so kind as to mention where these resources can be found.

Leave a Reply

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