1. Create a project
Create an Adobe Developer Console project that defines it's access to other Adobe services, and manages its deployments.Create an Adobe Developer Project
|Header menu||Adds a button to the header that displays when zero Content Fragments are selected.||None.|
|Action bar||Adds a button to the action bar that displays when one or more Content Fragments are selected.||An array of the selected Content Fragments’ paths.|
A single AEM Content Fragments Console extension can include zero or one Header menu, and zero or one Action bar extension type. If multiple extension types of the same type are required, multiple AEM Content Fragments Console extensions must be created.
AEM Content Fragments Console extensions, require an Adobe Developer Console project and an App Builder app using the
@adobe/aem-cf-admin-ui-ext-tpl template, associated with the Adobe Developer Console project.
Select from the following capabilities when generating the App Builder app, based on what the extension does. Any combinations of options can be used in an extension.
|Add button to Header menu||Add button to Action Bar||Show Modal||Add server-side handler|
|Available when Content Fragments are not selected||✔|
|Available when one or more Content Fragments are selected||✔|
|Collects custom input from user||✔️|
|Displays custom feedback to user||✔️|
|Invokes HTTP requests to AEM||✔|
|Invokes HTTP requests to Adobe/3rd party services||✔|
Adobe Developer contains developer details on AEM Content Fragment Console extensions. Please review the Adobe Developer content for further technical details.
Follow the steps outlined below to learn how to generate, develop, and deploy an AEM Content Fragment Console extension for AEM as a Cloud Service.
6. Adobe I/O Runtime action
Add a serverless Adobe I/O Runtime action that the extension can invoke to interact with Content Fragments and AEM to perform custom business operations.Add an Adobe I/O Runtime action
Example AEM Content Fragment Console extensions.
OpenAI-based image generation and upload to AEM extension
Explore an example action bar extension that generates an image using OpenAI, uploads it to AEM and updates image property on the selected Content Fragment.Explore the example extension