Understanding Umbraco Templates

Understanding Umbraco Templates

Getting to Grips with Umbraco Templates (.Net master pages)

Umbraco Templates are the glue that pull together and define how content is going to be presented to visitors.  Under the properties tab, Umbraco Documents select the template to be used (restricted to the list defined for their Document Type).  When the page is requested, the selected Template combines content from the document (web page) being called, along with other sources of content (e.g. macros or other child documents) and renders the page.

It is perfectly possible to have a flat set of templates, all driving different pages of the site, however, to maintain a consistent feel, a lot of copying and pasting would be required.  The simplest of change like a navigation update (hard coded) or a simple include of a new site wide stylesheet would require updating each template individually.

To allow a maintainable site, Templates can be nested.  This means that some content is defined at the highest level, a little more at the next level etc etc.  An example of this would be to define your header and bottom of your page (logo, navigation, legal links etc) at the highest level, then have a number of different Templates for different types of pages at the next level.

 

Umbraco Templates

 

Template Content and Contentplaceholder Tags

So we now know that Templates pull the content together and that you use nested templates to build up your page.  Now we answer how.

Contentplaceholder (<asp:contentplaceholder) tags define areas of a master page / template were you would like content defining in the child template and Content (<asp:content) tags define the content in the child master page for it's parent.

e.g.

level 1 master page:

...

...

<asp:contentplaceholder id="IWantContent" runat="server"></asp:contentplaceholder>

...

...

 

level 2 child master page:

...

...

<asp:content contentplaceholderid="IWantContent" runat="server">

This is my content

</asp:content>

...

...

 

It is worth noting that the child page does not have to define content for a place holder in it's parent, so it is safe to put a place holder their if you suspect their may be call for it later.

It is also worth knowing that you can put default content in the place holder which will be used if not defined in it's child.

This may be useful in scenarios which you normally output one thing, but on a couple of pages you would like to do something a little different.

e.g.

master page:

...

...

<asp:contentplaceholder id="IWantContent" runat="server">

This is content which will be output unless overridden in one of my children.

</asp:contentplaceholder>

...

...

 

To see an example of breaking down someone else's Template (e.g. when you have installed a 3rd part Umbraco package), see our Integrating uBlogsy Templates article.

 

Regards,

Richard

Written by Richard Bowers at 22:30
Tags :

2 Comments :

Jo said...
This is pretty lousy example. Your spelling is horrid as well.
July 2, 2012 05:52
Admin Richard Bowers (author) said...
Hello Jo,

This article was written to provide foundations for a series of uBlogsy articles and I hope these and other readers find the information useful.

We are however, always looking to improve, so we welcome any constructive criticism, or suggestions for improvement / expansion.

Richard
July 4, 2012 08:26

Comment

Comments closed

Try our Umbraco Hosting free for 3 months