Using Dynamic Placeholders with Sitecore MVC 8.2

Why Dynamic Placeholders

When architecting a website using Sitecore one potential issue that can arise is Sitecore’s inability to handle multiple placeholders with the same name. If you have a complicated page that uses a sublayout multiple times, and that sublayout has a placeholder, there’s no simple way to give that placeholder a unique name for each identical sublayout. Thankfully Sitecore Experienced! has created a powerful third-party package for Sitecore called “Integrated Dynamic Placeholders” which can help us.

For some context: I have been working on a “One Page” website using sitecore. This webpage has multiple sections which all have the same basic structure: One banner at the top as a separator/title for the section and the section’s content. To make things modular I have a basic sublayout which contains two placeholders, one at the top and one at the bottom. 

Note:  I am using “Page” to refer to each section of the One Page, as in a normal site each section would correspond to an individual page.

BanneredPage.aspx

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="BanneredPage.ascx.cs" Inherits="TSC.layouts.Pages.BanneredPage" %>
<%@ Register TagPrefix="sc" Namespace="Sitecore.Web.UI.WebControls" Assembly="Sitecore.Kernel" %>

<div id="<sc:Text runat="server" ID="PageID" Field="Page Name" />">

    <div class="<sc:Text runat="server" ID="BannerClass" Field="Banner Class" />">
       <sc:Placeholder runat="server" Key="Banner Content" />
    </div>

    <sc:Placeholder runat="server" Key="Page Content" />
</div>

Seems as I will be using this sublayout multiple times in a single placeholder, the problem should be clear. I will have multiple placeholders all using the key “Banner Content” and “Page Content”.

Installation

In theory, you should be able to just add Dynamic Placeholders to your project by simply installing the NuGet Package:

	PM> Install-Package DynamicPlaceholders

However, in my case this failed to add two critical .dll files to my project: 

• SitecoreExperienced.Pipelines.GetPlaceholderRendering.dll
• SitecoreExperienced.SitecoreControls.dll

To get these, I had to go to https://marketplace.sitecore.net/en/Modules/I/Integrated_Dynamic_Placeholders.aspx, download the package manually and install it into the website using the Sitecore interface. After that I simply had to navigate to the bin of the website: C:/inetpub/wwwroot/_sitename_/Website/bin and find the specified files, then copy them into the bin on my project.

Next, go into your project’s references and add both .dll files

Usage

Using dynamic placeholders is a fairly straightforward process, all you need to do is slightly modify the files you want to use them in like so:

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="BanneredPage.ascx.cs" Inherits="TSC.layouts.Pages.BanneredPage" %>
<%@ Register Assembly="SitecoreExperienced.SitecoreControls"
Namespace="SitecoreExperienced.SitecoreControls" TagPrefix="scexp" %>
<div id="<sc:Text runat="server" ID="PageID" Field="Page Name" />">

    <div class="<sc:Text runat="server" ID="BannerClass" Field="Banner Class" />">
       <scexp:WFDynamicPlaceholder runat="server" Key="Banner Content" />
    </div>

    <scexp:WFDynamicPlaceholder runat="server" Key="Page Content" />
</div>

Note the placeholder tag is no longer sc:Placeholder but scexp:WFDynamicPlaceholder and the Assembly, Namespace and TagPrefix values are all changed.

Now, when your website creates placeholders using this sublayout, it will be modifying the name for each subsequent placeholder. To set the string for modification, go to Website/App_Config/Include/DynamicPlaceholders/DynamicPlaceholders.config and add:Now, when your website creates placeholders using this sublayout, it will be modifying the name for each subsequent placeholder. To set the string for modification, go to Website/App_Config/Include/DynamicPlaceholders/DynamicPlaceholders.config and add:

<settings>
      <setting name="DynamicPlaceholderPattern" value="XXXXXX" />
</settings>

Within the <sitecore> tag, where XXXXXX is the string you want Dynamic Placeholders to use to produce variable placeholder names like so:

• Banner Content
• Banner ContentXXXXXX1
• Banner ContentXXXXXX2
• Banner ContentXXXXXX3
• Etc...

Now you can individually specify which placeholder a sublayout should be in, while still using the same parent sublayout repeatedly.

Note for Sitecore Rocks users: Rocks does NOT seem to detect this correctly, so you will have to manually type names in. Using the dropdown to find the placeholder will simply show multiple placeholders with the same name.