Getting Started with Views in Drupal CMS

Views is one of the most important modules in Drupal. After the field system, it is the tool you reach for most often as a site builder. You use it to build content listings, create blocks, power admin screens, and feed components into Drupal Canvas.

In the video above, you’ll learn how to build a Views page, customize fields with image styles and rewrite tokens, expose filters and sorts, configure pagers and infinite scroll, expose a view block as a Canvas component, and create a backend admin page.

What’s Views

Think of Views as a query builder. It lets you query your content and then display the results any way you want. You do not write SQL. You configure the query through a UI, and Views generates the database query for you.

Views already powers a large part of Drupal CMS, even when you do not notice it:

• Admin pages: the Content and People listings are views.
• Moderation: backend listings run on Views.
• Site templates: many components in the Haven template, such as the projects listing and related articles, are views displayed through Canvas.

With Drupal Canvas, Views block displays are automatically created as Canvas components. You can then add them directly to any Canvas page.

You manage every view at Structure > Views. If you do not see this admin area, enable the Views UI module. The listing shows enabled and disabled views, and the operations column lets you duplicate, disable, or delete each one.

Creating a Content Listing Page

To create a view:

1. Click Add view.
2. Enter a name, such as “Latest content”.
3. Set the Show dropdown to Content. This is where you choose what to query.
4. Select Create a page and set a path.
5. Click Save and edit.

The Show dropdown is the most important setting. Content is the most common option, but you can also query content revisions, users, and other fieldable entities.

Once you save the view, you cannot change the base content you are querying. In this case, that is Content. Everything else, such as the display type and the sort, can change later.

Once saved, you are redirected to the Views UI. The page is broken up into three areas:

• Left: the title, format, fields, filter criteria, and sort criteria.
• Center: page settings, header, footer, no-results behavior, and pager. These depend on the display you select at the top.
• Right: advanced options such as relationships and contextual filters.

A view must have at least one display, such as a page or a block. A single view can hold multiple displays, which is useful when several listings share most of their configuration.

At the bottom of the UI you have a preview pane. In the Views settings, turn on Show the SQL query. The generated query then appears above the preview. You rarely need to optimize it, but seeing the query helps you confirm that filters and arguments pass through correctly.

Managing Fields

With the format set to Unformatted list and Show set to Fields, you add the data you want to display. Click Add and pick from the Content category. A few fields make a good starting set:

• Featured image: rendered through a view mode or a single image style.
• Body: trimmed to a maximum number of characters so each card shows a short excerpt.
• Authored by: the user who created the content.
• Authored on: the created date, formatted however you like.

Managing Formatters and Rewriting Output

Every field has a formatter, which controls how the value displays to the visitor. Dates get date formats, images get image styles, and entity references get rendered output. You also get a consistent set of options on each field: style settings, rewrite results, and an administrative title.

A few common customizations turn a plain list into something polished:

• Wrap the title in an H3: under style settings, enable Customize field HTML and choose the element. You can also add custom classes to the field or the label.
• Style a label: change the author label to a strong element so it stands out.
• Merge two fields into one: open a field, choose Rewrite results > Override the output of this field with custom text, and use replacement patterns (tokens) to combine values. For example, merge the author and date onto one line using the {{ uid }} and {{ created }} tokens.
• Add a Read more link: add a Link to content field, output it as a URL, and exclude it from display. Then reference its token from another field’s rewrite, such as a Custom text field.

Rendering Order and Rearranging Fields

Tokens follow rendering order. A field can only reference fields that appear above it.

If a token does not show in the replacement patterns list, rearrange your fields so the source field comes first. Use the field dropdown and choose Rearrange to reorder fields.

Rewrite text can hold Twig code, including if statements, but use it sparingly since logic buried in a view is hard to track down later. If you do add dynamic output, document it using the field’s administrative title.

To exclude a helper field from the output while keeping it available in the view, check Exclude from display. This is how the Link to content field stays usable as a token without rendering on its own.

Finally, change the format to suit the layout. Switching from an unformatted list to a Responsive grid with a sensible minimum column width gives you a clean card grid in a couple of clicks.

Exposing Filters and Sorts

Filter and sort criteria live below the fields on the left. You can add more filters, such as content type or a specific taxonomy tag, and add sort criteria, such as authored on, descending.

You can also expose filters to the visitor so they can switch them on or off and choose their own value. Check the Expose this filter to visitors, to allow them to change it checkbox, and the filter becomes a form control on the page:

• Expose a content type filter: visitors can switch between content types.
• Expose a title filter: visitors get basic keyword search.
• Expose a sort: visitors can flip between ascending and descending order.

Exposed forms have a few useful options:

