Tags

3 min

You can apply tags to be used in the rendering selection. When a template is associated with a tag, then that template is used only when the calling context has a matching tag. You can also have different content areas render the same content differently using tags or display options. If you have active display channels for your content types, the ChannelName will act as a tag in the rendering selection.

In views, apply tags by using the epi-template-tag attribute on tag helpers, or by passing new { Tag = "..." } with HTML helpers. See Render properties with tag helpers for information about tag helper usage.

Register multiple templates example

Assume you have a model containing a teaser block with a heading and an image.

using EPiServer.Core;

namespace MyOptimizelySite.Models.Blocks {
  [ContentType]
  public class TeaserBlock: BlockData {
    public virtual string Heading {
      get;
      set;
    }
    public virtual ContentReference Image {
      get;
      set;
    }
  }
}

Add two sidebar templates (left and right) for displaying the block in the sidebar area of web pages with this.

Add a template for the standard block, part of the content model. The blocks are displayed in a content area of the start page for the website.

See Content templates for information regarding blocks. In this case, you register partial views without controllers, so use EPiServer.Web.Mvc.IViewTemplateModelRegistrator to register your templates. In the Business folder of your project, create a ViewTemplateModelRegistrator class inheriting from IViewTemplateModelRegistrator, and add the desired templates and tags.

The following code shows the template registration class using IViewTemplateModelRegistrator:

namespace MyOptimizelySite.Business {
  public class ViewTemplateModelRegistrator: IViewTemplateModelRegistrator {
    public void Register(TemplateModelCollection viewTemplateModelRegistrator) {
      viewTemplateModelRegistrator.Add(typeof (TeaserBlock),
        new EPiServer.DataAbstraction.TemplateModel() {
          Name = "SidebarTeaserRight",
            Description = "Displays a teaser for a page.",
            Path = "~/Views/Shared/SidebarTeaserBlockRight.cshtml",
            AvailableWithoutTag = true
        },
        new EPiServer.DataAbstraction.TemplateModel() {
          Name = "SidebarTeaserLeft",
            Description = "Displays a teaser for a page.",
            Path = "~/Views/Shared/SidebarTeaserBlockLeft.cshtml",
            Tags = new string[] {
              RenderingTags.Sidebar
            }
        });

      viewTemplateModelRegistrator.Add(typeof (StandardBlock),
        new EPiServer.DataAbstraction.TemplateModel() {
          Name = "SidebarTeaser",
            Description = "Displays a teaser of a page.",
            Path = "~/Views/Shared/StandardBlock.cshtml",
            Tags = new string[] {
              RenderingTags.Sidebar
            }
        });
    }
  }
}

The following code shows the SidebarTeaserBlockRight partial view for the teaser block (there is an identical SidebarTeaserBlockLeft for the left one):

@model MyOptimizelySite.Models.Blocks.TeaserBlock

<div>
  <h2 epi-property="@Model.Heading">@Model.Heading</h2>
  <img epi-property="@Model.Image" />
</div>

The following code shows the rendering view for the start page, where the blocks are displayed. The epi-template-tag attribute specifies the tag used for template selection:

@model MyOptimizelySite.Models.Pages.StartPage

<div epi-property="@Model.MainBody" />

<div epi-property="@Model.GeneralContentArea" epi-template-tag="Sidebar" />

How tagging is used in template selection:

If the AvailableWithoutTag attribute for a template is set to true, the template is applied regardless of whether the rendering context has a corresponding tag.

If the AvailableWithoutTag is set to false, or does not exist, the template is not applied unless the rendering context has a corresponding tag_._

In this scenario, the following happens:

The start page GeneralContentArea has the RenderingTags.Sidebar tag, which means that only templates with this tag are applied, and without the AvailableWithoutTag or where this is set to false.

The SidebarTeaserLeft template has a matching tag and AvailableWithoutTag set, and is applied. This is also valid for the template used for the Standard block.

The SidebarTeaserRight template has a matching tag, and AvailableWithoutTag = true. This template is applied even if the RenderingTags.Sidebar tag would be removed from the content area.