Learn how to create a block using the Views module.
We’ll cover the following:
- Introduced to the Views module
- Create a block which displays article titles in the sidebar
Transcript
Trainer (00:00):
In the previous video, you learned how to create a basic block and how to create your own block type using the custom block module. Now I want to show you how to create a block that will query and display content from within Drupal. And then we’ll add the block into the sidebar region. To build this block, we’ll use the views module. Views comes with Drupal core, so there’s nothing extra to download. And the module allows you to query your Drupal content and then display the content as a block, as a page, or even as a table.
Trainer (00:37):
To get started, click on structure and you should see this views link down at the bottom. If you can’t see it, then make sure you have the views module and views UI module installed. But chances are you already have these modules installed. So let me close this tab and then click on views. And from this page, you can see all of the enabled views and you can see that are a lot of enabled views. And then right down at the bottom, we have two disabled views. Now views is used a lot throughout Drupal’s backend and front end. For example, this content view is used on this backend page. And if we scroll further down, this people view is used to manage users on this page. And then for the front end, we have the front page view, which is used as the default homepage. And if we scroll further down, we have the taxonomy term view, which is used to display all content assigned to a specific taxonomy term. So as you can see, views is used a lot in Drupal.
Trainer (01:49):
Now let’s create a view that will list out all the latest content from the site and display it as a block. To begin, click on add view and in the view name, enter in latest content. From the views settings section, we can configure which content will be queried. So from the show dropdown, make sure content is selected, but that is the default option. But here you can see that we can query comments, files, custom blocks, even taxonomy terms and users. But for this example, make sure content is selected. And then from of type, you can select the different content types, but in our case, we’ll leave it set to all and then you can filter by tags. Then all the way to the right, you can configure the sort criteria. By default, it is set to newest first, which means all the latest content will appear up the top, but you can change it to oldest first or even sort it alphabetical, by title, and then you can even have it unsorted, but let’s leave it set to newest first.
Trainer (03:02):
Then in the block setting section, check create a block, and this means that views will create a block for us. And from within here, we can change the block title. We can change the block display settings and also item per page. Now all of these options on this page can be changed later on. So you don’t have to worry about making the right choices here because you can change it later on. So let’s leave everything as it is, and then click on save and edit. This is the views UI, and it may seem a little intimidating at first, but trust me, once you get the hang of it, things will start to make sense. So let’s discuss the first column. From the first column, you can configure the title of the block. Then in format, you can configure how the block will be displayed. Then in fields, you can specify which fields will be displayed in the block.
Trainer (03:57):
From filter criteria, we can filter the content returned by views. And currently it is only displaying published content. So if we were to unpublish one of the pages, it wouldn’t appear in this block. Then below filter criteria, we have the sort criteria. This allows you to sort the queried content. And currently it is sorting by the authored on date, which is the creator date. So it’ll show the newest content right up the top. Then in the middle column, we have the block settings options because we created a block. Then below that we have header and footer. This allows you to add content above your view and then below your view, then in the no result behaviour, we can add a bit of text, which could say no content returns if views doesn’t return any results. Then below that you have pager where you can specify how many items should be returned.
Trainer (04:55):
Currently it is set to five and that means the block will only display five items. Then in the right, you have the advanced section, which we’ll look at later on in this video. Then below the columns, we have the preview section, which shows you the returned items from the view. And here you can see the two pieces of content that we created in an earlier video. Then if we go all the way up, we can see all of the displays within the view. Currently there is one called a block, but if you click on ad, you can see all of the available displays because a single view can have multiple displays. So if you want to query similar content but have it displayed differently, you can create a single view, but then have multiple displays within the view. Now, one thing I do want to mention is that if you want to create a block within an existing view, you don’t have to create a brand new view.
Trainer (05:53):
All you need to do is edit that existing view and then create a new block by clicking on this ad button and then clicking on block. That is a quick overview of the views UI. Now let’s get back to configuring this block. Now, because we are creating a block, we have these block settings in the middle column. Let’s take a look at these options in more detail now. From block name, you can configure the name of the block. If nothing is specified here, then it’ll automatically use the title of the view as the block name. Then from block category, we can specify a specific category for our block. By default, views will use this lists views and in the past, I’ve never really changed it, but I can imagine if you have 20 or 30 blocks, you may want to categorise them in some way.
Trainer (06:44):
Then from allow settings, you can specify which view settings will be configurable in the block configuration page. So if you leave items per page ticked, then from the block configuration page, you can dynamically change this value in the pager, which is very useful because let’s just imagine you want to use the same view in multiple regions, but in one region you want to display five items, but in a second region, you want to display one item. Instead of creating two separate blocks, you can configure how many items should be displayed from the block configuration page. And finally from access, you can control what permission or role is required to access the block. If the content in the view is publicly accessible content, then just leave this option set to permission and make sure the permission selected is view published content. This is the default option and nine times out of 10 it is the correct one.
Trainer (07:51):
The only time you’ll change it is if you are creating backend pages where the user needs site administrator access. Let’s now scroll down to the previous section. Currently this view is displaying the title of the content and it’s only showing published content sorted by the authored on date, which is the created date. But let’s go ahead and add in the authored on date for each content below the title. To do that, scroll up to the fields section and then click on add and search for authored on. And here you can see author by and author on. Now, the difference is authored on is the created date, authored by is the user who created the content. And another thing, in the category column, you’ll see content and content revision. If you want to display the published live revision, then make sure you select the field from the content category.
Trainer (08:51):
But if you want to display revisions of the content, then you select the field from content to revision. Now in all the years that I’ve been doing Drupal, I don’t think I’ve ever selected content revision unless I had a very specific reason to do so. So nine times out of 10, you should select the field from the content category. Once you’ve selected authored on, click on add and configure fields, and here you can configure the field. I’m not going to cover this right now, but from the date format, you can see all of the available dates and this can all be configured from Drupal’s backend, and let’s just leave it set to default medium date format, then click on apply. Then if we scroll down, we can see the authored on date below the title. In the filter criteria, we have a single filter which only shows us published content, but let’s say for example, we only want to see articles. To do that, click on add, then search for content type, then select the content type and click on add and configure filter criteria from operator.
Trainer (09:55):
Make sure is one of is selected and then from content types, you can select both content types or you can select or, or you can select just article and then click on apply. Then if we scroll down, we can only see the article content. But in this case, I want to show all the content. So I’ll just go ahead and delete that filter. Once everything has been configured, click on save and now let’s add this block into a region. Go to structure, block layout, scroll all the way down and click on place block. And if we search for the title latest content, we can see our block. Then click on place block. Now all of this should look familiar to you, but now we have this items per block. This allows us to change the items per block settings in the view dynamically. Let’s just leave that set to five, leave everything else, and then click on save block. Let’s move the block up the top, then scroll down and click on save blocks. Now, if we go to the homepage, we can see our block in the sidebar.
Trainer (11:06):
Now, if you hover over the block, you can see this pencil icon here which allows you to configure the block as well as edit the block. And you also get the same pencil icon if you hover of the actual view as well. If we click on the pencil icon, we can edit the block by clicking on this link. Now, these icons are given to us by the contextual links module. So if you can’t see them, make sure the contextual links module is installed. But if we click on the pencil icon and click on edit view, it’ll take us to the view, we can make our change, then click on save and it’ll return us back to the page. Now I want to show you how to hide the block if no results are returned. To demonstrate this, let’s go and edit the view and let’s change this filter criteria so that it’ll only show unpublished content. If we look at our preview, we can’t see any content because all of our content is published.
Trainer (12:06):
But if we click on save and take a look at our view, you’ll notice that we can’t see any content because we don’t have any unpublished content, but the block is still visible. In a way it kind of looks broken. Now, you have two options. The first option is you can add a little message, which says no results returned or no content returned, or the other option is you can configure the view to hide the block if no results are returned. Now, my personal preference is to hide a block if no results are returned, unless there’s a very specific reason to display an empty block. Now, to hide a block if no results are returned, all we need to do is edit the view, go to advanced and then click on this option down here. Hide block if the view output is empty. And then check the check box, click on apply, click on save and now the block is hidden because no results are returned.
Trainer (13:06):
If we want to make the block visible again, go to structure, views, then click on edit on latest content and let’s change the filter so it displays published content. And if we go back to the homepage, we can see the block again.