Belangrijke mededeling over deze pagina:

Deze pagina is niet beschikbaar in het Nederlands en daarom wordt de Engelse versie van het artikel getoond. Dit komt vooral voor bij technische artikelen.

Yesterday I tweeted a screenshot showing the Page Editor embedded in the Content Editor.
I was going to share this solution after I was done building our new website (which this script is part of), but the response has been so positive that I figured I have to share this right away.


I got this idea when I got to work with EPiServer during a project.
EPiServer is one of Sitecore's competitors and very similar, but of course has some other features and solved some things in another way than Sitecore did.
My idea is to take all the good things from EPiServer and introduce them to Sitecore as separate modules.

One of these modules is the Embedded Page Editor; when you edit an item in the Content Editor, instead of displaying the content tab, I display a new tab that contains the Page Editor view for that item.
Hopefully, this motivates the user to edit the page using the Page Editor instead of the content editor because I believe this really is a much more pleasant way of managing your website.
I notice that a lot of users don't even know the Page Editor exists, let alone how it could make their content editing experience a lot easier.

Embedding the Page Editor was a ridiculously easy thing to do and I only needed to make a few code ninja moves to make it work properly in Internet Explorer and FireFox.
Instead of writing the code in a code-behind file, I decided to create a plain ASPX file so that anyone can install it in their Sitecore instance and modify if they want, without the need for Visual Studio.

The code is shared on GitHub so that you will always have the latest version, should I decide to modify something.
Grab it here: https://github.com/ParTech/Embedded-Page-Editor

For easy installation, I also added a Sitecore installation package: https://github.com/ParTech/Embedded-Page-Editor/raw/master/ParTech.Embedded-Page-Editor.zip

As for how to install it, just follow these steps (which are also mentioned in the readme file on GitHub):

1) Add the PageEditor.aspx file to your webroot in the folder /sitecore/shell/Custom

2) Create a new Editor in Sitecore using the following steps:

  • Open the Content Editor
  • Switch to the Core database
  • Select the item /sitecore/content/Applications/Content Editor/Editors
  • Insert a new folder called Custom
  • In that folder, insert a new item called Page Editor from the template Sitecore Client/Content editor/Editor
  • In the Url field, enter this URL: /sitecore/shell/custom/pageeditor.aspx
  • Choose an appropiate icon
  • Check the Refresh On Show checkbox

3) Now you have added a new Editor, let's configure some templates to use it:

  • Open the Standard Values item for the template for which you want the embedded Page Editor to be enabled.
    Side note: I advised you to use proper inheritance so that all page templates inherit from one base template. Then you only have to configure the editor for that one template.
  • Make sure that the Standard Fields checkbox in the View ribbon is enabled
  • Locate the Editors field in the Appearance section and add the newly created Page Editor editor there
  • Save the Standard Values and you're good to go!

The Page Editor is now embedded in the Content Editor for all the items that were made using the templates for which you just configured it.

In the next few weeks, I expect to come up with more of these small improvements that I picked up from other Content Management Systems and that I feel are missing in Sitecore.
If you have any suggestions in this regard, please let me know! I would really like to get input on this.

Enjoy!

3 Reacties

  • Door Ben Warbrooke op 11/20/2013 om 1:55 AM

    Very cool idea. I'm really keen to get this working in my SC 6.5 project. After installing the package and setting it up however the Page Editor throws javascript errors - in particular in places where it seems to call window.top eg. add component dialog. Also when I press the save button the entire Sitecore shell refreshes and I end up back at the desktop as if I've just logged in.

    Did you come across this behaviour at all or have any ideas about why the embedded Page Editor would be doing this? All the Page Editor funcionality works as expected when not embedded.

  • Door Ruud van Falier op 4/19/2013 om 11:10 AM

    Hi Nico,

    Thanks! Unfortunately, the custom tabs being displayed before the Content tab is hard-coded by Sitecore... If you can contact Sitecore support and ask them for Sitecore.Support.339051.dll you will get a custom build of the class that is involved in rendering those tabs and the custom tabs will always be rendered after the Content tabs. There is no other way at the moment.

    Good luck!

  • Door Nico Lubbers op 4/15/2013 om 9:23 AM

    Great package! I have a small question. Is it possible to change the order of the tabs? Now the order is Page Editor - Content, but I would like to have Content - Page Editor
    Cheers, Nico

Plaats een reactie