Content Grid Block

The Content Grid block displays text and photos in a column or grid layout. It is extremely versatile. Use it to create columns of text, to display a page of photos, or to create ‘teasers’ that link to more content. You can achieve significantly different looks by varying the number of columns, using or not using pictures or leaving off the cell titles.

Create a Content Grid Block

1. Navigate to the page you'd like to update, and enter the Edit mode for the page.
2. Click on the Layout tab.
3. Choose the Section you would like to add the block.
4. Click on Add Block in that section.
5. Click on Create content block in the Configuration Sidebar.
6. Select Content Grid from the list of options.
7. Choose Inline or Reusable block option.

Add Grid Layout Content

1. Title: this displays above the block when placed on a page.
2. Display title: enabled by default, toggle the button to hide the block title.

Add Grid Content

The Content tab for a grid section has a title, link, and text field.

1. Title: the title appears within each individual cell. If you have a link associated with the content the title will appear as linked text.
2. Text: enter the body content for each cell. The editor has many options for formatting your text including the use of icons, buttons, etc..
3. Link: Start typing the title of a piece of content to select it. You can also enter an internal path such as /about or an external URL such as https://www.colorado.edu.
4. Image: Click Add Media to add an image from your media library or to upload an image.

Add Grid Design

The Design tab for a grid section has a column count, image style and grid layout selection.

1. Column Count: Select number of columns.
2. Image Style: set the image to Wide or Square.
3. Grid Layout Selection: choose a style to display the grid.
   1. Columns: creates 2-6 columns, may use title, link, text, and/or image in any combination.
   2. Cards: creates 2-6 columns, similar to Columns, but each individual grid has a drop-shadow that darkens when the cursor hovers over that grid. 
   3. Overlay: creates 2-6 columns, Note: if an image is not added, the individual grid titles will not display.
   4. Offset: creates groups of 3 cells, best practice to include groups of 3 individual grid items.

Add Additional Grid Layout Content

1. Click Add Grid Layout Content to add more grid content.

Save Block

1. Click Add Block when done.
2. Click Save layout.