CQ5.x: How to create a custom widget client-library


How is it possible to create a custom widget client-library that provides new or modified WCM functionality?

Answer, Resolution

CQ5 provides an interface to add new JavaScript functionality to the WCM authoring interface through the Ext.JS framework. These so-called client-libraries provide the following:

  • add custom functionality or
  • override and extend existing features

Create custom client-library

The next steps outline what is required to build a custom client-library.

  • Goto CRXDE Lite (e.g. http://<host>:<port>/crxde)
  • Create a node with type cq:ClientLibraryFolder, e.g.
    • /apps/myapp/ui/mylib
  • set the String property sling:resourceType to widgets/clientlib
  • set (multi-value) property categories to one or more of the following

Category Name Description
cq.wcm.admin SiteAdmin and Tools
cq.wcm.edit ContentFinder and edit page
cq.dam.admin DAM Admin
cq.dam.edit DAM AssetShare, AssetEditor

  • if required, set (multi-value) String property dependencies to other client-libraries in the system
  • save all changes

Overlaying / Adding widgets

  • Create a source folder below the client-lib node, e.g.
    • /apps/myapp/ui/mylib/source
  • Create a file for each JS class and widget override, e.g.
    • /apps/myapp/ui/mylib/source/MyWidget.js
    • /apps/myapp/ui/mylib/source/override/ComponentList.js
  • Create a file js.txt to include above created files in the custom client-lib:

  • save all changes

CQ5 automatically observes changes to a client-library in the repository and will re-register this library for subsequent usage in the corresponding category, e.g. when editing a page. Attached is an example CQ content package that does the following:

  • add custom client-library /apps/myapp/ui/mylib
  • category cq.wcm.edit
  • overwrite default values of the component-list in the SideKick
    • default max number of component groups to be shown
    • default min number of components required for a group

Applies to




Get help faster and easier

New user?