Was this page helpful?

Examples

Contentful provides a curated list of examples that can be installed into spaces. All examples are open source so they can be customized to specific needs. Some of the highlights are:

More examples can be discovered in:

  • our GitHub repository for a complete list of open source extensions
  • the Marketplace or
  • a curated list in the Contentful Web App (navigate to Settings > Extensions).

Installing an example into your space

The quickest way to install an example into a space is by using the web app's Install from GitHub flow.

Overview of UI Extensions in the web app

The repository needs to host a descriptor JSON file (example extension.json) with the bundle (example index.html) of the extension correctly referenced from the descriptor file.

To install from a source on GitHub, follow these steps:

  1. Select Install from GitHub from the Add extension drop down.

  2. Enter a public GitHub link to an extension.json descriptor file or select one from the contentful/extensions repository.

Install from GitHub

  1. Click Install to complete the installation.

Assigning UI Extensions to a Field

After a successful installation, UI Extensions can be assigned to a field of a content type.

To assign UI Extensions to a field:

  1. Navigate to a Content Type.

  2. Select a field in the Content Type.

  3. Navigate to Settings> Appearance of the field.

  4. Select the desired UI Extension.

  5. Navigate to an entry of the Content Type to see the selected UI Extension in action.

The image below shows the Appearance tab under Setting of a field:

Assign UI Extensions to a field of a content type

To use the extension across several fields or content types, repeat the above steps again for each field.

Next steps

Not what you’re looking for? Try our FAQ.