One day I was working on a page that had way too many Content Editor section opened, plus those plenty coming out from Standard fields also added frustration. I thought it would be great to have Collapse All button implemented, that closes all the sections in order to help navigation.
I went checking the way Content Editor works this out and later wrote a JavaScript snippet, that implements and wires desired functionality. I also added Expand All button bringing the reverse behavior. Here's the code:
scContentEditor.prototype.onDomReady = function (evt) {
this.addCollapser(window.jQuery || window.$sc);
};
scContentEditor.prototype.addCollapser = function ($) {
$ = $ || window.jQuery || window.$sc;
if (!$) { return; }
$('#EditorTabs').append("<style>.toggler { border: 1px solid #bdbdbd; box-shadow: 0 1px #ffffff inset; cursor: pointer; height: 35px; margin: 16px 1px 0; }</style>");
$('#EditorTabs').append("<button id='expander' class='toggler'>Expand all</button><button id='collapser' class='toggler'>Collapse all</button>");
$('#EditorTabs').on("click", "#collapser", function () {
$('.scEditorSectionCaptionExpanded').each(function () {
var script = $(this).attr("onclick");
eval(script);
});
return false;
});
$('#EditorTabs').on("click", "#expander", function () {
$('.scEditorSectionCaptionCollapsed').each(function () {
var script = $(this).attr("onclick");
eval(script);
});
return false;
});
};
All you need to do is to append to the bottom of <your_web_root>\sitecore\shell\Applications\Content Manager\Content Editor.js
and that's it!
For those like me who like automation, I am attaching this JavaScript file, right click this link and save it, and then use PowerShell:
$file2 = Get-Content "ExpanderCollapser.js"
Add-Content "C:\inetpub\wwwroot\<YOUR_WEB_ROOT>\sitecore\shell\Applications\Content Manager\Content Editor.js" $file2
Once done, you'll see the result in Content:
There is also package available for download (compatible with Sitecore 9.0.* - 9.2)