Getting started
Sample content
The page demonstrates some of the features you can use to start building high-impact content. The new Layouts tool allows users to create and edit web content using a visual, drag-and-drop editor. You can see your page take shape in real time, preview layout ideas, and easily adjust and move blocks of content.
Using Layout Builder
To use the Layouts tool, simply log in to the site from the user login, visit any content page, and click "Layouts" in the top menu. This will bring you to the Layout Builder editor. From there, you can click "Add section" anywhere on the page, choose some basic configuration options, and start adding content.
If you see something you like, you can use this page as a reference and recreate that layout anywhere on the site. From the Layout menu, hover over a content block you'd like to use, click the gray pencil icon that shows in the top right, and then "Configure". This will bring up a menu that contains every setting required to create this content.
Everything on this page can be built without coding knowledge or web design expertise. All of the styling and formatting are pre-configured.
Typography styles
Here are some headline and typography options that you can use in copy. Click the "Configure" link at the top right of this block, copy your preferred style from the editor, paste to the page you're working on, and edit the text to suit your message.
Bold Headline
Bold headline serif
Bold headline serif underline
Light intro type for body and paragraph text
Bold intro type for body and paragraph text.
You can also use the Text Area component to add videos, images, and social links using the "Add media" tool.
Cards, columns, and calls-to-action
Cards are a very flexible content block. They can call out featured content, make lists of links more appealing, and help organize content. They can even serve as a call-to-action.
Card example 1
You can use the Card block with an image and headline, using the "Excerpt" field to introduce the destination page's content and "Link Text" to add a clickable link button.
Here, you can see cards used in a three-column variant. As with all other Layout Builder components, Cards will automatically adjust their formatting to suit whatever column arrangement or block size you'd like to use.
Card example 3
Or, you can introduce feature or blog content with a full image, headline, byline, and teaser.
Card example 3
Or, you can introduce feature or blog content with a full image, headline, byline, and teaser.
Horizontal variant
You can also stack cards vertically, which can be helpful when linking to child pages within a section of your site.
Call to action
If Cards aren't prominent enough, the Call to Action block can be used to more directly drive your users to interact with a link. Background and button color, as well as button text, are changeable from the blocks' Configure menu.
Event and news feeds
You can use the Events block to pull a feed of events directly from events.uiowa.edu. Use the Configure menu to select content tags you'd like to use to filter content, how many events you'd like to display, and how you'd like them presented.
The example Articles block on the right pulls a feed from content added to your site using the "Article" page type. The Events feed below is pulled from content marked relevant to Students.
Events
Articles
Ambassadors starting at Parking Ramp 4 to help patients parking on UI Health Care’s university campus
CAMBUS service for 2025 fall break
CAMBUS service alert: Routes 32 and 43 detouring near Slater Hall after 11 a.m. Nov. 15
380 Express bus services extended through 2029
Parking alert: Some spaces of Parking Ramp 1 closed for maintenance Nov. 3-14
CAMBUS Shuttles to Carver-Hawkeye Arena for Winter Sports
Traffic reminder: Hawkeye sports events at Carver-Hawkeye Arena begin Thursday, Oct. 30
CAMBUS introduces online rider hub to improve Bionic Bus eligibility process
Construction alert: Oct. 11 skyway closed between Hawkeye Parking Ramp and UI Health Care
Construction alert: Sept. 20 skyway closed between Hawkeye Parking Ramp and UI Health Care
Stats and rankings
Use the Statistics content block to highlight everything that makes your department or unit stand out. You can place them next to body content by adding them to an adjacent column. You can also place a series of stats side-by-side.
# 34
Top 3 %
95 %
The "prefix" and "suffix" fields allow for placement of smaller text before or after the primary number or statistic being highlighted. Each stat can also be left- or center-aligned within the column.