How to use views in Drupal 8

Jaywant Topno

Posted on February 25, 2016 - 3:33 pm

The most installed module in Drupal “Views” is now available as the core modules of Drupal 8. Now you don’t have to search for the latest version of views separately.

For the 1st timer, Views allows you to generate dynamic query using easy to use UI. That's the simple explanation, but it doesn't give the module the credit it deserves.

For instance, you can create a page (/latest-news) which displays all the latest content by bundle type and sorted by posted date. Using the module, you can display content in a block, table or formatted structure.

In this article, we'll continue building our new site by adding up few more custom views. We'll create a view page to showcase news on homepage, and a "Recent News" block.

So, Let’s Begin with View page creation.

Step 1: Go to Manage >> Structure >> Views >> click on +Add new view

Step 2: Clicking on +Add new view redirects to “Add new view” page.
The page has View Basic information fieldset that contain View name and Description.

Section 2 has VIEW SETTING which has option to show, type, and sorted by.
Where, Show means what would you like to Display, Comment, Log entries, Files, Content, Content revision, Taxonomy Terms, Users, Link Count, Custom block revision or Custom block.

Of type holds bundle type either Article, Basic page, custom content type or All.
Sorted by - How do you wants to sort? Sorting by Newest first, Oldest first, or by title; these are the initial level sorting options. Later on you will get more and more sorting criteria e.g.: by author name.

The Addition of new view also carries PAGE SETTINGS & BLOCK SETTINGS.
Once you check on “Create a page”, this will open up page configuration section which, includes page title, page path, Display format, item to be displayed, with three additional option.

use a pager.
create a menu link &
include an RSS feed.

Checking the block setting Will allow you to create a “view block”. This section has option to update Block title, Block Display settings, items per block with pagination option.

Once you are done with filling up these fields value. click on save and edit button. i’m creating view page and view block both in in this example.

Step 3: Once you have saved the view page data, page will be redirected to view Display configuration section having page and block UI.

Just like Drupal 7 views contrib module, Drupal 8 views also has similar UI.

As we can see here view has multiple configuration.

Title : set the title for view page.
Format: How data has to be displayed on the site.
Fields: what are fields you would like to display.
Filter criteria: allow filter by type as well as option to expose the same.
Sort criteria: sorting of field date ascending or descending manner.
page Settings: set the page path, assign to menu if required, view permission.
Header: custom header for the view page.
Footer: custom footer for the view page.
No Result Behaviour: In case if view query fetches no data or empty set, we can set option to override and display custom message to user e.g. no search result available, please try again.
Pager: allow site to create pagination on view page.
Advanced: As the label suggest, this section has advanced options like CONTEXTUAL FILTERS , RELATIONSHIPS, EXPOSED FORM, OTHER etc.

You can check my previous blog post on how to use contextual filters in Drupal 8 for mode details.

Now, let’s start with view page configuration.

We will add a filter to display only content from news.

To add a filter go to FILTER CRITERIA section and click on Add button. This will show pop up box, where you can search by Type or search by name. As we are filtering based on content type this can be done in two ways -

Select Content in Type dropdown and search for Type.
Write type in Search box and select appropriate.

Select the checkbox next to Type and click on Apply (all displays).

Once Type is selected, you will be redirected to configuration page where there is option of “Expose this filter to visitors, to allow them to change it”. Under the content types you can select single or multiple bundle selection option and also have Operator. Once you have set the configuration click on Apply (all displays).

Moving to SORT CRITERIA, click on Add button. I am filtering content based on news posted date in Desc order.

Under Type drop down select content.
Search for Authored on and click on Apply (all displays).

The below page shows configuration for filtering option e.g. Exposing this sorting criteria to the end users, sorting order either ASC or DESC and Granularity.

Next go to PAGE SETTINGS. Here we we can set the page url path.

We can set the menu and assign this to specific category. Menu could be either part of admin menu, footer, navigation or tool menu.

Access has setting of permission, roles and none. This is helpful if you want to restrict or display specific page view to specific role or add a permission.

Once you have selected Role click on settings link. In my case I want to display this page only to Authenticated user. Anonymous user will get the custom configured message. Do not forget to click on Apply button.

Moving to “NO RESULTS BEHAVIOR”, select Global from “Type” filter. Check on Text area and Apply (all displays) button. Fill up content data and click on Apply (all displays) again.

Now it’s time to display specific no of content on latest-news page. Go to PAGER >> Full click on settings link. This will redirect us to pager setting page.

Pager settings page has item per page, offset, Pager ID, Pager link labels, exposed options etc.

We can add custom text for first / previous / next / Last page.

There is additional Exposed Option to control selected option

Allow end user to control selected display options for the view.

Once you have done with view configuration click on save and review the page. Lets check our page now at localhost/drupal-8.0.2/latest-news

Try changing the content type in views check the page if there is no content available. It would show custom message you have added earlier in views.

As we have restricted this view page for Anonymous user. if you visit you view page without login, you will get Access Denied page.

So, we are done with Basic Drupal 8 views configuration.

Step 4: Next we will cover Drupal 8 views Block. Go back to our view configuration page and click on Block.
Similar to views page it has all the configuration. I am adding block name as “latest news block” and saving the view.

Now assign this “latest news block” view block to any region. Visit Manage >> Structure >> Block layout

I’m assigning my view block to sidebar second. Search for latest news block and click on place block.

Now it’s time to configure block. configured item per block. visibility based on content type, page roles, and also it’s provide region and views machine name and click on save block.