Easy Steps To Showcase Your Content As Page And Block Views In Drupal
Nitesh Jain
Sep 11, 2023
Consider that you are in charge of overseeing the content on your Drupal website. Create a “Related Blogs” section for your blog pages that will show 5 blog entries relevant to the current blog post as your assignment for today. Which method would you use?
Easy! Utilizing the Drupal Views module! Simply open the views interface, create a new view, customize it, add the view block to any desired page, preview, and save!
However, the Drupal Views module offers you so much customization freedom that we had to devote an entire post to it. In this essay dedicated to the strength of Drupal Views, explore the excellent module in greater detail.
What Does Drupal View Module Do?
Your material can be searched using the flexible and effective Views module. In other words, you don’t need to understand how to construct and run a SQL query. By designing a view, you can easily obtain and display the desired data! Following the query’s execution, the content may be presented in a flexible and adaptable way, as a page or block that can be themed by the design. Without any coding knowledge, it makes it easier to create dynamic lists, grids, and content displays. In the most recent Drupal versions, it is a component of the core and is turned on by default.
Steps To Create A Basic Page Using Views
To present content in a structured and customizable style, you can easily create a Basic page in Drupal by utilizing Views.
Source: SpecBee
Creating A New View
- On the admin toolbar, click “Views” and then “Add view” once you hover over “Structure.”
- A page for creating views will now appear with 4 sections.
- View the fundamental details and add a name and a description
- Select the content show type in the view settings. It is set to “Content” by default. Select the content type now (Content type). Additionally, you can select tagged with and sort by, but they are not required.
- Adding a name, route, format, display to item, menu link, and an RSS feed will generate a view page.
- Block Title, Block Display Setting, Item Per Page, and Pager 3 can all be used to build blocks.
- After you have completed Step 2’s form fields, click the Save and Edit button. The View display page will now load. The display page is divided into 3 columns because there are numerous more options on it (as seen in the screen capture below).
Configuring The View Display
Now that you have created a view, you need to configure it. You’ll find several sections to adjust the parameters for your view in the Views editing interface.
Source: SpecBee
Title: The View’s title
- Format – Choose the basic page content display options.
- Format: Grid, HTML List, Table, and Unformatted list are the four types of formats that View offers.
- Display: Content, fields, and search results are the standard display types. Each style of show offers its settings. When managing content using views, these settings are really helpful.
According to the provided modules that are now available, the format and format show type may add more.
- Fields – When we select the format as a field from the format section, the section will become active. Clicking “Add field” will add the fields. A window will appear after selecting “Add field,” allowing you to search for and add the necessary information. You can configure a field after adding it. The following options will appear in a popup when you click on the field name:
Make a label: If you wish to include a label, check the box and type one in.
If you don’t need to render on the view page or block, exclude it from the display.
Formatter: This field allows you to choose a formatter. By default, a list of formatters is offered, and it can grow with a donated module.
Text link – When this field is rendered, a link will be inserted.
HTML markup and style classes can be changed in the style settings.
Rewrite Results – This section offers a variety of tools for modifying the output of the view:
One can either output this field as a custom link or override its output with custom text.
- ii) Limit the character count in this field iii) Remove HTML formatting iv) Strip whitespace
- vi) Change newline characters to HTML br> tags.
Ineffective behavior You have the option to display a personalized message or hide the area when it is empty.
The title that only admin users will see is called the administrative title.
- Filtered criterion – Fields that will be used to filter material can be added to the Filtered criterion. Numerous options are available for each field to assist in managing conditional filters. Consider these two content types:
- Sort Criteria – Using this file, you can display the content in both ascending and descending order.
The sixth component, Page Setting, enables the addition of a path, the menu inclusion of this page, and a menu tab.
- Header Section – Add fields to the viewing page’s or block’s header. The “Text area” feature, which is used to add static cosmetics content, is the most popular one.
- Footer Section – Just like the header section, this part also allows for the addition of a field.
- No Result Behavior – By including a markup field, a custom message can be displayed if the views contain no content.
- Pager – You can add or remove the Pager and the “more link.” Also, the default view offers a variety of pager-type alternatives. A lot of contributed modules are also available to alter the pager’s appearance and functionality.
Pager selections
Show a predetermined number of items.
Show every item
output pages and a full pager
output pages, a small pager
- Proficient
Relationships: This enables you to connect several entities (people, taxonomy words, content categories, etc.) and access their fields in a view. Follow these steps to create a relationship in Drupal Views:
In the Views interface, you can add a new view or modify an existing one.
Find the “Advanced” area in the view’s setup and click on it to expand the choices.
Next to the “Relationships” fieldset, click the “Add” button.
Depending on the base table (content type) that has been chosen, a dialog box with a list of potential relationships will be displayed. Depending on the object you wish to connect with, you can select a relationship. For instance, you would choose the proper relationship associated with that object if you wanted to display a field from a referenced entity.
To save a relationship you’ve chosen, click the “Apply” button.
You can now add fields, filters, or contextual filters that make use of the newly created relationship after the relationship has been introduced.
When you go to the “Fields” section and click the “Add” button, you will find new field possibilities under the relationship’s title that you can add. Select the desired field, then alter its parameters.
Go to the “Filters” section, click the “Add” button, and choose the filter criterion from the list of choices under the relationship’s header to add a filter using the relationship. Adjust the filter’s settings as necessary.
Contextual filters can also be added, which leverage the relationship to dynamically filter the view results according to the given context.
To see the effects of the relationship-based setting, save the view and preview it.
Source: SpecBee
- Dynamically filtering view results depending on contextual information, such as the value in the URL or other contextual inputs, is done using contextual filters (formerly known as “Arguments”). By utilizing the available context, contextual filters enable you to build more individualized and targeted views.
Select “Add” from the Contextual filter’s buttons.
Based on the base table (content type) that has been chosen, a dialog box with a list of available contextual filters will appear. Depending on the field or taxonomy term you want to use for filtering, you can select a contextual filter.
To add a contextual filter, choose it and press the “Apply” button.
You can customize the contextual filter’s settings after adding it.
Save
When you want to create dynamic, individualized views that alter depending on the context given, contextual filters are especially helpful. They give you the ability to create robust views that react to user activities and deliver customized content.
- Exposed Form: From the front end of your website, an exposed form enables users to interactively filter and alter the outcomes of a view. It offers a simple user interface that lets users customize the displayed content to suit their tastes.
- Other
Name of the device: Views machine
Admin remark: You can add a comment to help other developers understand the feature.
Apply AJAX: Turn Ajax on and off.
Links in context the option to display or hide contextual connections
Utilize aggregation: It can aggregate if a view has a duplicate entry.
CSS type: You can apply a unique class to the view’s wrapper div.
Creating A Views Block Display
Returning to my initial example, which showed how to create a view for a section of related blogs, you can now add this as a block to any page. In the Articles section, usually.
One of the output formats that can be used for your content listing or data presentation is the Drupal Views block display. By using a block display, you may make reusable content blocks that can be positioned in sidebars, headers, footers, or any other block region your theme supports on your website. Let’s now examine the creation of a view block display.
Step1: Make a View block in the
To add a new display when establishing a new view, click the “+ Add” button next to “Displays”. Choose “Block” as the display type from the provided options.
Source: SpecBee
Step 2- Configure the view
You can set the view block like how we created a page view. Give your block display a name and modify the block format’s unique settings, such as the block title and the number of items to display. Save the block after configuring your filters, sorts, and any field formatting unique to the block display.
Source: SpecBee
Step 3: Add the block
You must add the block to the Block Layout to view it on all pages (Global) or a particular page or path. The block display is now accessible after saving the view.
To manage your blocks, go to Structure > Block layout (admin/structure/block).
Source: SpecBee
Step 4- Place the block
A popup will appear when you click the place block button. Place the newly produced view block in the desired location of your website’s layout by selecting it from the list of available blocks. Using the “Visibility settings” offered in the block setup, you can further regulate the block’s visibility.
Source: SpecBee
Click the “Save blocks” button to put the modifications into effect after positioning the block in the desired area and adjusting its visibility settings.
Conclusion
Now, in the end, we hope that through this post you were able to know how to showcase your content as page and blok view in Drupal. However, if you are looking for a Drupal development company, then you should check out Appic Softwares.
We have an experienced team of Drupal developers who can help you with all your requirements. You can even hire dedicated Drupal developers from us and manage your Drupal website.
So, what are you waiting for?
This blog is inspired by: https://www.specbee.com/blogs/showcase-your-content-as-page-and-block-views-in-drupal
