Explore

VMGroup Website structure

1. Introduction to Templates & Content Types

The VM Group website is built on ProcessWire, a framework that uses the concept of templates (think of custom content types) to organise and structure content across the site. Each template defines the fields to store content, and the display of that particular type of page. These templates ensure that similar pages have a consistent structure and that content is managed simply and independently from the look of the page.

2. Core Templates Used

The website uses several templates but some are only there for technical reasons. The main page templates are below, each serving a distinct content purpose:

Landing Page: Used for high-level sections (e.g. Incident Response, Digital Forensics, Cyber Security); lists all “Service page” type children in a grid with icons, title, summary and button

Service Page: Dedicated to describing individual sub services offered (e.g. Onsite Support, Gap Analysis, Expert Witness)

Basic Page: Used for general content such as About, Contact, Blog, Privacy Policy, Testimonials

Post: Used for blog articles, listed under the Blog page, home page (recent news) and under services/landing page content (related content)

3. Block types for building page content

Some templates are used for placing content sections to new and existing pages.

Content block: This is the main type, that is used to add text and images to the page body.

If there’s only text (no image, form or embed), the text is displayed in full width (one column)

If there’s only image, form or embed, it’s displayed in full width (one column)

If there’s both text and image/form/embed, it’s displayed side by side on desktop (two columns)

It’s always one column on mobile.

Multiple images appear with arrows to swipe left/right

Image(s) have a zoom button for a magnified view

Text fields

Title (optional)

Summary (optional -only used in lists, doesn’t directly appear on the page)

Body (the main content text)

Button (optional - to place a link under the text)

⁠

Media content fields

Image(s) (optional, one or multiple images)

Form (if you want to embed a Form Builder form beside the text)

Embed (optional - you can add embed code here for CRM forms, maps, video players etc)

CTA block: You can create a a promotional banner with background image and/or colour overlay, title, text, button and form

Gallery block: You can create an image gallery that displays in a grid and is clickable for displaying in a popup window

Banners block: This is what was used to create the icons for the home page that link sections of the website

PHP File Include: For direct inclusion of a PHP file for using custom code

Block: you can reuse blocks from other parts of the website

4. Page Tree Structure & Content Retrieval

The website's page tree organizes all content as a hierarchy in the admin panel. Each page in the tree is linked to a template, which determines both its fields and how it is displayed on the website. The template used is now displayed after the page title.

Top level pages are all children of Home.

How Content is displayed:

Pages are queried based on their templates (content types), so it’s important to use the correct one: service, post, landing etc..

PHP template files on the server render the page content, for changing layouts or design, you need to change the code.

Landing pages should contain Service pages. Any other type won’t display in the grid.

The Blog page should contain Post content type. Only posts are listed, anything else is ignored

5. Menu

The main navigation can be edited using the Setup > Menu Builder menu option in the admin, by editing the menu “main_menu”. The first menu option (Services) is hard coded and lists all top level pages with “landing” template.

The footer layout and menu is hard coded in the _main.php template but the text is editable by double clicking on it (contact info). The Sectors menu lists all categories and points to a landing page with all pages marked with the give category.

6. Categories and Related content

Categories are stored in the page tree: Tags > Categories. They can be edited or you can add new ones. Service pages should be marked with one or more categories. This will help you to build another layer of categorising, for which landing pages are built automatically and linked from the footer.

Related content can be set when creating or editing blog posts, by adding one or multiple pages in the Related field. You can keep selecting pages without closing the page list, they will be added. Each of those pages will include a card for that blog post after the main content.

Want to print your doc?
This is not the way.

Try clicking the ··· in the right corner or using a keyboard shortcut (

CtrlP

) instead.