Creating Apps for Agility

Custom Apps allow you to extend the Agility UI and build your own integration that your editors can use. An app could be designed to interface Agility with an external system or simplify some business processes.

Use Cases

You have full control over what your Custom Apps do. These can range from simple, customized input fields, to full UI integrations with other platforms such as Digital Asset Managers (DAM).

  • Integrate with a Digital Asset Manager to allow editors to search and select external assets.
  • Enhance the editor experience by providing custom input methods such as a Block Editor, Markdown, or Color Picker field.
  • Integrate with a third-party/internal API to allow editors to search and select external entities.
  • Pull-in external data such as analytics and display it on a content item.

Getting Started With Your App

Agility Apps must be written using a React-based framework. We recommend Next.js. You can look at the source code for any of the apps currently in the Agility Marketplace as a good starting point, such as the Power Fields App.

Other Examples

Here's a couple example Apps to help get you started:

To learn more about Custom Agility Apps, checkout our documentation on Github.

What Goes into a Custom App?

Custom App URL

Your Custom App must be hosted on a publicly accessible URL. When you install the app, Agility will ask what URL it is located on.

Custom Parameters

Your Custom App will define optional parameters that are set when you install the app. In the simplest form, this could be turning off or on some settings, or entering an API key so that your app can authenticate with an external service.

Installation Parameters

The parameters that are set at the time of installation. This could be setting some API keys so that your app can authenticate with an external service. The parameters will be available to all custom fields the app has defined.

Custom App SDK

Agility provides a robust yet easy-to-use SDK as well as an open source UI library to help developers build Custom Apps for their users. With them, you can easily integrate Agility with any system.

SDK Features:

  • Build Custom UI's that can be shown in Agility
  • Secure iFrame communication between Agility and your App

How the SDK Works

The App SDK facilitates a communication layer between Agility and a single-page app that will be loaded in an iFrame. Using the SDK allows you to easily integrate with Agility using JavaScript.

App Surfaces

When an App has a UI, it shows up on a "surface" inside the Agility interface.  

The following surfaces are currently supported with the Agility App SDK:

  • Custom Fields
  • Dashboards (Home, Pages, Content)
  • Modals
  • Sidebars (Content List, Content Item, Page)

We will be adding more surfaces in the future, including reports, sections, and items. 

Deploying Your App

Once your app is deployed on a hosting environment, you can register it within your Agility Org to make it available to all Instances in that Org.

If you feel you app would be useful to all Agility users, email us at support@agilitycms.com with the URL of your app, a link to your source code, and any other details.

Further Reading