Video Tutorial: Creating a Block of Related Content with Views in Drupal 7
From news to commerce sites, developers often find themselves in the position of needing to display related content - and for good reason! In UX, leveraging related posts is regarded as a best practice. It isn't hard to see why when you consider the associated benefits:
- increased user browsing time
- reduced bounce rates
- bolstered interlinking, which drives SEO
- conversion of organic search traffic into direct traffic
In Drupal, we can create a block of related content easily using the views module. This tutorial was executed in Drupal 7, however, the instructions are virtually the same for Drupal 8.
For your convenience, a transcript of my video is included at the end of this article. So, sit back, relax, & enjoy learning how to seamlessly add related content in Drupal!
Hi. I'm Casey from Function1's Drupal team and today I'm going to show you how to create a block of related content in views with Drupal 7.
There are two modules we need to install for this demo: they are Views, and View's dependency, Chaos Tools. Next we need content. I've utilized Drupal's built in content type articles because today we'll be relating articles by author. What our view will show is, below each article we'll see a list of additional articles, by the same author.
Now to create the view, we'll go into the views UI, which is under structure -> views. We'll create our new view and call it "content related author." Since we know we're relating an article content type we'll select it right here. We don't want this article to appear on a page itself, we want it to be part of another page, so we're going to create a block. Since we only have a few articles to relate we'll take off a maximum number of lists per page. Next, I want to see the author name in addition to the title, to see if our view is working so we're going to change from title to fields.
Next, if we look down here we just have a list of all the articles. Now under fields we can add the new field to get the authors name. When we type "author" in the list we can see we can add the author ID, and then comment author information, which none of those is exactly what we want. So we'll come out of here and under the advanced dropdown, we're going to add a relationship for this view. And we're going to add the relationship for the author. This will give us the additional field that we need. So now if we click add, and type in "author", we'll see we can add the author's user name. When we save that and scroll down we can now see each author and the title of their article.
We can save this and once we save it this will actually create the block; so if we go back to the structure menu, under blocks, we can find our new block, titled "content related author". Now to have it appear below the other articles we need to move this into the content region. We see now it's appearing under main page content, which is where we want it. We do want to configure it real quick just because we only want it to show on article pages. Now we save it. If we go and hit any of these article pages at the bottom, we now see our new related article list. But it's currently showing all the articles; we only want to see articles by the same author. So let's jump back into our view.
To do that we need to create a contextual filter. What we're going to do is add a filter based on the authors user ID. This is telling Drupal that we only want to see articles with the same user ID as the author. So we need to give the view the authors user ID. We can find that from the URL. What we're telling it is to look at the user ID from the node and to use that when selecting the articles we can view. Now if we scroll down and look at the preview it is gone. That is because we are on the admin page, and admin pages don't have a specific author. But what we can see is when we save this view and go back to our article page and refresh, now we see the list is showing additional articles just based on the author of this article.
But we're not quite done. We'll see we are viewing test article seven and test article seven is still appearing in our list. Let's go take that out. What we'll do is add another contextual filter, this time we need to get the ID of that article. So again we have to tell Drupal we're going to give this one to you from the content ID. Now down here we need to click this little more dropdown, and we want to tell Drupal if the ID is in the list then do not show it.
So we're going to save, go back over here and refresh our screen. We now see number seven has been taken out of the list. Now if we click on test article number eight from our list, we can see it's no longer in the list.
Thanks for tuning into Function1 TV! Follow us on Twitter, FaceBook and LinkedIn for more insights into the world of enterprise technology.