Blocks

This section contains information with everything you need to know about blocks.

On this page:

• Overview
• Creating or Configuring Blocks
• Placing Blocks (Adding Blocks to Layout)
• Unplacing Blocks (Removing Blocks from Layout)

Overview

Blocks are boxes of content rendered into an area or region of a web page. There are different types of blocks that are made available to be placed on the page: 

• Built In Blocks
• Custom Blocks
• Other Blocks

Built In Blocks

Built In blocks are blocks provided by the framework or a feature. 

• News Listing Blocks
  • These blocks are provided by the News Content Type. It is a block that displays a listing of news content.
  • It is automatically created, but can be configured when placed on a page.
  • See News > News Listing Blocks for details on usage of this block
• Social Media (Connect With Us)
  • This block is provided by the UTM Multisite Core module. It is a block that displays a list of social media icons that links to the profiles configured on the site.
  • It is automatically created, but requires the configuration of links to the proper social media profiles.
  • See Social Media (Connect With Us) for details on usage of this block

Custom Blocks

Custom blocks are blocks that a user can create based on the block types available to them. These blocks are managed in the Custom Block Library.

A standard UTM Drupal subsite includes the following block types:

• Basic Block
  • A Basic Block contains a title and a body field that utilizes the Rich Text Editor. It is essentially a block version of a basic page. It is best used for combinations of formatted text and images. 
  • See Basic Block for details on usage of this block
• Call to Action
  • A Call to Action is a component that includes and image and a link. It is intended to grab a user's attention and draw them to a particular page or site.
  • See Call to Action for details on usage of this block
• Call to Action Grid
  • A Call to Action Grid displays a collection of Call to Action blocks. Call to Actions placed within a Call to Action Grid will automatically be displayed in a minimal view mode and an altered render style. 
  • See Call to Action Grid for details on usage of this block
• Collapsible Item
  • A Collapsible Item is a component that includes a title and a body. The body is collapsed from view by default. The title can toggle the body to be expand or collapse.
  • See Collapsible Item for details on usage of this block
• Hero Image & Hero Image Display
  • The Hero Image is a display banner block that appears on the home page of a site, intended to highlight and feature content. Hero Images are displayed through the Hero Image Display.
  • See Hero Image & Hero Image Display for details on usage of this block

Other Blocks

There are blocks that become available through other means.

• Webform Blocks
  • Creation of webforms automatically provide a block version of the webform that can be placed on a page.
  • See Webforms for details

Creating and Configuring Block

Creation and configuration of blocks vary greatly from each kind of block.

• Some blocks are automatically created
• Some blocks need pre-configuration
• Some blocks can only be configured when placed
• Some blocks need to be created and configured
• etc

It is best to refer to each block's documentation (linked above) for detailed instructions for the usage of those blocks.

One distinction to remember is the creation and configuration of block content is separate from the placement of blocks in content.

Custom Blocks (Global vs Inline)

Custom blocks are the only blocks that is user generated. There are two ways an editor can create custom blocks:

• In the Custom Block Library
• In Layout

Blocks created in the Custom Block Library will be referred to as Global Blocks, while blocks created in Layout (created in the process of placing a block) are called Inline Blocks.

Here are the key differences between the two:

Placing Blocks (Adding Blocks to Layout)

Blocks are placed in Basic Page Layout. Placing a block in basic pages is the same process for any block regardless of what kind it is.

1. Visit the page you wish to place the block in
2. If you are logged in and able to edit, you should see the local task tabs and be able to click Layout
3. In the area you want the block to appear, click Add Block
4. The list of available blocks will then appear at the right hand side of the page. Search for the block you want to place
   • Only global blocks will appear on the list
   • Alternative: You can create a custom block inline by choosing Create Custom Block. It will take you through the process of creating the type of block you selected. Please refer to the note regarding inline blocks above.
5. Optional: Configure the block
   • With your block placed, click the contextual edit button (Pencil Icon) for the block and select configure.
   • The available configuration options will vary. Consult the block's documentation for details.
   • Warning: Overrides set here is specific to the instance of the block being placed. It will remain even if the original block referenced in the library has been changed.
   • Click Update
6. Click Save Layout

Unplacing Blocks (Removing Blocks from Layout)

1. Visit the page you the block you wish to remove is in
2. If you are logged in and able to edit, you should see the local task tabs and be able to click Layout
3. Hover over the block you wish to remove and click the contextual edit button (Pencil Icon) and click Remove Block
   • If you are removing a global block, it will simply remove the block from the page. The block itself and its contents will still exist and can be managed where it is managed (ie. Custom Block Library)
   • If you are removing an inline block, it will also delete its contents and it will no longer be accessible. As with all deletions in Drupal, this is permanent and can't be undone.
4. You will be prompted to confirm. Click Remove to confirm.
5. Click Save Layout