Use this component when it’s necessary to provide contextual information and imagery leading into a news story, event, or informational content. Images should have a similar tone and treatment to visually unify the panel.

 

Display Features

  • 3 column layout display - left, middle and right
  • optional background image

content column block

Step 1

Using the mouse, hover the pointer over the right-hand corner of the paragraphs in left, middle and right columns to activate the field and display the Edit cog (Edit menu icon). Click the icon to display the menu and click Edit to open the paragraph.

edit paragraph

Step 2

The Edit pane paragraph displays.  

  1. Title - do not edit the title of the component.​

Pane paragraph

  1. Title - edit to change the title on the pane
  2. Body - edit to update the content.
  3. Click Save to accept the changes

Edit the content column block

This functionality requires Site Builder permissions.

Step 1

Click Customize this page to add the content column block component to a panel page.

Customise this page

Step 2

The available regions where components can be added are displayed as blue shaded fields. Click the plus (+) button to open the list of available components grouped by category. 

Click plus to add a component

Step 3

The available components display. Click on the UQ category and then select the Content column block component to open the configuration form.

add a content column block

Step 4

The configuration form for the Content column block displays.  

  1. Title - insert a title for the component.  This assists in identifying the component on the Panel Content page.
  2. Click Add new paragraph to display the fields to complete.

Content column block

  1. Title - enter the paragraph title
  2. Content - enter the content to display in the paragraph
  3. Click Add new paragraph to add an additional paragraph in the column .

configure content column block 3-5

Complete numbers 3 to 5 for the new paragraph then proceed to number 6 to add a new paragraph to the middle column.

  1. In the middle column, click Add new Paragraph to add links. Complete numbers 3 to 5 for the new paragraph then proceed to number 7 to add a new paragraph to the right column.

Add new paragraph

  1. In the right column, click Add new Paragraph. Complete numbers 3 to 5 for the new paragraph.

Add paragraphs to the right column

Tip: ensure the links are evenly spread across the columns where possible.

  1. Click Finish after all the links have been added.

Click finish

Step 5

To add the required CSS, hover the mouse over the plus (+) button and the cog will appear. Click the cog and then click Edit Panel.

Edit the panel

Step 6

Click the right-hand edit cog on the Content column block component. Click CSS properties.

click css properties

Step 7

Enter content-column-block in the CSS class field and click Save.

enter content-column-block

Step 8 

Click Update and Save

click update and save

The system returns to the saved panel page.

completed content column block

Step 9

Add Pane Styling to edit the display of the component on the panel  page.  Refer to the instructions, Add Pane Style.