Page Modules

In Agility CMS, Page Modules are functional components Editors use to compose what type of content is on each page and in what order they appear.

Page modules in Agility CMS

About Page Modules

Page Modules are similar to Content Models in that they have fields and can relate to other content, but a Page Module is meant to represent a functional UI component that will ultimately render on a website or app.

An editor should be able to add a Page Module to a page and it should render some UI and display content based on the fields on the module or its related content.

As a developer, you define what Page Modules are available in the CMS and what fields they consist of. Each Module defined within Agility CMS should have a corresponding code file within your site or application.

If modules are not defined, or the editor do not add modules to pages, then there won't be anything to output on your pages.

You can create anything from a simple, structured piece of text, a more complex item, or have any functionality and integrate with other platforms and systems.

For example, you may have a Page Module called Image Slider that contains the following fields:

Number of Slides => [Number]

Rotation Speed => [Number]

Slides => [Linked Content Reference to Slides]

A property of that module allows a set number of images to display and you can control the rotation speed. Then you pull in content from another Content List for the images and text.

Create modules in Agility CMS 

How to Create a Page Module

1. Navigate to Models > Page Modules.

Navigating to modules in Agility CMS

2. Click on Add +.

Adding page modules in Agility CMS 

3. Enter the Title and Description of the Page Module.

Entering page titles and descriptions in Agility CMS

4. Click Save to create your Page Module.

Now you are able to add Fields to your Page Module. To start adding fields click the + Add a Field button.

Adding fields to page modules in Agility CMS

There many different types of fields you can add to your Page Module.

All fields have a Field Label and Description and have the option of being Required and or Hidden. Depending on the selected field type, you may have other options such as input validation and more.

Next Steps

Once you've created your Page Module with some fields, editors can now start to add this Page Module to pages.

Handle Module Rendering

In order for your Page Module to actually render anything in your digital solution, you'll need to add a corresponding frontend component that will be responsible for outputting templated HTML with your field properties.

How to Add a Page Module to a Page

To add a Page Module to your Page, simply click on the + button in the Content Zone where you wish to add the module.

How to add a module to a page in Agility CMS

Clicking the + button will open a flyout with the list of the page modules available. Please note that most of the page modules found within your instance are custom modules created by the developer of your digital solution.

Adding modules on a page with Agility CMS