Separator Component

Last update: April 22, 2025

CREATED FOR:

  • Developer
  • Admin
  • User

The Core Component Separator Component displays a horizontal rule for separating content.

Usage

The Separator Component allows the content author to easily create a horizontal rule as a break between content to better organize information on a page.

Version and Compatibility

The current version of the Separator Component is v1, which was introduced with release 2.3.0 of the Core Components in February 2019, and is described in this document.

The following table details all supported versions of the component, the AEM versions with which the versions of the component is compatible, and links to documentation for previous versions.

Component VersionAEM 6.4AEM 6.5AEM 6.5 LTSAEM as a Cloud Service
v1Compatible with
release 2.17.4 and prior		CompatibleCompatibleCompatible

Sample Component Output

To experience the Separator Component as well as see examples of its configuration options as well as HTML and JSON output, visit the Component Library.

Technical Details

The latest technical documentation about the Separator Component can be found on GitHub.

Further details about developing Core Components can be found in the Core Components developer documentation.

Configure Dialog

Separator Component's edit dialog

  • ID - This option allows to control the unique identifier of the component in the HTML and in the Data Layer.

    • If left blank, a unique ID is automatically generated for you and can be found by inspecting the resulting page.
    • If an ID is specified, it is the responsibility of the author to make sure that it is unique.
    • Changing the ID can have an impact on CSS, JS and Data Layer tracking.

Design Dialog

The design dialog allows the template author to define the styles applied to the Separator Component.

Styles Tab

The Separator Component supports the AEM Style System.

Experience Manager