Custom edit layouts
This documentation explains how to modify the layout of the inline edit mode, including adding and editing layout assets and applying them on either a system-wide basis (through the use of the layout manager) or by root node (through the Layouts screen of an asset).
The edit layout asset allows you to customize the layout of the fields in the inline edit mode.
Each edit layout you add can correspond to a screen for a particular asset type in the administration interface. For example, you can create an edit layout for the Details screen of a standard page, one for the Edit contents screen, and one for the Metadata screen.
A drop-down can then be added to each edit layout to allow the user to navigate between the screens in the inline edit mode. Alternatively, you can add all fields onto one edit layout so that they appear on one screen.
You can also create a different layout for different asset types. For example, you can use one layout for a standard page and a different layout for a backend user.
To do this:
Create two edit layouts.
Apply the layouts to the asset type in the layout manager.
Read the Creating and applying custom edit layouts documentation for more information.
Alternatively, if you were showing the same set of fields on each asset type, you can use one layout.
The Details screen allows you to change the name of the edit layout and configure the Cascade value flag option for metadata fields on the layout.
This section allows you to configure the editing layout options and how it presents editing form on the front end.
The available fields are:
This setting includes the core matrix JS files added in the <head> tag when in /_edit mode and the same files when used within an asset builder or account manager asset.
It also includes the inline onsubmit code for the
If you are using multiple create layouts on an asset builder page and any of the custom layouts have this field set to
So if you are using multiple layouts, all must have this field set to
Setting this to
- Include default matrix CSS
If set to
No, default matrix form CSS files will not be included in the inline edit mode layout output. This setting includes the core matrix CSS files added in the
<head>tag when in
/_editmode and the same files when used within an asset builder or account manager asset.
Setting this to
Nomight cause some matrix form functionality or layout not to work correctly unless you manually include these CSS files and styles.
- Show "Cascade metadata" field
This field allows you to turn off the Cascade value flag for any metadata fields displayed in the edit layout.
By default, the show Cascade metadata field option is not enabled, meaning that the Cascade value flag will be shown. If you do not want to show the flag on the screen, select this option.
The Edit contents screen allows you to add content to and configure the formatting of the edit layout.
This section provides you with a list of the keyword replacements used within the edit layout.
To view the list:
Click on the hyperlink a list of specific asset keywords available for use in inline edit mode. The simple edit keyword replacements pop-up will appear, as shown in the figure:
Select the type of asset you are using this layout for in the Select your asset type list.
Click the Get simple edit keywords button. The list of available keyword replacements for this asset type will appear on the screen, as shown in the figure:
Highlight the keyword replacement you want to use.
Copy it (Ctrl+C).
Paste it into the WYSIWYG editor on the Edit contents screen (Ctrl+V). Each keyword replacement listed corresponds to a screen, a screen section, or a field in the administration interface. If a screen, a section, or a field is not listed, it cannot be displayed within the inline edit mode.
This section allows you to format the information the show in the edit layout. The contents section of the Edit contents screen is shown in the figure:
You can use keyword replacements in conjunction with text, images, and links to layout what to show in the inline edit mode. For example, you might want to include instructions on how to fill out metadata fields or apply for approval.
Along with the keyword replacements that are shown in the simple keyword replacements pop up, there are several other keyword replacements that you can use within the layout.
These keyword replacements are available in the
– Select keyword – drop-down list in the WYSIWYG editor toolbar and are as follows:
- Screen menu
This will show the list of screens the user can access for the asset in the inline edit mode. If you have created different edit layouts for each screen, then you need to include this keyword replacement so the user can navigate between them.
- Save button
This will show the Save button on the screen. This keyword replacement needs to be included. Otherwise, the user will not be able to save their changes.
- Save button (without formatting)
This is the same as the Save button keyword replacement, but it will only show the button without any formatting.
- Release-locks button
This will show the Release lock(s) button on the screen. This setting will allow the user to release the locks on the page once they have finished editing it.
Edit layouts can be applied on either a system-wide basis (through the use of the Layout manager) or by root node (through the Layouts screen of an asset).
Read the Creating and applying custom edit layouts chapter for more information.
You must grant backend users read permission to an edit layout for them to view it in the inline edit mode. Alternatively, if you have created one edit layout and only specific users can view certain fields in the interface, you can modify each division’s permissions on the edit layout instead.
For example, say you have created an edit layout that has the fields to allow users to edit the contents and make workflow approvals. You can place the workflow fields in a new division on the edit layout and only grant read permission on that division to the users that are part of the approval process, rather than allowing all users to view both sets of fields.
Each edit layout also needs to be live.