[AEM Sites]{class="badge positive" title="Applies to AEM Sites)."}

Previewing Content Fragments previewing-content-fragments

Last update: May 26, 2026

Applies to:
Experience Manager as a Cloud Service

Topics:
Content Fragments

CREATED FOR:

User
Developer

Content Fragments can be used for both Headless delivery and page authoring. As the fragments are solely content, without formatting, reviewing them can be more challenging. So multiple methods of previewing your fragments, in a variety of scenarios, are provided.

There are several methods available for Content Fragments, accessible from the Console Fragments console and editor. The console and editor described in this section have been developed for headless content delivery (though they can be used for all scenarios).

You can preview your fragment:

by publishing to, and unpublishing from, the Preview instance
in an external application, using the Preview URL pattern
with a visualization (HTML) Template

Of course, you can also view your fragment in the Content Fragment editor.

IMPORTANT

Content Fragments can be accessed from two consoles: Content Fragments and Assets.

There are also two editors for authoring Content Fragments; although the basic functionality is the same, there are some differences. Both editors are accessible from both consoles.

This section deals with the Content Fragments console and the new Content Fragment editor. These have been developed for headless content delivery (though they can be used for all scenarios)

For further information see:

use of the Assets console for managing Content Fragments
use of the original Content Fragment editor,
using Content Fragments for page-authoring.

Preview Instance preview-instance

You can Publish, and Unpublish, your fragment to your Preview Service (as well as to your Publish instance).

You can publish your fragment from either the editor, or the console.

See:

Publishing and Previewing a Fragment for full details.
Unpublishing a fragment for full details.

Preview in an external application preview-in-an-external-application

The Content Fragment editor provides authors with the option to preview their edits in an external frontend application.

Preview URL pattern preview-url-pattern

To use this feature, you first need to:

Work with your IT team to set up the external frontend application that will render the Content Fragment by consuming its JSON output.
When the external frontend application is set up, the Default Preview URL Pattern must be defined as a property of the appropriate Content Fragment Model.

The preview URL should follow this pattern:

https://<preview_url>?param=${expression}

Available expressions are:

${contentFragment.path}
${contentFragment.model.path}
${contentFragment.model.name}
${contentFragment.variation}
${contentFragment.id}

When the URL has been defined, the Preview button is active in the top toolbar of the editor. You can select this button to launch the external application (in a separate tab) to render the Content Fragment.

Preview in the external application preview-in-the-external-application

You can preview a Content Fragment in an external application:

NOTE

The Preview URL pattern must be configured for this option.

In the Content Fragment console navigate to the location of your fragment.
Open your fragment in the editor
Select Preview from the top toolbar.
Select Application to open your fragment in the external application; for example, the Universal Editor.

Preview with Visualization (HTML) Templates preview-with-visualization-html-templates

NOTE

Visual Content Fragments are currently in Limited Availability.

If you would like to participate, please send a request from your official email address to experience-production-agent@adobe.com.

AEM allows you to preview your Content Fragment using a visual layout based on an HTML template.

See Visual Content Fragments for details on how to preview your fragment with templates.

NOTE

See Visual Content Fragments - Templates for details on how to create, customize and upload your own HTML templates.

recommendation-more-help

experience-manager-cloud-service-help-main-toc