Learn how to conditionally display view fields using the Views Conditional module.
Composer command
composer require drupal/views_conditionalTranscript
Trainer (00:00):
We’ve looked at how to conditionally display field values by using Twig and an if statements. Now I want to show you how to use a third party module called Views Conditional. The module allows you to define custom conditions using field values, and then you can display some HTML if the condition returns true or not.
Trainer (00:23):
Let’s start things off by downloading the module using Composer. So jump into your terminal and then type in the following composer command, composer require drupal/views_conditional. Let’s now jump back to our site. And we can close this tab. And let’s go to extend and search for views, and you should see views conditional. Check it, and then click on instal.
Trainer (00:54):
Let’s now set up the module to conditionally display the author of the article. So if we go to the content administration page. Here, you can see that we have three user accounts, which are the authors of articles and basic pages. We have editor one, editor two, and content manager. Let’s configure Views Conditional to only display editor one if the author is editor one, and if it’s one of the other users, which is editor two or content manager, it’ll simply display editorial team. And that’s it. We could use Twig to implement all of this like we did in the previous video, but I want to show you how to use Views Conditional for this type of functionality.
Trainer (01:42):
Let’s now jump back into the latest articles view, and click on add. And if you search for views, you should see Views Conditional field. From this dropdown, we can select the field for the condition. Then we can select the actual condition, which can be equal to, not equal to, empty, not empty, contains, and so on. Then we enter in the value for the condition into this text field. Then, below that if the condition returns true, we can add in a bit of text into this text area, and if the condition returns false, then we can add it into this text area, which has the label of otherwise output this.
Trainer (02:31):
Now to implement the custom functionality, we’ll need to add the authored by field into the view twice, one for the condition, and the other will be used for the output. So click on cancel, and then click on ad in the fields section, and search for authored by, and select it, and then click on apply. And from the format or drop down, select entity ID, then click on apply, and click on ad again, and again, search for author by, but this time, leave the format set to label, and the check box, link label to the reference entity as checked, then click on apply.
Trainer (03:19):
Now, in the field section, we have two authored by fields. Let’s add in an administrative title, which will help us distinguish between the two different fields. So click on the first authored by, and then click on administrative title, and then type in authored by, and then UID, and click on the other authored by. And again, enter in authored by, and this time, adding label. And let’s rearrange these fields so that they are above the title. And we’ll also move the Views Conditional field just below title. And if we take a look in the preview area, we can see the entity ID, which is the user ID of the user account. And then we can see the actual label or the username of the author. The author of the first article is editor two, with the user ID of three. And then, on the second article, the author is editor one, with the user ID of two.
Trainer (04:31):
Let’s now configure the conditional field so that if the author is editor one, it’ll display editor one. If it’s any other user, it’ll simply display editorial team. So let’s scroll back up and click on Views Conditional. From the if this field dropdown, select authored by UID, and make sure the condition is set to equal to, and then add in two into this value because the user ID for editor one is just two. And then scroll down, and from replacement variables, copy UID_1, and paste that into then output this. And in the next text area, which is otherwise output this, add in editorial team.
Trainer (05:21):
So let’s take a look at the condition again. Scroll up, and the condition should work as follows. If the author of the article has a user ID of two, then display a link to the user account. If it doesn’t, then simply display editorial team. While we are here, scroll up, and check create a label, and add in author into label. Then scroll down and click on apply. Now, if we go down to our preview section, in the first article, it’s displaying editorial team because the author is editor two, but in the second article, it’s displaying editor one as the author because the author is editor one. And if we scroll further down, you can see for this article, which was authored by content manager, it is also displaying editorial team as the author. So our condition is working correctly.
Trainer (06:21):
Let’s make one final change to this view. Scroll back up to the top, and let’s hide the two authored by fields. So click on authored by, label, and then exclude it, and then click on the UID authored by, and exclude that field as well.