Learn how to control when a block is displayed by using the block visibility settings.
We’ll cover the following:
- Learn about the three different conditions
- Display a block on content types
- Display a block on specific pages and homepage
- Display a block for a specific user role
From this configure block page, we can control where a block is displayed using these visibility settings. A block can be configured to only display on certain content types, pages, and for specific user roles. If you add a block into a region and do not touch these visibility settings, then the block will always be displayed in the selected region. But if you only want a block to appear for users with a specific role or only on some pages, then you’ll need to configure the block visibility settings.
Let’s start things off by looking at the content types condition. If you want a block to only appear on specific content types, then use this condition. If we check article, then the block will only appear on article pages. If we select both article and basic page, then it’ll appear on both articles and basic pages.
Let’s test this out on the powered by Drupal block, which we added to the side bar. We’ll check article and basic page. Then click on save block. Now, before we can test this block, we’ll need to create an article and a basic page. Click on content in the toolbar and then click on add content, and I’ll quickly create an article and basic page.
Now that we have created the two pieces of content, let’s go to the homepage. You’ll notice that we cannot see the block on the homepage because, remember, it is only displayed now on articles and basic pages. If we click on the contact link in the footer, we cannot see the block. If we click on the my account link in the top right, we cannot see it. But if we go to the homepage and then click on the article that we created, now we can see the block in the sidebar. If we go to content and then about us, which is the basic page, again, we can see the block in the sidebar.
Now let’s go back to the configure block page. To do that, I can click on the pencil icon and then click on configure block. We’ll uncheck the content types. Let’s have this block only appear on the contact page, which is slash contact. To do this, click on pages and then add slash contact into the first line. If you want to add extra pages, you can just add them to the next line.
Now, another thing you can do is configure these radio buttons. The first radio button, which is show for the listed pages. This means it’ll only show the block on the listed pages above and nowhere else. If you select hide for the listed pages, it’ll hide the block from the listed pages above, but show it everywhere else. We’ll select show for the listed pages because we only want it to appear on the contact page. Make sure you’ve added slash contact into the page’s text area, then scroll down and click on save block.
Now that we’ve been redirected back to the about us page, you can see that the block is no longer visible. But if we click on the contact link in the footer, we should see the block and you can see it in the sidebar region.
Another thing you can do with the page’s condition is set wild card paths. Let’s go back and configure the block. Let’s change the page’s condition so that the block only appears if the path starts with slash user slash. Click on pages, and let’s remove slash contact and then enter in slash user slash asterisk. This means that this block will appear on pages which start with slash user slash. Let’s save the block. Straight away, you can see that the block is no longer visible on the contact page. However, if we click on my account in the top right, the block is now visible because the path at the top starts with slash user slash.
If I open up a private window and go to the site, this means that I won’t be logged in, and if I click on the login link in the top right, you can see the block in the sidebar because the path starts with slash user slash. Also, if I click on create new account, we can see the block as well. Also, if we click on the reset your password, we can see the block as well because all of these pages start with slash user slash.
All right, let’s close this browser. The last thing I want to show you in regards to the page’s condition is how to display a block on the homepage. Let’s go and configure the block again, then click on pages. If you want this block to appear on the homepage, all you need to do is add in this special path. This special path tells Drupal to display it on the front page. If we click on save block, notice how the block now is no longer visible on this page. But if we click on home, which will take us to the front page, we can now see the block in the sidebar region.
Now let’s look at how to display a block for specific roles. Let’s configure the block one more time, and then click on pages and let’s remove these options. Then click on roles. From here, we can specify which role a user needs in order to view a block. One thing to be aware of is that anonymous user is a hard-coded role given to users which are not logged in. The authenticated user role is another hard-coded role, which is given to logged in users. Even if you have the administrator role or some other custom role, you will still have the authenticated user role. If you want this block to only appear for non-logged in users, then select anonymous user. If you want the block to only appear for logged in users, then select authenticated user. If you want a specific role to only see the block, well then select that specific role. If no roles are selected, like in this example, then the block will be displayed to everyone.
Let’s now select anonymous user. This means the block will only appear for non-logged in users. Click on save block. Straight away you can see that the block is no longer visible because I am logged in. But if I open up a private browser and go to the website, now the block is visible because I am not logged in. Let’s close this browser, and let’s go back to the configure block page. But because the block is no longer visible, we need to go back to the block layout page. Click on structure, then block layout, and scroll all the way down to sidebar first and then click on configure. These are the three visibility conditions that come with Drupal Core. Of course, you can install third-party modules, which give you extra conditions, but these are the ones that come when you install Drupal using the standard installation profile.
Now let’s discuss using multiple conditions at the same time, because this is where things get a little tricky. If you add multiple conditions, just be aware that they all need to return true for the block to appear. If, for example, you want this block to only appear on articles and the user shouldn’t be logged in, then this block will only be visible to non-logged in users on article pages. Both of these conditions, roles and content types, need to return true. Just be aware of that.
Things also get a little tricky when you mix content types and pages. Let’s uncheck anonymous user, but let’s say you select article from content types, and then, in pages, you add in slash user slash, and then you add an asterisk at the end. In this example, the block will only appear on an article if the path of the article starts with slash user slash. Remember, both conditions need to return true. The content type needs to be an article and the path for that article needs to start with slash user slash.