Smooth Publish Using JQuery and EPiServer Quick Publishing
One of the new features in EPiServer CMS 6 is Quick Publishing (previously called Content Guides). This is a great way of letting users create and publish content without touching edit mode. To read more about Quick Publishing, see the ‘Let Those Users in’ section in this article.
I wanted to take this one step further, I wanted certain users to be able to create and edit pages directly from view mode (i.e. “hide” edit mode from the user). At the same time I wanted to avoid coding a custom “create view”, but instead use built in EPiServer edit templates.
Using the JQuery ColorBox Plugin together with Quick Publishing gave me a the result I was looking for (I’ll explain in detail how it works below).
How does it work?
First you need to configure the page guides:
For more information on Quick Publishing configuration visit this document.
I added two links at the top of the Personal Blog Start Page Template (only visible on the user’s own blog start page) – one for editing the current page and one for creating a new Blog post.
Where the “NewBlogUrl” property would return
A quick explanation of the query parameters:
parent: the parent page of the new page,
mode: set to ‘pageguide’,
guideName: set to the name of the guide (from config above),
pageGuideStartUrl: the url to load when guide is finished (user publish page or presses ‘Cancel’).
(The “EditUrl” is very similar, except for the id parameter replacing the parent parameter).
Next step is to active the light box functionality on these links:
See http://colorpowered.com/colorbox/ to learn about different colorbox options, view example code and download necessary files.
Hiding the right click menu
As I mentioned in the start of this post, I wanted to “hide” edit mode for a certain group of users, i.e. I wanted to remove the right click menu. I solved this by creating a custom base template class (which all templates inherits from), and adding the following code to the template’s OnInit() method:
- Remember to give the necessary access to users in question– since where using EditPanel.aspx inside EPiServer UI, they need access to edit mode (location setting in web.config). And off course, they need necessary access to the EPiServer page tree as well.
Thanks to Stein-Viggo Grenersen for creating the video!