Patching the SCORE Wrappers

When using the page editor with BrainJocks SCORE installed, you have control over which components are "wrapped" with annotations. We refer to this as meta data wrappers.

Typically, we wrap components that are containers - meaning that they have their own nested placeholders, and they contain other renderings as children. This is not required functionality, but we find it helpful when using the page editor with atomic design.

The pipeline processor that performs this wrapping is defined in the file zzzBootstrapUI.Pipelines.config - in the App_Config/Includes folder of your instance:

<configuration xmlns:patch="http://www.sitecore.net/xmlconfig/">
  <sitecore>
    <pipelines>
      <mvc.renderRendering>
        <processor
          patch:after="processor[@type='Sitecore.Mvc.ExperienceEditor.Pipelines.Response.RenderRendering.AddWrapper, Sitecore.Mvc.ExperienceEditor']"
          type="Score.Custom.Pipelines.Editor.AddPageEditorMetadata, Score.Custom">

          <parentNamePatterns hint="list:AddParentNamePattern">
            <pattern>(Page Layout)|(Inner Structure)|(Stripes)|(Collections)|(Page Elements)|(Panels)</pattern>
          </parentNamePatterns>

          <itemNamePatterns hint="list:AddItemNamePattern">
            <pattern>(Mega Menu$)|(Mega Menu Navbar)|(Mega Menu Item$)|(Mega Menu Item with Link)|(Drop Down Link List)|(Menu List$)</pattern>
          </itemNamePatterns>

        </processor>
      </mvc.renderRendering>
    </pipelines>
  </sitecore>
</configuration>

As you can see, the processor contains two properties as lists - each item in the list is a regular expression.

parentNamePatterns - checks the immediate parent folder of the rendering against each pattern in the list. If any pattern matches, the rendering is wrapped.

itemNamePatterns - checks the name of the rendering itself against each regular expression in the list. If any pattern is matched, the rendering is wrapped.

How to Modify the Wrappers

Since this processor is installed as a patch file by the SCORE product, the file cannot be modified. If you wish to add new patterns (to wrap additional components) you can patch the patch and add more patterns.

<?xml version="1.0" encoding="utf-8"?>
<configuration xmlns:patch="http://www.sitecore.net/xmlconfig/" xmlns:set="http://www.sitecore.net/xmlconfig/set/">
  <sitecore>
    <pipelines>
      <mvc.renderRendering>
        <processor type="Score.Custom.Pipelines.Editor.AddPageEditorMetadata, Score.Custom">
          <parentNamePatterns hint="list:AddParentNamePattern">
            <pattern name="test">(test parent name)</pattern>
          </parentNamePatterns>
          <itemNamePatterns hint="list:AddItemNamePattern">
            <pattern name="test">(test rendering name)</pattern>
          </itemNamePatterns>
        </processor>
      </mvc.renderRendering>
    </pipelines>
  </sitecore>
</configuration>

This second patch file must load after the original patch that defines the processor.