Page Editor Commands

Page Editor Commands

Page Editor Commands

  • Located in the commands.config file with the prefix webedit
  • Implemented by the ribbons, buttons, and menus in the Page Editor
    • Configuration informaion is stored in the core database
    • Path is /sitecore/content/Applications/WebEdit
  • Based on templates located under/sitecore/templates/System/WebEdit
  • Can be added to a number of Page Editor components
    • Placeholders
    • Renderings
    • Fields
    • Markup elements

Custom Page Editor Commands

  • Create a class that inherits from the Sitecore.Shell.Applications.WebEdit.Commands.WebEditCommand class
  • Create a corresponding entry to the /App_Config/commands.config file
  • Use the System/WebEdit/WebEdit Button data template to add a button definition item under the /Sitecore/Content/Applications/WebEdit/Custom Experience Buttons item in the Core database
  • Processed by the getChromeData pipeline defined in the web.config file

Custom Page Editor Command Options

  • Adding a new command for a field, rendering, or placeholder
    • Create a class that inherits from the Sitecore.Shell.Applications.WebEdit.Commands.WebEditCommand class
    • Create a corresponding entry to the /App_Config/commands.config file
    • Go to the Core database and open the Content Editor
    • Add a button definition item using the System/WebEdit/WebEdit Button data template
    • Add the button under the /Sitecore/Content/Applications/WebEdit/Custom Experience Buttons item
  • Adding commands to the floating toolbars of all controls
    • Go to the Core database and open the Content Editor
    • Use the System/WebEdit/WebEdit Button data template to create a new definition item
    • Create the item under /Sitecore/Content/Applications/WebEdit/Default Rendering Buttons
  • Adding a command for an individual control
    • Go to the Master database and open the Content Editor
    • Select the Control definition item under layouts in the Content Tree
    • Select buttons in the Page Editor Buttons field in the Editor Options section
  • Adding a command to the floating toolbars of all placeholders
    • Go to the Core database and open the Content Editor
    • Use the System/WebEdit/WebEdit Button data template to create a new definition item
    • Create the item under /Sitecore/Content/Applications/WebEdit/Default Placeholder Buttons
  • Adding commands for an individual field
    • Go to the Master database and open the Template Manager
    • Select buttons in the Page Editor Buttons field in the Data section of the field definition item
  • Adding commands for all fields
    • Go to the Core database and open the Content Editor
    • Add a button definition item using the System/WebEdit/WebEdit Button data template
    • Add the button under the /Sitecore/Content/Applications/Common Field Buttons item

Viewing Page Editor Commands

  • Rename the webedit.css file at the root of a Sitecore site on a test system
    • The Page Editor Commands will be revealed when you open the Page Editor
  • Activate firebug, select ‘inspect element’, and click a Page Editor command
    • Firebug will display the Page Editor Command attached to the command click
    • The command may be wrapped in a Sitecore form post JavaScript method
    • {"click":"javascript:Sitecore.PageModes.PageEditor.postRequest('webedit:componentoptions(...')
  • Go to /sitecore/content/Applications/WebEdit/Default Rendering Buttons in the Core database
    • View the click field setting for one of the child items of type WebEdit Button
    • Open the /App_Config/Commands.config file to view the type string associated with the command
    • Use Reflector to view the properties and methods of the class defined by the type string

Sources