This page is a demonstration of the elements you can create using the Flexible Content page template, this line uses .body-lg to adjust font size.
This first block of text is a “Text Row” and can contain any content the standard WordPress WYSIWYG content editor can produce.
.callout on one line with some strong text
This line finishes the first “Text Row”, the next row is another “Text Row” but with 2 columns.
This is another “Text Row” with 2 columns, in this first column that is displayed on the left on tablet sized browsers or above will just be text, but in the second column we will have an image.
Below this “2 column Text Row” is a “Spacer Row” that includes a HR.
Heading Level 3
This is another single column “Text Row” that includes a centered image with rounded edges, we can give the image more vertical space by setting “margin-bottom” and “margin-bottom” to “medium” or “large” in the Formats menu.
Below this “Text Row” we have a “Tile Grid Row”, each tile can have a title and optional link and you can decide if the tile is Green (Default) or Blue. “Tile Grid Row”s are great way to link to other content in the same section, this is used on the Piplelines pages in The Science section. There is no limit to the number to Tiles you can add.
Tile 2 title
Below this “Text Row” we have an “Embed iFrame Row” that can contain any iFrame src from places like YouTube, Vimeo other other place that allows iframes to embed. We display the iFrame at 16by9 ratio. The example below is a YouTube video.
Below this “Text Row” we have two “Pipleline Row”.
- R&D Complete
- Phase 1 Complete
- Phase 2
- Phase 3
- Phase 1
- Phase 2
Up next is a “Tile Large” row. It contains a tile, can have a background image (aspect ratio 2:1) and you can decide if the tile is Green (Default) or Blue.
Large Blue Tile
Large green tile with image
Under this “Text” row is a “Card Grid” row. Each Card contains a Title, Link, optionally image (but recommended) and Text.
Another Card Title
This is another card text again nice and short is best, the cards opposite will grow to the same height.