• Render as a block: place the exposed form in another region.
• Input required: force the visitor to choose a value before any results appear. This is handy for a search page that should stay empty until someone searches.

For better filter controls, install Better Exposed Filters, which ships with Drupal CMS.

A multi-select element makes it easy to lose track of what is selected, especially with many options. Better Exposed Filters lets you render the same filter as checkboxes or radio buttons instead, which is far easier to use.

It also gives you control over labels and other display options.

Configuring the Page: Path, Permissions, and Pager

The center column controls how the page behaves. Page settings cover the path, whether the view appears in a menu, and which theme it uses. The most important setting here is permissions.

Setting Permissions Safely

By default, a view is assigned the View published content permission. This permission allows anonymous users to access all published content.

Avoid the Unrestricted option. It removes the access check on the page, so anyone can reach the view regardless of role. Always keep a permission in place.

If you are building a backend admin page, do not leave it on View published content, or anyone can reach it. Use a more specific permission and always test the page.

Header, Footer, and Pager

The remaining center options round out the page:

• Header and footer: add content around the results, including a result summary such as “Displaying 1 of 10”.
• No results behavior: add a text area with a message like “No results returned” for empty searches.
• Pager: choose a mini pager, a full pager, display all items, or a fixed number of items. A fixed count is ideal for blocks that show, for example, the latest five items.

For continuous loading, the Views Infinite Scroll module adds an infinite scroll pager. It ships with Drupal CMS.

To set it up:

1. Select the Infinite Scroll pager.
2. Enable Automatically load content.
3. Turn on AJAX in the advanced options so new items load as the visitor scrolls.

Keep in mind that long infinite-scroll pages can make the footer hard to reach. While you are in the advanced options, give the view a meaningful machine name. This matters when you load views programmatically.

Using a View Block as a Canvas Component

To show a listing somewhere other than its own page, add a block display to the view. When you create a Views block, Drupal Canvas automatically exposes it as a component you can drop onto any page.

You can duplicate the view or add the block display to the existing view. Multiple displays share configuration, so you tweak only what differs between them.

When you change a shared field on one display, it changes everywhere. To make a display-specific change, set the setting to Override for that display. Overridden settings appear in italics.

For a footer block, you might:

• Override the fields: show only the title.
• Override the pager: show five items.
• Switch the format: use an HTML list.

To add the block to a Canvas page:

1. Edit the page in Canvas.
2. Double-click the footer region.
3. Choose your view from the components list.
4. Add a heading component above it.

Canvas only surfaces block displays, not page displays. The moment you create the block, it becomes available as a Canvas component, with no extra export or configuration needed.

Building an Author Block with Relationships

Views can do more than list nodes. To show information about the author of the current page:

1. Create a second view and choose Content.
2. Add a contextual filter on the ID.
3. Set the contextual filter to get the value from the URL.

The contextual filter passes the node ID of the current page into the query.

The author’s username and picture live on the user entity, which you cannot reach from the content tables directly. To get there, add a relationship to the user, which is an inner join.

Require the relationship, since every node has an author, and a new User category appears in the available fields. Add the username and the user picture with a small image style.

Add this view as a block to the blog content template (full content) in Canvas, then style it with a group component, a heading, and an icon.

Creating a Backend Admin Page

The final piece is a proper backend admin page that only lists your projects.

To build it:

1. Create a view and choose Content.
2. Create a page with a path under admin/content, such as admin/content/projects.
3. Use the Table format.
4. Enable the administration theme.

Next, lock it down and add the fields admins need:

• Permission: set it to Access the content overview page to match Drupal’s own content listing.
• Fields: add the fields you want, plus an Operations links field for edit and delete actions.
• Published filter: expose it so admins can switch between published and unpublished content. Set the exposed filter to allow Any so it does not force a selection.

Because this view lists unpublished content, test the page with a logged-out account to confirm anonymous users cannot reach it. Leaving it on View published content would make it publicly accessible and expose those unpublished projects.

To surface the page as a tab, configure the view’s menu setting as a menu tab with the Administration parent, keeping the path under admin/content. After clearing the cache, the new tab appears alongside the other content tabs, complete with breadcrumbs.

Wrapping Up

The Views UI can feel like a lot at first, but it rewards the time you spend learning it.

Views is a query builder that powers content listings, people pages, admin screens, and Canvas components across Drupal CMS.

Once you understand fields, formatters, exposed filters, and displays, you can build almost any listing you need.

What makes Views so valuable is its reach.

Almost every module in the Drupal ecosystem integrates with it, so the same skills carry across mapping pages, search index listings, and more.

Add Better Exposed Filters for friendlier filter controls and Views Infinite Scroll for continuous loading, and you have a flexible toolkit for displaying content in Drupal CMS.

The best next step is to open Structure > Views and build a listing of your own.