AEM Content Fragments extensibility

AEM Content Fragments UI is a powerful extensible UI for managing creating, managing, and editing Content Fragments. There are several extension points available for customizing the UI to meet your needs. Different extension points are available based on which UI that you are extending.

Content Fragments Console extension points

The Content Fragment Console in AEM (Adobe Experience Manager) is a user interface that provides a centralized location for managing and organizing content fragments. It offers a comprehensive set of tools and features to create, edit, publish, and track content fragments, empowering users to efficiently manage structured content across various channels and touchpoints.

AEM Content Fragments Console is the extensible UI for listing and managing content fragments. AEM Content Fragment Console extensions are created using the @adobe/aem-cf-admin-ui-ext-tpl App Builder template.

The following Content Fragments Console extension points are available:

Action bar

Customize actions for when one or more Content Fragments are selected.

View the docs

Grid columns

Customize the data that appears in the Content Fragments list.

View the docs

Header menu

Customize actions for when no Content Fragments are selected.

View the docs

Content Fragments Editor extension points

The Content Fragment Editor in AEM (Adobe Experience Manager) is a user interface component that allows users to create, edit, and manage content fragments. It provides a visually intuitive and user-friendly environment for working with structured content, enabling users to define and organize content elements, apply templates, manage variations, and preview how the content appears across different channels. The Content Fragment Editor streamlines the process of creating reusable and modular content that can be easily distributed and published across multiple digital experiences.

AEM Content Fragments Editor is the extensible UI for editing content fragments. AEM Content Fragment Editor extensions are created using the @adobe/aem-cf-editor-ui-ext-tpl App Builder template.

The following Content Fragments Editor extension points are available:

Header menu

Customize actions in the Content Fragment Editor's header menu.

View the docs

Rich Text Editor toolbar

Add custom button to the Content Fragment Editor's Rich Text Editor (RTE).

View the docs

Rich Text Editor widgets

Customize actions in RTE that are bound to keystrokes.

View the docs

Rich Text Editor badges

Customize non-editable styled blocks inside RTE.

View the docs

Extension examples

Welcome to a collection of AEM UI extensibility code examples! This resource is designed to provide you with practical demonstrations and insights into extending the Adobe Experience Manager (AEM) user interface. Whether you are a developer looking to enhance the functionality of AEM, these code examples serve as a valuable reference.

Bulk Content Fragment property update

A Content Fragment Console Action Bar extension with modal and Adobe I/O Runtime action.

View the example

OpenAPI image generation

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.

View the example

Custom columns

Add a custom column to the Content Fragment Console.

View the example

Export to XML

Export a Content Fragment as XML from the Content Fragment Editor.

View the example

Rich Text Editor toolbar button

Add custom toolbar buttons to RTE fields in the Content Fragment Editor.

View the example

Rich Text Editor Widget

Add widgets to Rich Text Editor in the Content Fragment Editor.

View the example

Rich Text Editor Badge

Add badges to Rich Text Editor in the Content Fragment Editor.

View the example

Business.Adobe.com resources