The primary function of a CMS is to create and manage content, as well as to allow users to search, customize, and publish content. The way your content is presented can decide how easy or difficult it is to use your website. In Drupal, display modes are different ways of presenting your content on your website. For example, you can show all the information about an article on a website, like a title, author, date, and full text, or you can show just a summary of it. Display modes let you choose what information you want to show and how it's arranged.

Display modes are built into Drupal core and they provide an easy way for developers to control how their content appears on the page. Content types in Drupal provide different types of display modes, each with its own features. For example, nodes (content pieces) can have multiple displays, such as teaser, full, list, and even a custom view. While some content types are limited to one display type (e.g. single page), other content types can have multiple display modes.

This article will help you get a deeper understanding of display modes, their uses, applications and extensions. So let’s get started!

Content display in Drupal

What are Display Modes

Display modes are one of the core features of Drupal that help us manage the display of content and form entities differently for different situations. Content entities include taxonomy, nodes, paragraphs, and forms to add/edit content entities.

Similar to other configuration entities, like content types, display modes can be exported and imported as configuration files(.yml). Display modes have two parts, view mode, and form mode.

Why use them?

Display modes are just one of the many features that make Drupal great, and they provide users with a way to customize their websites by allowing them to control how different types of content are displayed on their sites. It also helps: 

  1. Render content on the page only when required. The fields we don't need can be skipped.
  2. Increase site performance.
  3. Reduce the necessity to create multiple or duplicate content.

Working with Display Modes

Display modes can be accessed from structures.

structures

 

As discussed previously, there are two types of display modes:

  1. View Mode
  2. Form Mode

Using the View Mode

View modes help to manage the display of the content item.
Different modes can be used to display different types of entities. Like view mode for taxonomy content can be used for taxonomies contents only. 

You can create new view modes or modify existing view modes.

To create a new view mode, click on “Add view mode” and choose the type for which you want to create the view mode. For example, select “content”. This will create a view mode for contents of a content type.

new content view mode

For configuring a view mode, go to the content type settings for which you want to use the view mode. Next, go to “Manage display”. At the bottom within “Custom display settings”, you can select any of the available view modes that you want to use.

custom display setting

Here we have selected three view modes. Next, save this configuration. You will then see that these view modes are visible in the “Manage display” tab.

add field group

You can make different configurations for displaying the content on the front end for each mode. For example, if you need to disable a field content or render it differently.

Few common use cases:

  1. Entity reference field
  2. View items
  3. Paragraphs

Form Mode

Form modes can be used to simplify forms for certain use cases, such as creating a simpler form for user registration, or to add additional fields and functionality to a form for more complex use cases. Most commonly, you want to display forms according to user roles.

Like view mode, you can create or configure your own form mode. If you want to use a form mode for a node add/edit form, you can do it in the “Manage form display”.

Form mode features will not work directly from the UI for all forms. If you need to implement for node forms, you have to do it programmatically.

If you want some easy UI options for using form mode we can use the Form mode manager and form mode control contributed modules.

Form mode Manager

After installing the module, you will see the form mode listed on the module configuration page.

form mode manager

Here you can manage which form mode to use for a user by providing permissions.

permissions

 

Form Mode Control

The module also simplifies the process of using form modes.

After enabling the module, you can see form modes on the configuration page. You can choose which form to use.

forms module

 

If you want to use the form mode for other user roles, you have to provide relevant permissions.

module permission

 

You can set up the user roles on the configuration page.

roles

Final Thoughts

Features like display modes make Drupal a great CMS to work with as they provide a high degree of flexibility and customization for how content is displayed on your website. Display modes allow you to create different layouts and designs for your content, giving you the ability to showcase your content in unique and engaging ways. We hope this brief tutorial will help you understand and work with Display modes more effectively. If you like what you read here, consider subscribing to our weekly newsletter so you don’t miss out on any of our latest articles.

Contact us

LET'S DISCUSS YOUR IDEAS. 
WE'D LOVE TO HEAR FROM YOU.

CONTACT US