.Kirkegaard: November 2015

I recently had a costumer, who wanted the Content Tree to be displayed by default in the Content Editor when editing an item through the Content Editor opened via Page Editor.

The following screen dumps will explain it…

Is it clear now?! :-)

Sitecore uses the “Content Editor.js” located at “/Sitecore/shell/Applications/Content Manager” when managing the behavior of the content editor. More specifically, it is the function “scContentEditor.prototype.initializeTree”, we should enhance.

The functionality of the javascript varies slightly from version 6 and 7-8 in how to display the Content Tree Panel.

Sitecore v7 – v8.1:

scContentEditor.prototype.initializeTree = function () {
    var ctl = scForm.browser.getControl("ContentTreePanel");

    if (ctl != null) {
        var visible = (scForm.getCookie("scContentEditorFolders") != "0") && (window.location.href.indexOf("mo=preview") < 0) && (window.location.href.indexOf("mo=mini") < 0) && (window.location.href.indexOf("mo=popup") < 0) || (window.location.href.indexOf("mo=template") >= 0);

        ctl.style.display = visible ? "" : "none";
    }
}

A slidely different in Sitecore v6:

scContentEditor.prototype.initializeTree = function () {
    var ctl = scForm.browser.getControl("ContentTreePanel");

    if (ctl != null) {
        var visible = (scForm.getCookie("scContentEditorFolders") != "0") && (window.location.href.indexOf("mo=preview") < 0) && (window.location.href.indexOf("mo=mini") < 0) && (window.location.href.indexOf("mo=popup") < 0) || (window.location.href.indexOf("mo=template") >= 0);

        ctl.style.display = visible ? "" : "none";

        var width = scForm.getCookie("scContentEditorFoldersWidth");

        if (width != null && width != "") {
            ctl.style.width = width;
        }
    }
}

What we want to do, is to make sure that the “var visible” is true, if the the Content Editor is opened through the Page Editor. When the Content Editor opens through the Page Editor, Sitecore adds the query string “sc_ce=1” to the URL.

So, let us extend the function above with this “|| (window.location.href.indexOf("sc_ce=1")”. Ending up with a javascript as following:

scContentEditor.prototype.initializeTree = function () {
    var ctl = scForm.browser.getControl("ContentTreePanel");

    if (ctl != null) {
        var visible = (scForm.getCookie("scContentEditorFolders") != "0") && (window.location.href.indexOf("mo=preview") < 0) && (window.location.href.indexOf("mo=mini") < 0) && (window.location.href.indexOf("mo=popup") < 0) || (window.location.href.indexOf("mo=template") >= 0) || (window.location.href.indexOf("sc_ce=1"));

        ctl.style.display = visible ? "" : "none";
    }
}

Sure, best practice is not to add the statement into the javascript, which Sitecore use. Instead, we should add the extended function into a separate javascript and enhance the Content Editor with the separated javascript. How do we add the javascript to the Content Editor?

Sitecore allow us to hook into the renderContentEditor pipeline to add controls into the head section of the standard Content Editor. This is exactly what we want to do.

using System;
using System.Web.UI;
using Sitecore.Diagnostics;
using Sitecore.Pipelines;
 
namespace MySitecoreExtensions.Pipelines.ContentEditor
{
    public class AddScripts
    {
        public void Process(PipelineArgs args)
        {
            Sitecore.Context.Page.Page.Header.Controls.Add((Control)new LiteralControl(scriptTag.FormatWith("/MySitecoreExtensions/Content Editor/Javascripts/ShowTreeView.js"))));
        }
    }
}

Finally, we add the a new processor into the renderContentEditor pipeline :

<configuration xmlns:patch="http://www.sitecore.net/xmlconfig/">
    <sitecore>
        <pipelines>

<!-- render script to display content tree in page editor - Render content mode -->
            <renderContentEditor>
              <processor type="MySitecoreExtensions.Pipelines.ContentEditor.AddScripts, MySitecoreExtensions" patch:before="processor[@type='Sitecore.Shell.Applications.ContentEditor.Pipelines.RenderContentEditor.RenderSkinedContentEditor, Sitecore.Client']" />
            </renderContentEditor>
        </pipelines>
    </sitecore>
</configuration>

In Sitecore version 8.1 Sitecore has added the Preview.ResolveSite as a standard config setting. Previously, it was a hotfix ever since the initial release from Sitecore v. 6.6.0 up to Sitecore v. 8.0 https://kb.sitecore.net/articles/382913.

It is now a part of the standard settings, though it is set not to resolve site by default…

<!--  PREVIEW - RESOLVE SITE
  If false, the Preview.DefaultSite setting specifies the context site to use when a user previews an item.
  If true, when a user previews an item, Sitecore tries to resolve the root item and the context site based on the current content language
            and the path to the item. If Sitecore cannot resolve the context site, it uses the site that is specified in the Preview.DefaultSite setting.
            Default value: false (use the value of the Preview.DefaultSite setting)
      -->
    <setting name="Preview.ResolveSite" value="false"></setting>

.Kirkegaard

Sitecore Extend Content Editor.js

Sitecore Preview.ResolveSite