Filters filters

Learn how you can define filters to limit options available in the editor such as available components, RTE options, and asset selection.

Configuring Filters configuring-filters

When using the Universal Editor, you can restrict the options allowed for certain functionality by defining a filter. A filter is a list of items or actions available to the specific context. For example you can filter the components available to be inserted into a container, you can filter the options available in the RTE, and you can filter the assets available in the assets selector.

The filters must all be defined similarly.

Let’s take an example of filtering components per container component.

Reference Filter Definition add-tag

First introduce an additional script tag, which points to the filter definition.

For our example to filter allowed components per container, the tag might look something like this.

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

Define the Filter define-filter

A filter definition contains JSON with an ID unique to the filter and the filter criteria.

For our example to filter allowed components per container, it might look like the following, which would restrict a container to only allow adding text and images.

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

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
   }
]

Reference the Filter reference-filter

To use the filter, you must reference the filter definition. You can do this by:

Additional Resources additional-resources

Learn about other customization and extension options available to the Universal Editor in the documents: