How Drupal enables more flexible templates

We reveal how we build highly flexible websites that empower digital teams to create the content they need whilst maintaining a consistent design approach.

Website content managers want flexibility. The purpose of a content management system (CMS) is to allow content managers to control what appears on their website without code, leaving them able to present the content that their users need.

Yet we frequently find organisations are constrained by the templates that they have available to them in their CMS. Often a website is designed around a certain set of key pages, and templates are built to serve these. The resulting website looks great on launch day, but over time new requirements emerge, and new pages are created to serve them. Content managers run into problems when the templates available to them are restrictive and do a poor job when used for these new pages. This is frustrating for content managers and means that users don’t get the experience they deserve.

The solution must be a flexible approach that lets content managers configure pages from modular building blocks (we call them ‘slices’ because they appear horizontally across a screen), so they can develop new ways to present content that still looks in keeping with the website’s design.

The problem: rigid templates

A site designed around rigid page templates will often look great at first, but it’s impossible to predict every possible kind of page you’ll need as your website evolves.

That’s why the number one problem we hear about when talking to website content managers is that their existing templates are too rigid, and therefore constrain what they can do. Creating a page to serve a new purpose with a template designed for a different set of needs always leads to poor layouts that don’t serve users. It’s using the wrong tool for the job. What’s needed is a more flexible CMS and design system that lets you add only the sections you require on that page and combine them in any order. This is the approach we take when creating websites for our clients, which means they can continue to evolve their websites as they grow without compromising the design.

The solution: slices

Content managers are domain experts and develop a deep understanding of their users. Your CMS shouldn’t pre-determine how you speak to your users but rather give you a toolkit you can draw upon to build the pages you need.

The modular approach we’ve taken to allow content managers more flexibility we call ‘slices’. A slice is a section of content whose order on the page can be configured by the content manager. A slice can serve many different needs – it may be a section of text, an image, a video, a CTA, gallery or a form. Think of it like lego – the blocks work fine side by side in multiple different contexts and you can rearrange them to create new layouts. By designing these slices to work effectively together on the page no matter what order they appear in we can create highly flexible websites that allow content managers to create new page types to serve new user needs as they arise.

It sounds so simple, but there’s a lot of thought that must go into making the slice-based approach work in practice. Luckily, we’ve had time to refine this over many years, and our design team have become experts at designing pages that look great using this slice-based approach to content editing.

Making slices work

We first developed our ‘slices’ module for Drupal 7, an open-source module that anyone could use to implement a slice-based architecture. When Drupal 8 added a new module with the same functionality as ‘slices’, which they call ‘paragraphs’, we switched to using that module for our ‘slices’ functionality.

To help our frontend team deliver great-looking websites with a slice-based approach, we developed a module with the very uninspired name of ‘entity reference revisions context’ to allow us to set a series of rules about the amount of padding a slice should have depending on the slice a given slice is next to. This ability to add context to how combinations of slices appear allows our designs to look seamless when any possible combination of slices is used.

When content managers need even more flexibility for certain kinds of media-rich long-form content like magazines and visual stories we integrate a tool called Shorthand into their CMS. This gives them the tools they need to create effective new content long after launch.

Flexibility vs simplicity: getting the balance right

We carefully consider the needs of content managers to configure their CMS in the best possible way for them. This involves striking a balance between flexibility and simplicity, so the CMS gives them the tools they need, without having unnecessary complexity.

Drupal’s default authoring environment has a lot of complexity, which enables a lot of flexibility for content managers. However, you can have too much of a good thing. Too much flexibility means a harder-to-use authoring environment with such a large range of options and tools that it can be daunting.

We take the time to understand the needs of the CMS users and configure the authoring environment to remove options and complexity that aren’t needed. This simplifies the interface to make life easier for content managers, whilst still ensuring they have the tools they need to be able to create the new pages they need. By providing flexibility only where it is needed, we can ensure consistency in the parts of the sites that should remain unchanged for the designs to work as intended.

If your current website’s templates are constraining what you’re able to achieve and you’d like a CMS that provides you with a toolkit of modular parts to configure as needed, then you’ll want to check out our Drupal website development service