Creating a custom panel layout

Rename the layout you copied to customPanelLayout. Change the properties of the nodes qtip and jcr:description. For example, change them to Custom layout - Toggle tabs.

qtip

Note:

Setting the property guideComponentType to the value fd/af/layouts/panel determines that the layout is a panel-layout.

Rename the file tabbedPanelLayout.jsp under the new layout to customPanelLayout.jsp.

To introduce new styles and behavior, create a client library under the etc node. For example, at the location /etc/af-custom-layout-clientlib, create the node client-library. Let the node have the categories property af.panel.custom. It has following .css and .js files: