Configuring blocks: the basics
Blocks are the boxes of content (such as "User Login" or "Main Menu") that are displayed in layout regions (such as footer or sidebar) on your page. See the Blocks help pages for more information about blocks. This article demonstrates how to configure a few special core blocks.
Adding a block to a layout
The process of adding a block to a layout begins the same for all blocks, so for all examples on this page, we will be referring to this section for these initial stages.
First, navigate to the layout list
Select the layout where you want your block. For more information about Layouts and how to manage and add more Layouts see the Layouts article. For the purpose of these examples, we will be adding our blocks to an unaltered Default layout. Click the “Edit” link for the Default layout.
The Layout UI will load; select a region to add your block, and click the “Add block” link in that region.
The Block List dialog will now load; all available blocks are listed in the block list.
To add a block, click its name in the Block List
The block’s configuration dialog will load. For more information about block configuration, see the Blocks article.
Configure the Block title type if this is available (see the Block title type article)
For many core blocks this is all that is required, since there are no other configuration.
Completing adding a block to a layout
Information about Style settings and Visibility conditions can be found in the Layouts article.
Click the “Add block” button; the dialog will close and you will return to the Layout UI
If you wish to change your block placement, drag its header to another region
Once you are happy click “Save layout”. Remember, no changes are saved until the layout is saved.
Navigate to the path defined by your layout to see your block in its place.
Example: Creating and configuring a Custom block
Follow instructions in “Adding a block to a layout” and select “Add a custom block”.
Add a “Display title”; this will be the block title shown to users of the website when viewing the block on the page.
Enter text in the “Block content” textarea. The editor is enabled for this textarea so advanced editing of text is available.
If this block needs to be used across multiple layouts, click the “Make this block reusable” link. A new textfield will be revealed for adding an Administrative title. See the Blocks article for more information about reusable blocks.
Finish according to the instructions in the section “Completing adding a block to a layout” above.
Example: Adding and configuring a menu block
Menu blocks are blocks which add a menu to your Backdrop site. There are three default menu blocks:
- Account menu
- Administration menu
- Primary navigation
Find out more about how these menus differ and how they work in the Menus article. For this tutorial, we are looking only at the configuration of theses blocks. All the menu blocks have the same configuration features.
To begin, follow instructions in “Adding a block to a layout” and select one of the menu blocks. We will use the Primary navigation menu for this tutorial.
Configure the Starting level. This setting applies only to multilevel menus. See the menus tutorial for more information about the different types of menus. If your menu is flat, this setting will not apply.
A multilevel menu has one or more “leaf” menu items. For example, this is a multilevel menu structure:
Home page
About Staff
- Senior staff
- Middle managers
- Other managers
- Executive staff
- CEO
Contact Us
In this menu, the Senior staff, Executive staff and Middle managers and Other managers and CEO links are all leaf menu item, nested below a parent menu item. Senior staff and Executive staff are 2nd level items, while Middle managers and Other managers and CEO links are 3rd level items.
Blocks in which the Starting level is set at 1st level will always be visible. Blocks in which the Starting level is set at 2nd level or deeper will only be visible when the trail to the active menu item passes through the block’s starting level. So for example if 2nd level is selected, this menu will never be visible on the Home page, About Staff or Contact Us pages, because these are 1st level items but will be visible on all the leaf pages. If visiting the Middle managers page, the visible menu will only be the items which pass through the Senior staff trail; the menu on this page will look like this:
Senior staff
- Middle managers
- Other managers
Note that although CEO is on the same (3rd) level as Middle managers (at least in the menu), it will not be shown because CEO link item passes through a different 2nd level menu trail.
Configure the Maximum depth
From the starting level, this allows you to specify the maximum depth of the menu tree. So taking our same menu again and assuming that 1st level is selected as the starting level, the following would be visible on the home page:
Home page
About Staff
- Senior staff
- Middle managers
- Other managers
- Executive staff
- CEO
Contact Us
If however the Maximum depth is set to 2, no items deeper than two levels will be shown. Our menu on the home page will look like this (again assuming that 1st level is selected as the starting level):
Home page
About Staff
- Senior staff
- Executive staff
Contact Us
None of the 3rd level items will be visible in the menu. Note that the pages are still there and still accessible by typing the path in the address bar, but they will simply not be shown in the menu.
Finish according to the instructions in the section “Completing adding a block to a layout” above.
Example: Configuring the Header block
The header block is usually already placed in the layout. If not it can be added by following instructions in “Adding a block to a layout” and selecting “Header block”.
Select the menu to be used in the header “Menu” select. Any menu can be included, even a custom made menu. By default the Account menu is included. To learn how to create and manage menus, see the Menus tutorial.
Check the remaining checkboxes to include additional features in the header block:
- Logo - include the site logo
- Site name - include the site name
- Site slogan - include the site slogan
The Logo, Site name and Slogan can be configured on the Site information page at Configuration > System > Site information
Finish according to the instructions in the section “Completing adding a block to a layout” above.
Example: Configuring a Field block
Field blocks allow you to include fields from entities as blocks.
Information about Field blocks and instructions on how to get Field blocks to show up in the block list are available in the Deep Dive: Advanced Layout Options tutorial and specifically the "Example: Adding an image Field Block" section.
The configuration forms for Field blocks vary based on the options available for the field. Common elements to all Field blocks are:
Block title type - chooses the source of the block title for the block
Field label display - determine if the field’s label is displayed and in what format.