Module-based pages are pages that can be constructed by adding modules to the page through the WordPress admin. Content editors are able to add, edit, rearrange and delete different modules in order to build rich, engaging experiences for page visitors.

Adding Modules

Adding modules to a page is a simple process. To begin, ensure that the current page is using one of the module-enabled page templates. These include:

• Modules Template
• Landing Page Template
• Activity Report Template

To change the page template, find the Page Template meta box in the sidebar, and select the desired template from the dropdown, as shown here:

When a module-powered template is selected, the Modules box should appear below the main content area. An empty Modules box looks like this:

To add a new module, simply press the Add Block button. This will bring up a list of all the available modules, as shown here:

Simply locate and click the type of module that you would like to add. This will cause a new block to appear within the Modules Box, containing all the unique fields that apply to that particular module. The specific fields for each module are covered in detail below.

Anchors

Each module has a number of unique fields that are used to populate the module’s content, manage its appearance and/or control its functionality. These fields are listed in detail under each module type, below.

However, all modules have a common field, called the anchor field.

The anchor field is where content editors should enter a unique text ID for a given module. If no anchor is provided, a random string will be generated, but a properly formatted, relevant ID is always preferable.

It is also important to note that:

• Module IDs / anchors should only contain alphanumeric characters, dashes and/or underscores
• Module IDs / anchors should not contain spaces

General Modules

Intro Block

The Intro Block is, as its name implies, intended to be used as the introduction to a page. It is rendered as a large block with a selectable background image, an introductory blurb and an optional jump link.

Fields

Intro Text (required) – This field contains the introductory text that should appear within this intro block.

Intro Image (required) – This field allows you to select the image that should be used as the background for this block.

Jump Link – To activate the jump link button, enter the anchor ID of the module that this button should jump to.

Jump Links

The Jump Links Module is intended to be used near the top of the modules page (generally after an Intro Block), and is basically a collection of jump links to other modules within the page.

Fields

Links – This repeater field allows you to add as many jump links as necessary. Each item within the repeater contains the following sub fields:

Anchor – This is the ID / anchor text for the module that this jump link should point to.

Link Text – This is the text that should appear in the jump link.

Highlight Text

The Highlight Text module is intended for including a brief block of text to highlight some form of important content on the page—generally in the form of one or two paragraphs. The module also provides content editors with the ability to highlight a select number of words to emphasize at the beginning of the opening paragraph.

Fields

Highlight Text – This field contains the text that will be rendered in the module itself.

Highlight Words – This field defines the number of words to be highlighted.

Key Areas

The Key Areas Module is a repeating module that allows content editors to highlight certain key areas related to a specific page. Each “area” is rendered as a single block, with a subtle background image, a title, text and a button link. Background colours alternate between dark grey and white.

Fields

Key Areas – This repeater field contains all of the key areas. Each item within the repeater contains the following sub fields:

Title – This field contains the title for the key area block.

Block Text – This field contains the main content that will be in the key area block.

Button Text – This is the text that will appear on the button in the block.

Link – This field contains the URL that the button will link to.

Block Image – This field controls the image that will be used in the background of the block.

Anchor – Similar to the module-level anchor field, this field allows content editors to provide a unique ID to the individual key area blocks. The same formatting restrictions apply.

Highlights

The Highlights module is a repeating module that allows content editors to highlight certain blocks of content. In this way, it is similar in function to the Key Areas module, except that it has a different layout, and does not use a full-page background image. Instead, it allows content editors to select a single image or group of images to accompany the content. Groups of images will be rendered as a slider-type component, along with forward and backward navigation.

Fields

Highlights – This base repeater field contains all of the highlight areas for this module. Each item within the repeater contains the following sub fields:

Block Title – This field contains the title that will appear at the top of each highlight block.

Block Text – This field contains the main content that will appear in the highlight block.

Block Image(s) – This field contains either a single image or a grouping of images, to be used within the highlight block. Multiple images will be rendered as a custom slider component, along with forward and backward navigation.

Image Links

The Image Links module is intended as a grid of image blocks that link to separate pages (either internal or external). In traditional, non-touch contexts, hovering over these images will cause a title and read-more link to appear. On touch-based devices, the title and read-more link will always be visible.

