Add Two Columns with One Component
When you want to show related (or unrelated) topics right next to each other, you can create columns with the Generic Block: 2 Columns or Generic Block: 3 Columns components.
Use all the bells and whistles for a nicely designed way to highlight programs or topics, or keep it simple and use just the body fields to create two columns.
Generic Block: 2 Column requires a section heading that will display above both columns. Use Callouts: 2 Columns when that's not acceptable.
Generic Block: 2 Column can be added standard or full width.
Generic Block: 2 Columns Options
Background Color defaults to “Light (white).”
Select “Dark (gray)” to add a slight gray tint behind the entire component.
Enter a heading. It will display as a heading 2 centered above the two columns.
Provide more context by entering it in Intro. It will appear below any section header but above the image blocks.
Enter a title. It will appear under the eyebrow and above the body of the image block as a heading 3. Use Title URL if you want to link the title to another page.
If you want the title to be an active link, enter a URL. This is a look-up field.
- To link to a node on our site, begin typing its title and select it from the drop-down list that appears.
- To link to anything else, add the full URL, including https://.
Note: Titles that are linked are styled differently from those that aren't. If you are using the title field in multiple columns, we recommend being consistent in their use — make all titles links or none — so it doesn't look like an error.
You can also add links in the Body, or as a call-to-action (CTA) link at the bottom of the column.
The subtitle appears under the title as smaller text, and looks different from the body text.
The body field is a limited WYSIWYG editor.
You can style text with:
- headings (start with a “Heading 4” if you used Title, and a ”Heading 3” if you didn't.)
- bolding and italics
- lists
You can also add links and special characters, as well as mark up text in non-English languages..
When you add an image, it will appear at the top of the column, spanning the width of the content area.
Enter an image that is at least 572 pixels wide by 320 pixels tall.
Click Image to open an Add Media dialog box. See Images for detailed instructions.
Enter a call to action.
- URL: Enter a URL.
- If the page is on our site, begin typing the title and select the correct page from the drop-down list.
- If the page is not on our site, enter the full URL
- Link Text: Enter a short call to action.
- Keep it short – just a few words.
- Include a verb.
See Links for more information about calls to action.
