asp.net
asp.net Page Templates
by Mike Borromeo
What?
A website templating system is a small collection the page templates that contain and control any non page specific (redund Ant) Code and HTML.
Who ?
This is applies to anyone looking for a flexible the method for implementing page templates in asp.net. Readers new to templates would find them invaluable. Readers trained in the template arts but looking for a better implementation already know the value of templates and Hopef Ully'll find the methods described this is useful for their specific situation (if I ' d like to hear from you, if so I ' d Also like to hear from you.
Why?
In a one page website page templates would is of little use, but as you start building 5+ page sites life starts to get Difficult sans templates. A designed templating system (and I emphasize OK designed) has the following benefits to name a few:more efficient and easier development through the elimination of redundant blocks of code, easier integration of designers and programme R through separation of HTML and Server-side script, and easier development of consistent user interface through forced re Use of UI code.
Where & When?
Me personally, I would use templates to any site that has the more than one page. And really there ' s no reason, so I suppose this ideas apply everywhere and all.
How ?
Ah how ... the fun part. Here we'll take a look at a example of a template and a page that employs the template. The entire collection of files you'll need along with a more advanced example are available for download.
So, are it difficult to understand or implement? In a word, no. In two words, heck No. If you can count to ten your can use templates. Ok, maybe that ' s a bit of the overstatement but nevertheless. You'll be templating, as it were, in no time. The ' s take a look at the a simple example of the a page that uses a template (a.k.a. A templated page).
<%@ Page language= "C #" codebehind= "Default.aspx.cs" inherits= "Example._default"%><%@ Register Tagprefix= "Example" tagname= "template" src= "/includes/template.ascx"%><example:template title= "Example" Page templating "id=" template runat= "Server" > <body> here lies the page Content. </body></example:template>
This is about as simple as a templated page gets. You are should have a vague idea what everything here means I ' ll but explain to the top. The Page directive isn ' t specific to this project so we won ' t detail it ' s meaning. The Register directive simply tells ASP.net that we ' re going to be using the template located. What ' s that for you say? User control? Why yes it is. The thinking in making a template a user control is this:you write C # in a C # editor and HTML in a HTML editor. Obvious? Maybe. But I ' ve seen templates proposed that are implemented as a-custom control (written in a-code editor, not a HTML editor). It's just easier to write HTML in the VS. NET HTML editor just as it's easier to write C # in the ' C #. NET editor and with U Ser controls we ' re allowed this luxury. Intellisense anyone? Could say sure, you can design the template in the HTML editor the convert it to C # rendered output but then enters th e Question of maintainability. No Designer I know wants to go in an edit a C # file and recompile the bloody Web application. Ok, now I ' m hearing something about speed concerns? Granted compiled code custom control code was faster than the equivalent user control code but it are said that caching Erases all your sins or were it cache is king, or maybe cache and thou shall to be saved. Whichever the case, by using a simple native caching techniques with asp.net you can eliminate many of the slowdowns by Dynamic pages. However, in the case where a page was generated uniquely for each view and also depending on the site load, speed could be th E prevailing factor for which custom control page templates is the answer. User control versus custom control concerns aside, let's move on to the beginning of the template tags "<example:templa Te> ". I should mention now that this example template is designed with simplicity in mind and customization should, nay, must b E performed by your reader inTem truly useful. What do I mean by customization? Take the title for example. You don ' t have to being a Burt Muston to realize the title, the template tag corresponds to the title tag in the Resulting HTML. Using our imagination-something else in addition to the title, perhaps the path to a cascading style she ET, or maybe the keywords for the "page", "would end" in the META tag. Go nuts with it. Use your imagination. I should say of course adding the type of customizations I just mentioned are as easy as proverbial pie and we'll go over Just such a change later. But Moving on We are the body tag. The body in this case is where the main content for the page goes. Note:don ' t confuse the body tag is here with the "traditional" pages. In previous version of, this system, the body tag was called main until I realized, Intellisense is fully functional whe n inside a body tag. At any rate, whatever your put on your body tags toThe template where you specify. In the spirit of customizations it should being said that has a body tag is simply a function of the needs of the page. So to example if each page needs a sidebar to navigation or whatnot you can add a sidebar tag this resides on the same l Evel as the body tag in the templated page and likewise can be put the contents of the sidebar where ever appropriate in the Template. Again, go nuts and use your imagination ... more examples to come.
Ok, so I ' ll bet you ' re saying Mike, I can handle this no problem. Good, because we ' re moving on to the template itself. I ' ll just put the entire template file here and we'll sort it all out afterwards.
<%@ control language= "C #" codebehind= "Template.ascx.cs" inherits= "HallofFame.Includes.Template"%>The attentive reader would notice that there are only three things to the-page special to any compared ordinary PA Ge. The <%=this. Title%> which lies naturally in the title tag (and I ' ll explain just to all this works later). Second, the block of server code this contains the function CreateChildControls which basically takes the body content sup Plied by the templated page and drops it right where the asp:placeholder is waiting. Which brings us to the third noteworthy bit of code and that's Asp:placeholder Which like we just mentioned is where T He body content goes.
How to does all this work? How does is the title and body content get transferred to the Template object, the user control, inherits from? To answer this lets take peek at the code behind and unmask the wizard.
Using system;using system.data;using system.drawing;using system.web;using system.web.ui;using System.web.ui.webcontrols;using System.web.ui.htmlcontrols;namespace halloffame.includes{ ///< Summary> /// the main template for this website. ///</summary> [parsechildren (true)] public abstract class Template:usercontrol, inamingcontainer { ///<summary> ///the main content template. ///</summary> private itemplate main; ///<summary > ///the name of the page. ///</summary> private string title; ///<summary> ///the main content template. ///</summary> public ITemplate Body & NBsP; { get {return this.main;} set {this.main = value;} } ///<summary> ///the name of the page. ///</summary> public string Title { get {return this.title;} set {this.title = value;} } web Form Designer generated code }
Looking at this code we have a couple of familiar faces, namely the body and title properties. And in the "World of" user controls this are how do you expose attributes. So Remembering example page we introduced near beginning which looked
<%@ Page language= "C #" codebehind= "Default.aspx.cs" inherits= "Example._default"%><%@ Register tagprefix= " Example "tagname=" template "src="/template.ascx "%><example:template title=" example of Page templating "id=" Template "runat=" server > <body> here lies the page content. </body></example:template>
We have the title is set as a template attribute and the ' body ' is set as a sub-tag. And now referring back to the code behind the template the "is of type ITemplate and" the title is of type string bring ing up some good questions. Do attributes have to be strings? No, they can is integers any other type asp.net can parse from a string. And what is the ITemplate type all about? It tells ASP.net that's body property would contain children objects. What is ParseChildren and why is it true? The ParseChildren C # attribute tells ASP.net that this class would be a container for child controls and those should to be PA Rsed as opposed to placing everything between the "start" and "end" tags in a LiteralControl object. How can I add more sections similar to the body section? Simply and easily. By just declaring a-member variable of the type ITemplate and exposing it via a. Basically copy and paste the body blocks and rename accordingly. Then in the Template.ascx file place a Asp:placeholderThe CreateChildControls function instantiate the new section in the Asp:placeholder. Pretty easy, no?
Conclusions
During the writing of this article I researched several other methods of doing page templates isn't only in asp.net but PHP and ASP. Both PHP and ASP have a few that have a large following and they really boil down to the same features to similar me ntioned above. But asp.net allows page templates to is implemented so they appear to be a native looking extension integrating seamlessly With VS. NET.
Available for download are all the files we discussed this and another more complicated example R controls inside the templated page body. The bear in mind however this examples are very simplified to make for easier digestion. They can and should be expanded and improved upon. If you are noticed any errors or misinformation please email me at mborromeo@phosl.com. If you are have a better or improved upon method of doing page templates in ASP.net I would to be hearing about it. and come again.
Download Asptemplates.zip
Tools Used
Visual Studio. NET and Windows Server running IIS 5.0 with ASP.net