Fields

Block Title – This is the title that will appear above the module.

Links – This repeating field contains all of the individual image blocks. Each item within the repeater contains the following sub fields:

Block Text – This field contains the primary text/title describing the image link.

Block Link – This field contains the URL that the image will link to.

Block Image – This field contains the image that will be rendered along with this link.

Image Gallery

The Image Gallery module is intended as a basic image gallery. Content editors can add a number of images to the module. These images will then render in a simple grid. Page visitors can then click on the image to view a larger version within a lightbox.

Fields

Block Title – This is the title that will appear above the module.

Links – This field contains all of the images that will be rendered in this module.

Items Grid

The Items Grid module is the most complex of all the available modules. It is intended for rendering a grid of items on the page. These grids can be used for a number of purposes, and there are a wide range of options for configuring how the grid (and items within the grid) render and behave.

Fields

Block Title – This field contains the title that will be rendered at the top of the module.

Use Internal Content – This field indicates whether or not this items grid module should use the internal content option.

Items – This repeating field contains the items to be rendered in the module.

Field of Study Grid

The Field of Study Grid module is a much more limited implementation of the Items Grid module, intended specifically for displaying Cambrian College’s Fields of Study.

Fields

Block Title – This field contains the title that will be rendered at the top of the module.

Inline Links – Checking this box will include an inline list of programs related to each grid item (field of study).

Image Block

The Image Block module is intended for displaying a block with a full-screen background image, a brief blurb of text about a particular topic and an optional icon relating to that topic. Additionally, it also provides the option for adding a custom link.

Fields

Block Style – This field determines the type of block to render. Options include:

• Light – This option will render the block with a white background behind the image.
• Dark – This option will render the block with a dark background behind the image.

Icons – This repeating field contains the icons to be included in this block.

Block Text – This field contains the text that is rendered within this block.

Block Image – This field contains the image that is rendered in the background of this block.

Optional Link – Completing this field will activate the optional link for this block. Setting it to a URL will set the link as a standard link, which will render with a chain icon. Setting it to plain text will set the link as a jump link, which will render with a downward pointing arrow.

Optional Link Text – This field contains the text that will appear within the block’s optional link.

Generic Diamond Block

The Generic Diamond Block is similar to the standard Image Block module, except that it also includes a diamond grid element that allows content editors to provide additional details and context for the module.

Fields

Block Text – This field contains the text that will appear within the primary image block.

Block Image – This field contains the image that will be rendered in the background of the primary image block.

Diamonds – This field contains the images and contents for the three customizable portions of the module’s diamond grid. Each block contains the following sub fields:

Buttons

The Buttons module is a simple module that allows content editors to include a single button or collection of buttons within the page. These buttons can optionally include icons.

Fields

Buttons – This repeating field contains all of the buttons for this module. Each item within the repeater contains the following sub fields:

Button Text – This field contains the text that will be rendered on the button.

Button Link – This field contains the URL that the button will link to.

Button Icon – This field contains the optional icon that can be rendered within the button.

Alignment – This field allows content editors to select the alignment of the buttons within the module.

Content

The Content module is a simple module that allows content editors to include standard content blocks within a modules page.

Fields

Title – This field contains the title that will appear above the content module.

Content – This field contains the primary content for the module.

Activity Report Specific Modules

The Activity Report Page Template is intended specifically for activity reports. It operates very similar to the standard Modules Page template, though uses a more limited number of modules. These include:

• Image Block
• Jump Links
• Items Grid
• Content

Additionally, the Activity Report Page Template also contains one unique module, which is not available to the standard modules page template:

Message

The message module is intended to display a message from a member of Cambrian’s leadership, such as a the Chair or President. In many ways, it is similar to a standard content module, but it contains some additional fields that are used for its unique presentation.

Fields

Title – This field contains the title that will appear above the content module.

Photo – This field contains the photo of the individual who authored the message.

Name – This field contains the name of the individual who authored the message.

Position – This field contains the position of the individual who authored the message.

Content – This field contains the primary content for the module.

Signature – This field contains an image of the signature belonging to the individual who authored the message.