Customizing Consoles
- Topics:
- Developing
CREATED FOR:
- Admin
- Developer
AEM provides options to customize the consoles (and the page authoring functionality) of your authoring instance.
Clientlibs
Clientlibs allow you to extend the default implementation to offer new functionality, while reusing standard functions, objects, and methods. When customizing with clientlibs, you can create your own clientlib under /apps.
For example, it can hold the code required for your custom component.
See Using Client-Side Libraries on AEM as a Cloud Service.
Overlays
Overlays are based on node definitions and allow you to overlay the standard functionality found under /libs
with your own customized functionality under /apps
. When creating an overlay, a 1:1 copy of the original is not required, as Sling resource merger allows for inheritance.
Overlays can be used in many ways to extend your AEM consoles. Several examples are provided in the following sections.
See also Overlays for Adobe Experience Manager as a Cloud Service.
Customizing the Default View for a Console
You can customize the default view (column, card, list) for a console:
-
You can reorder the views by overlaying the required entry under:
-
/libs/wcm/core/content/sites/jcr:content/views
-
The first entry is the default.
-
The nodes available correlate to the view options available:
column
card
list
-
-
For example, in an overlay for a list:
-
/apps/wcm/core/content/sites/jcr:content/views/list
-
Define the following property:
- Name:
sling:orderBefore
- Type:
String
- Value:
column
- Name:
-
Add a New Action to the Toolbar
You can build your own components and include the corresponding client libraries for custom actions.
-
For example, you may want to create a Promote to Social Media action at:
-
/apps/wcm/core/clientlibs/sites/js/socialmedia.js
-
This can then be connected to a toolbar item on your console:
-
/apps/<yourProject>/admin/ext/launches
-
For example, in selection mode:
-
content/jcr:content/body/content/header/items/selection/items/socialmedia
-
Restrict a Toolbar Action to a Specific Group
You can use a custom rendering condition to overlay the standard action and impose specific conditions that must be fulfilled before it is rendered.
For example, you may want to create a component to control the render conditions according to a group:
/apps/myapp/components/renderconditions/group
To apply these to the Create Site action on the sites console:
/libs/wcm/core/content/sites
-
Create the overlay:
/apps/wcm/core/content/sites
-
Then add the render condition for the action:
jcr:content/body/content/header/items/default/items/create/items/createsite/rendercondition
Using properties on this node you can define the groups
allowed to perform the specific action; for example, administrators
Customizing Columns in List View
To customize the columns in the list view:
-
Overlay the list of available columns.
-
On the node:
/apps/wcm/core/content/common/availablecolumns
-
-
Add your new columns or remove existing ones.
If you want to insert additional data, you need to write a PageInfoProvider with a pageInfoProviderType
property.
cq/gui/components/siteadmin/admin/listview/columns/analyticscolumnrenderer
in /apps
.Filtering Resources
When using a console, a user must often select from resources such as pages, components, or assets. This can take the form of a list from which the author must choose an item.
To keep the list to a reasonable size and also relevant to the use case, a filter can be implemented in the form of a custom predicate. See Customizing Page Authoring for details.