Add multiple content placeholders in Master Page templates

Each C1 CMS template can have one or more content placeholders. Master Pages based templates are no exclusion. These placeholders create corresponding content areas for the page based on this template.

When editing a page, the user adds or edits content in one of these areas.

It takes a few steps to add a content placeholder in a Master Page template. You should:

1. Declare a public property of the XhtmlDocument type in your code file (.master.cs).
2. Add a Placeholder attribute to this property.
3. Render this property's value in the template's markup file (.master).

Declaring properties for placeholders

Within the class that inherits from MasterPagePageTemplate:

1. Declare a public property of the XhtmlDocument type.
2. Repeat Step 1 for as many placeholders as you need in your template.

public partial class ThreeColumns : MasterPagePageTemplate
{
    public XhtmlDocument Content { get; set; }

    public XhtmlDocument Aside { get; set; }

    public XhtmlDocument HeroUnit { get; set; }
}

Adding a Placeholder attribute

In order for a public property to be treated as a content placeholder, a Placeholder attribute must be added to it:

1. Add a Placeholder to the property that stands for a placeholder.
2. Set its parameters:
   • Id: Any unique string that can serve as the placeholder's ID. If not specified, the property's name will be used instead.
   • Title: A human-readable name of the placeholder. If not specified, the property's name will be used instead.
   • IsDefault: If 'true', the placeholder will be treated as default and pre-selected in the page editor. 'false' by default.

public partial class ThreeColumns : MasterPagePageTemplate
{
    [Placeholder(Id = "content", IsDefault = true)]
    public XhtmlDocument Content { get; set; }

    [Placeholder(Id = "aside")]
    public XhtmlDocument Aside { get; set; }

    [Placeholder(Id = "herounit")]
    public XhtmlDocument HeroUnit { get; set; }
}

Note. Only one placeholder can be set as default.

Rendering the property's value

You should render the placeholder's content entered in the page editor using the <c1:Render/> control. You should specify the name of the property in the Markup attribute.

<div class="row">
	<div class="span3">
		<c1:Render Markup="<%# HeroUnit %>" runat="server"></c1:Render>
	</div>
	<div class="span5">
		<c1:Render Markup="<%# Content %>" runat="server"></c1:Render>
	</div>
	<div class="span4">
		<c1:Render Markup="<%# Aside %>" runat="server"></c1:Render>
	</div>
</div>