Customizing the Universal Editor Authoring Experience customizing-ue

Learn about the different extension points and other features that allow you to customize the authoring experience of the Universal Editor to support the needs of your content authors.

Disabling Publishing disable-publish

Certain authoring workflows require content to be reviewed before it is published. In such situations, the option to publish should not be available to any authors.

The Publish button can therefore be suppressed entirely in an app by adding the following metadata.

<meta name="urn:adobe:aue:config:disable" content="publish"/>

Filtering Components filtering-components

When using the the Universal Editor, you can restrict the allowed components per container component. To do this, you must introduce an additional script tag, which points to the filter definition.

<script type="application/vnd.adobe.aue.filter+json" src="/static/filter-definition.json"></script>

A filter definition might look like the following, which would restrict a container to only allow adding text and images.

[
  {
    "id": "container-filter",
     "components": ["text", "image"]
   }
]

Then you can reference the filter definition from your container component by adding the property data-aue-filter, passing the ID of the filter you defined previously.

data-aue-filter="container-filter"

Setting the components attribute in a filter definition to null allows all components, as if there were no filter.

[
  {
    "id": "another-container-filter",
     "components": null
   }
]

Conditionally Show and Hide Components in Properties Rail conditionally-hide

Although a component or components may generally be available to your authors, there may be certain situations where it does not make sense. In such cases, you can hide components in the properties rail by adding a condition attribute to the fields of the component model.

Conditions can be defined using JsonLogic schema. If the condition is true, then the field will be displayed. If the condition is false, then the field will be hidden.

Sample Model sample-model

 {
    "id": "conditionally-revealed-component",
    "fields": [
      {
        "component": "boolean",
        "label": "Shall the text field be revealed?",
        "name": "reveal",
        "valueType": "boolean"
      },
      {
        "component": "text-input",
        "label": "Hidden text field",
        "name": "hidden-text",
        "valueType": "string",
        "condition": { "===": [{"var" : "reveal"}, true] }
      }
    ]
 }

Condition False false

Hidden text field

Condition True true

Shown text field

recommendation-more-help
fbcff2a9-b6fe-4574-b04a-21e75df764ab