...
The standard interface of Visual Page Editing shows two main sections. Most of the screen is occupied by a preview of the page with the well-known green bars marking the editable paragraphs. A newly introduced toolbox on the right of the screen presents all actions and edit options applicable to the currently selected item or the page as a whole. The toolbox improves the overall visibility of actions and edit options by providing them with both a clear location on screen and enough space to present their interface. It introduces flexibility and scalability to support current and future modules wishing to add complementary functions to page editing.
The new visual page editing is still targeting mouse input, but has also been crafted with touch devices in mind. While you can use this interface with a keyboard, Page Structure Editing has been specifically optimized for keyboard input and thus should be the preferred way to edit a page using keys only.
...
- it shows all applicable actions available to the logged-in user and defined on the currently selected paragraph, selected area or on the page ifself
- it hosts a set of edit options of the currently selected element to e.g. select a specific version or language of a page
- it offers access to global functions such as undo/redo and copy & pasteit hosts a set of options of the currently selected paragraph, selected area or the page itself
- it contains a small panel denoting the name of the instance as well as the logged-in user
- it provides more flexibility and scalability for actions and edit options
- it shows notifications and provides access to the list of system messages
The toolbox replaces the edit bar dedicated to the page, which was shown at the top in preview-based editing in earlier Magnolia versions. The page properties are accessed using a regular page action. Page Page edit options like a language selector or information on page links have been extended and moved to the edit options rack. The button to return to AdminCentral has been replaced with a button in the Toolbox to leave page editing, which is also where the "Preview" button was moved to. Anchor
The target selector solves the problem that showing both paragraph and page actions at the same time results in a long list of actions with similar sounding, but different commands. It also focuses the interface to the content element you're working with.Note that while this concept may sound complicated, its day-to-day use actually isn't. If you select a paragraph on the page, the target selector is automatically switched to "paragraph". The same holds if you select an area. If you deselect any element or when you enter the page, the target selector is set to "page". The only time you have to manually switch it is when you've selected a paragraph, but would like to switch back to work on page level to e.g. activate the pageThe page edit bar still exists and has been extended to also show a quick page status. Other than that, it merely provides access to the page properties.
Racks and Units
A rack is basically an enclosure for mounting multiple UI modules. In Magnolia 5, a rack is a container for a basically arbitrary (but usually small) number of units. Each unit collects a number of UI elements logically and semantically belonging together, such as a language selector or an element representing the translation status of the current page.
...
- to offer a great overview of various aspects of a content element while keeping the interface simple
- to provide a scalable UI solution for adding functionality to pages, areas and paragraphs contributed by modules or future extensions
Actions and
...
Edit options rack
The default configuration offers at most two racks: one for showing the list of actions applicable to the currently selected content element, one for showing edit options on the same. In both racks, the ubiquitous toolbar unit is available as well.
| Anchor | ||||
|---|---|---|---|---|
|
Currently, only page edit options are defined, but they may become available for paragraphs and areas as well if the should a need arisesarise.
More space in a rack
If many actions or edit options have to be shown and the space for showing them is not available (e.g. on small screens), the rack may virtually split and offer more than one page effectively multiplying the space available for units. The rack then shows a page switcher control for accessing all pages. Note that the control shows up above the toolbar unit, which remains visible on all pages of all racks.
...
If a user chooses to show the page edit options, then moves to a different page, the page edit options of that page are displayed as well - the unit selection is sticky. The same holds true if a user expands a particular unit to show a specific aspect of the page. By surfing to a different page, he gets the same aspect of the page he just surfed to.
...
Appearance and functionality of the toolbar rack will be as close as possible to shall be reminiscent of the part of the toolbar offering global functions in AdminCentral.