Monday, 17 March 2014

Creating your first Adobe Experience Manager custom xtype

You can create an Adobe Experience Manager widget that is based on a custom xtype. A custom xtype can contain other AEM controls such as combo boxes, text boxes, and so on. Also, the xtype is used within a component's dialog within a panel. An AEM author enters values into the custom xtype that are used by the AEM component. You can develop the custom AEM component to use these values to meet your business requirements. In this article, the values are retrieved using application logic within the component's JSP file and written to a CQ page.

You can place AEM controls within a custom xtype and then use JavaScript to control the behaviour of each control. That is, you can define custom functionality that is not available with the standard component. For example, you can define custom JavaScript application logic within an event handler and dynamically update other fields. For information, see Dynamically updating AEM custom xtype fields.

Creating custom xtypes is a method of extending AEM standard components. To create a custom xtype, you use the AEM widget API. For information, see CQ5 Widgets API Documentation.

The following illustration shows the custom xtype that is created in this development article.

An AEM custom xtype
This development article walks you through how to build this custom xtype. To read this development article, click  http://helpx.adobe.com/experience-manager/using/creating-custom-xtype.html.

Join the Adobe Experience Cloud Community 

Join the Adobe Experience Cloud Community by clicking this banner




I (Scott Macdonald) am a Senior Digital Marketing Community Manager at Adobe Systems with 20 years in the high tech industry. I am also a programmer with knowledge in Java, JavaScript, C#,C++, HTML, XML and ActionScript. If  you would like to see more CQ or other Adobe Digital Marketing end to end articles like this, then leave a comment and let me know what content you would like to see.


Twitter: Follow the Digital Marketing Customer Care team on Twitter @AdobeExpCare.

YouTube: Subscribe to the AEM Community Channel. 


at