Introduction to Page Modules

In Agility CMS, Page Modules are the individual functional components that populate a page layout. Developers create a toolbox of modules Editors can use to compose what type of content is on each page, and in what order they appear.

Screen_Shot_2021-02-04_at_11.44.43_AM.png

Developers define what page modules are available in the CMS and what fields they have. Each module defined in Agility CMS should correspond to a Code file within your digital solution.

Generally speaking, if you don't have any modules defined or editors don't add modules to pages, then there won't be anything to output for your pages.

What's in a Page Module?

A Page Module in Agility CMS has a name and fields.

The name is a friendly representation of the module's intended functionality such as Posts Listing or Rich Text Area. This way, editors can easily identify them and add them to pages appropriately. 

Fields represent content that can be managed by editors. These fields are then used in code (passed as props) to display the content the editor intended.

View Field Types

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.

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 have a Page Module called Image Slider:

  • Number of Slides => [Number]
  • Rotation Speed => [Number]
  • Slides => [Linked Content Reference to Slides]

mceclip2.png

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 Shared Content for the images and text.

How to Create a Page Module

2 out of 2 found this helpful

Comments

0 comments

Please sign in to leave a comment.