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.
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.
Articles
Nic Henderson presents at Medical Student Research Conference!
Paper published in Frontiers in Immunology
Immunology Graduate Student, Andrea Benavides, rotates in the lab
MSTP Student, Ryan Reis, selects the Jabbari Lab
Single cell expression and TCR-seq of Sézary syndrome paper published
Henderson awarded Summer Research Fellowship
Welcome Ryan Reis!
Congratulations to Maddi Lensing!
Kahl Accepted to UI Masters in Pathology Program
Jabbari lab welcomes Alexis Ramos
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.