How to Create Views in Drupal 8

Last Updated: January 7, 2021

Drupal is one of the top 3 Content Management Systems (CMSs) in the world, along with WordPress and Joomla. Drupal 8 is currently the latest version of Drupal.

Views is arguably the most powerful module of Drupal, because it allows us to display any pieces of website ‘content’ in any format. The content that Views allows us to show are entities, such as:

Nodes (content such as basic pages, articles, or blog posts)
Comments
Taxonomy terms (such as the ‘labels’ or ‘tags’ that can be given to content)
User profiles (people who can log into the website)

Thus, to understand this article, you should understand what entities are in Drupal, and how entities are made up of fields.

Please note: This article should not be considered accurate or complete until Drupal 8 has been released, and this article has been updated accordingly.

Steps

1
Recognise views in webpages. To understand how and where views can best be used, it's valuable to be able to identify them in other great websites. In the screenshot above of the White House's website home page, multiple views can be seen, bordered in red rectangles. Views come in many forms, such as lists of headlines or snippets, grid-style galleries, and picture slideshows or carousels.
- To find them using code (such as by choosing to 'view source' of a webpage), you can look for ' <div> ' tags that contain the class 'block-views'.
Advertisement

Part 1

Part 1 of 3:

Creating a View

Log into your Drupal site, and select ‘Manage’ > ‘Structure’ > ‘Views’.
2
Add a new view and choose its initial setup.
- Click the ‘Add new View button.
- Fill in the view’s name; this is only used administratively (you’ll see this in the administration pages, but not on the actual website).
- Add a description if the name of the view doesn’t clearly imply what it’s for or how it’s structured.
- Under ‘View settings’, you can choose what kind of entities (and which kind of content if you choose a content entity) you’d like the view to display. This cannot be changed once you save the view. The entities that are displayed are called the results, just like search results.
  
  Note that anything you choose or write on this ‘Add new view’ page (except the entity type) can be changed at any time after you save this view.
whether this view should display a page, a block, or both. If the view will be displaying lots of information or content, it should have a page. If it won’t be displaying a lot of content, and you’d like to place it in a region (see managing Drupal blocks or building Drupal themes to learn about regions) on particular webpages, then choose a block. There are other view modes that can also be chosen after you save the view, such as an RSS feed.
4
Choose the title and layout. If you’d like the page or block title to be different from the view’s name, you can change it. Under ‘Page/Block display settings’, choose layout you’d like the results to have:
- A grid is a large table, where each result has its own cell
- An HTML list is a ‘unordered’ bullet-point list
- A table displays each result as a row, and each field of each result in its own cell
- An unformatted list is the simplest layout, with each result below the previous result.
The ‘of’ selection box lets you choose the display format (such as full posts or teasers) you’d like to use, or specific fields. The display formats can be configured in the entities’ settings (such as on the ‘Structure’ > ‘Content types’ pages for content). Choose the fields option if you’d like to choose exactly which fields you’d like to display (such as ‘titles’, ‘creation date’, and many others), and each field’s settings.

Advertisement

Part 2

Part 2 of 3:

Editing Settings

1
Get familiar with the view editing screen. When you’ve saved the view, or when you edit an existing view, you’ll see a screen with the name of the view (and the type of entity that displays) at the top. The top half of this screen, titled ‘Displays’, is where you can change almost anything about the view. The bottom half is where a preview of the results will be shown, and will be updated as you change view settings.
- In this results area, at the top, the area with the text ‘Preview with contextual filters: ’ and the textbox and the ‘Update preview’ button are only useful if you add contextual filters (explained below); if you view doesn’t use these, ignore this area.
Under the ‘Displays’ title, you’ll see a button for each display type that your view has (blocks and pages). If you click the ‘Add’ button, you’ll see several new types of displays. Below this, you’ll see the name of the selected display type; you should rename the display if you have more than one of the same kind (for example, you have two blocks; one with a grid layout, the other with a table layout). Below this, there are 3 columns (although the third one, ‘Advanced’, is minimized initially). The first column shows you settings you chose when you created the view and saved it. At the bottom are the FILTER and SORT CRITERIA. Filters allow you to restrict which entities will show in the results. For instance, by default for ‘content’ views, there will be a filter that only allows published content to show. Sort criteria are self-explanatory. Both filters and sorts can be ‘exposed to visitors’, which means that anyone viewing the page will be able to adjust the filter or sort criteria, which is particularly valuable for large views with lots of content. You’ll see these ‘exposed criteria’ just above the results (in the results preview area at the bottom of the page).
The first group of settings in the middle column is specific to the display type you’ve chosen. For instance, for pages, this is where the URL of the view can be changed. This is also where the setting to allow or deny particular users seeing the view (like permissions) is.
Below the display type-specific settings, you can add a header and footer (or more than one of each) to the view. The commonly-used options are Global: Text area and Global: Result summary. The Result summary displays information about the results of the view, such as how many results are currently displayed. Other options are to add another entire view, or an entire entity (such as a page), into the header or footer.
When a view isn’t configured correctly, or when there aren’t any of the expected entities to show, there won’t be any results. It’s helpful to both the visitor and you (administers) to know when this happens, in order to know the view is there, but isn’t working as expected (or there’s missing content). Adding a no-results behaviour is almost exactly the same as adding a header or footer, except that it shows up where the results would have been displayed.

Advertisement

Part 3

Part 3 of 3:

Adding Relationships & Contextual Filters

1

Add relationships to display or use additional related data. Relationships let us make links between entities, which gives us more fields to use in the view. More specifically, relationships provide access to data from entities that are related to the entities being displayed; this data can then be displayed, or used in other ways such as in filters.

For example, if your view displays articles (because you’ve got a filter for content: article), then you could add a relationship between the articles and the authors of the articles. This would allow you to use author information in the view; for example, you could display the first and last name of the author of each article displayed. Alternatively, you can use the relationship in filters; for example, you could choose to display only articles that were created by authors who have a specific role, such as administrators. We’ll use this example.

To do this, click the ‘Add’ button next to ‘RELATIONSHIPS’, and choose ‘Content: Content author’ from the list of available relationships (hint: you could use the search box if you know which relationship you want to add), and click the Apply button. Next, you can check the options, then ‘Apply’ the relationship.

To use this relationship in an ordinary filter, click the FILTERS’ ‘Add’ button. In the ‘Add filter criteria’ dialog box, in the ‘Type’ selection box, there will now be a new ‘User’ option (put there because of the relationship), which you should select to narrow down the list of fields. Find and apply the ‘User: roles’ field. In the ‘Configure filter criterion: User: Roles’ dialog box, select ‘author’ from the relationship box (it should be selected by default). Now you can choose ‘administrator’ and apply the filter.

You’ve just filtered the articles that will be displayed to only show articles that are by administer authors! What’s particularly important to note is that you had to choose to ‘use the relationship’ in the filter screen, which made the filter look at the authors of the articles (that’s what the relationship means)!

Expert Q&A

Search

Add New Question

Ask a Question

200 characters left

Include your email address to get a message when this question is answered.

Submit

How to Create Views in Drupal 8

Steps

Creating a View

Editing Settings

Adding Relationships & Contextual Filters

Expert Q&A

You Might Also Like

About this article

Is this article up to date?

About this article

You Might Also Like

Explore Categories