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.
![Herky the Hawkeye icon on black background](/sites/transportation.uiowa.edu/files/styles/widescreen__1024_x_576/public/2020-10/Herky-full%20color%20on%20black%402x.png?h=d1cb525d&itok=8J0w3EWJ)
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.
![Herky the Hawkeye icon on black background](/sites/transportation.uiowa.edu/files/styles/widescreen__1024_x_576/public/2020-10/Herky-full%20color%20on%20black%402x.png?h=d1cb525d&itok=8J0w3EWJ)
Card example 3
Or, you can introduce feature or blog content with a full image, headline, byline, and teaser.
![Herky the Hawkeye icon on black background](/sites/transportation.uiowa.edu/files/styles/widescreen__1024_x_576/public/2020-10/Herky-full%20color%20on%20black%402x.png?h=d1cb525d&itok=8J0w3EWJ)
Card example 3
Or, you can introduce feature or blog content with a full image, headline, byline, and teaser.
![Herky the Hawkeye icon on black background](/sites/transportation.uiowa.edu/files/styles/widescreen__1024_x_576/public/2020-10/Herky-full%20color%20on%20black%402x.png?h=d1cb525d&itok=8J0w3EWJ)
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
Newton Road Ramp west elevator closed for updates Jan. 29 - Aug. 29, 2025
North Campus Ramp space closures Jan. 24 - July 25, 2025
![cambus driving up jefferson](/sites/transportation.uiowa.edu/files/styles/widescreen__1024_x_576/public/2024-05/2016_05_06-Spring%20on%20Campus-jatorner-0112.jpg?h=8af2bcf9&itok=NDJzO5b4)
CAMBUS service for spring 2025 session
![A bus passes through Newton Road construction](/sites/transportation.uiowa.edu/files/styles/widescreen__1024_x_576/public/2024-12/Newton%20Road-1_0.jpg?h=0dca3afc&itok=tPLrEOlN)
Cambus Health Sciences Interchange opens Dec. 23
![map of Newton Road map](/sites/transportation.uiowa.edu/files/styles/widescreen__1024_x_576/public/2024-12/NewtonRoadGIS_Map.png?h=eadd1c2a&itok=25D_60L1)
New roundabout along Newton Road to open week of Dec. 16
![A CAMBUS driving through snow](/sites/transportation.uiowa.edu/files/styles/widescreen__1024_x_576/public/2024-12/2024_12_02-First%20Snow%20jatorner-0018%20%281%29.jpg?h=10d202d3&itok=3dk4fxUx)
CAMBUS service for 2024-2025 winter break
![blue route with fall leaves](/sites/transportation.uiowa.edu/files/styles/widescreen__1024_x_576/public/2023-11/Fall%20Break%202023%20news-05.jpg?h=6fca2636&itok=f7d1U7Os)
CAMBUS service for 2024 fall break
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
Best public university in the country (U.S. News & World Report)
Top 3 %
of universities worldwide (U.S. News & World Report)
95 %
job/graduate school placement rate
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.