Using Display Suite in Drupal 8: How to Use Switch View Mode Sub-module

In this tutorial series on using Display Suite, we’ve covered the two fundamental use-cases of the module: how to modify layouts and use Display Suite fields.

Now we’ll take a closer look at one of its sub-modules: “Display Suite Switch View Mode”.

The “Display Suite Switch View Mode” module allows an editor to switch which view mode is used on a content page. By default, Drupal will use the “Full content” view mode (if enabled) on content pages, i.e., “node/1”.

But what if you want to choose between two different “Full content” view modes? Well this module has you covered.

So instead of being stuck with a single view mode, you could have one for a layout with a sidebar and another for pages which go full width.

2016-11-08_22-05-03

In this tutorial, you’ll learn how to configure and use the”Display Suite Switch View Mode sub-module.

Getting Started

You’ll need Display Suite installed and ready to go. Read the “Getting Started” section in the first tutorial on how to do this.

The only extra work you’ll have to do is enable “Display Suite Switch View Mode”.

2016-11-08_21-20-36

 

Create New View Mode

I’ll assume you’ve already configured the “Full content” view mode. Let’s now create a view mode for the second “Full content”.

1. Go to Structure, “Display modes”, “View modes” and click on “Add new Content view mode”.

2016-11-08_21-22-26

 

2. Click on Content from the “Choose view node entity type”.

2016-11-08_21-23-47

3. Enter “Full content sidebar” into Name, then click on Save.

2016-11-08_21-25-22

 

At this point we’ve created the view mode, let’s now configure it.

Configure View Mode

1. Go to Structure, “Display Suite” and click on “Manage display” on the Article row.

2. Scroll down to the “Custom display settings” and enable “Full content sidebar”.

2016-11-08_21-27-25

3. Click on the “Full content sidebar” tab and configure the view mode using Display Suite.

I won’t cover how to enable a layout here since it’s covered in this tutorial in detail: “Using Display Suite in Drupal 8: How to Customize Content Pages“.

How to Switch View Modes

Once everything’s been configured, go to the article form and you should see a “Display settings” vertical tab.

Within the tab you can switch view modes by selecting them from the drop-down.

2016-11-08_22-05-03

Permissions

The sub-module offers a useful set of permissions. They can be granted on a per content type basis or you can get access to the drop-down on all content types.

2016-11-09_21-35-47

Summary

By using this module and creating a set of useful view modes, you’ll create a flexible CMS which editors would enjoy using. If you have a requirement to handle different layouts for content types then give this module a go.

FAQs

Q: Can I have this functionality on other entity types?

No, unfortunately this is only available for content types.

Ivan Zugec

About Ivan Zugec

Ivan is the founder of Web Wash and spends most of his time consulting and writing about Drupal. He's been working with Drupal for 10 years and has successfully completed several large Drupal projects in Australia.

Leave a Comment

You have to agree to the comment policy.