Pim -

Modules are the individual functional components that populate a page layout. Since the module framework is basic and allows a high-degree of customization, the complexity of a module can vary from displaying a simple piece of text to a more complex form that collects and stores data somewhere.

From a developer’s point-of-view, a module is typically a user control in the website code that encapsulates a specific section of the web page. This control will include the mark-up to render the module, as well as code-behind and even JavaScript to make it interactive.

From the content editor’s point-of-view, a module is an input form that appears when they select a module when adding it to a module zone on a page. This input form is the list of customizable properties of the module, such as titles, text labels, links, etc.

You can see the list of modules that already make up our Sample Site by navigating to Settings > Module Definitions. Some of these modules are of the more complex variety, and depend on data such as query strings and route data to display details of a particular band or album. There are also more simple modules (such as the Badge) that simply render an image and link. You can click on this module definition to see its properties dialog, summarized as follows:

  • General Settings
    • Name – this is simply the reference name displayed to content editors when they are searching for a module to add to a content zone, or reviewing the modules that have already been added.
    • Reference Name – similar to the reference name of a page Content Zone in a page template, this is a name for the website code to use when referring to the module.
    • Description – this is a mandatory field that is used to help content editors see what functionality they can expect from a module when adding it to a content zone.
    • The remaining checkboxes are important, but not relevant for this introduction to Agility 

  • Properties
    • This tab is where you define the individual properties that make up the input form of a module – these are defined in the Architecture stage of website development and their usage can vary
    • Properties can have various types, including Text, HTML, Number, Date, URL, Image and Linked Content. This wide variety in itself illustrates how diverse the usage of properties can be and will be discussed in the later labs.
    • Tabs can be used to group properties together – all properties underneath a tab will appear grouped when the module’s input form is rendered. For example, a module that collects data might group all of the field labels in one tab and all of the validation messages in another.
    • Custom sections are used to insert rich text into a module input form – this can be for something simple like describing to a content editor how a module property is used, or even for inserting custom JavaScript to validate the data that a content editor enters.
  • Form customization - this is used to define how the content editor enters values for the various properties you define on your module. Typically, you will use the System Generated Input Form as this helps to maintain consistency for the content editors and makes maintenance of modules much easier. For a more complex module, you may wish to generate your own input form using the Input Form API.
  • Custom Scripts – this is used to define custom JavaScript code in your input form, which is executed as the form loads. Again, this is generally only used on more complex modules where heavy customization of the input form is required.
  • Output template – this defines how the Agility dll adds your module to the relevant module zone when rendering a page. If you specify a User Control, the dll will look for that control in your website code and add it to the server-side div that you created in your page template. Defining the output template in Agility means you can simply enter mark-up here without the need for a website control, although this means you have limited scope for custom code.
  • Page Usage – this is a list of pages that have this particular module implemented on them. This is for information only.
Have more questions? Submit a request


Please sign in to leave a comment.