General CTs

Goes in: EDU + Portal main content area • Advanced Grid Wrapper
Margin-bottom: 6rem + has margin-bottom options

Has options for:

• Optional Title
• Optional paragraph under title
• Option to place icon in 2 columns or 1 row (best for using no text)
• Option to have icon with Courtyard Green BG w/ white Icon or reversed 
• Optional background
• Option to make the text white (for use on a dark background - either being used in this content type or if placed in an AGW with a dark bg)
• Can place up to 8 (see selection of 9 options below) social media icons w/ links

Social Media icons to choose from:

1. Blog
2. Facebook
3. Flickr
4. Instagram
5. LinkedIn
6. Pinterest
7. RSS
8. Twitter
9. YouTube

Goes in: EDU + Portal main content area • Advanced Grid Wrapper • related 1 content + related 2 content in legacy page layouts
Margin-bottom: 6rem + has margin-bottom options

Has options for:

• Heading 3 above
• Optional text + subitle over image
  • optional color backgrounds bands behind the text
  • choice to place text near the bottom of image or in middle
• Overlay image overlay with fly out
  • fly out has direction options of left, right, up + down
• Optional Link for image (or background image)

Note: when using the optional image overlay, make sure the image is the same width and height as the image underneath it.

Goes in: EDU + Portal main content area • Advanced Grid Wrapper • related 1 content + related 2 content on legacy page layouts
Margin-bottom: 6rem (with margin-bottom options)

Has option to add:

• Background color
• Added padding
• Top Boder
• Border (lighter line around whole container)
• Cut corners - Note: should nto be used with Border or Top Border options
• Drop shadow

Goes in: EDU + Portal main content area • Advanced Grid Wrapper
Margin-bottom: 60px (has margin-bottom options). When placed within AGW, margin-bottom should be adjusted within the AGW.

Note: do not use too long a word in a column as it will overflow out of the container

Has option for:

• 8 entries
• border left or border right
• border color
• Heading + Body text size (small, medium, large)
• Heading color (default is Babson Green)

Accordion Stackable

Goes in: EDU + Portal main content area • Advanced Grid Wrapper
Margin-bottom: 20px + has margin-bottom options

Has options for:

• design options (default is "white with orange hover")
  
  • Note: design option "white with green hover" needs to have margin-bottom option of "Zero" chosen

Accordion Filter

Goes in: EDU + Portal main content area • Advanced Grid Wrapper
Margin-bottom: 0 (no margin-bottom options)

Has options for:

• background color options

Goes in: .edu main content area (does not go in AGW)
Margin-bottom: 6rem + has margin-bottom options
Accordion Items are reliant on Accordion Wrapper (Accordion items do not need to be placed in a sub-section)

Goes in: .edu main content area + Advanced Grid Wrapper
Margin-bottom: 6rem + has margin-bottom options

Goes in: EDU + Portal main content area • Advanced Grid Wrapper
Note: images need to be at least 860px wide for the Jumbotron or they won't span the width of the content type on the page.

Has options for:

• Styling options
  • When using image to side with text to side
    • Top bar does not display when in desktop view
    • Only 1-up in a row should be used
  • When using image on top with text below
    • Width options of 860px, 1140px or full width can be chosen
• Option for top color bar
  • default color bar is Blue Heather

Jumbotron Styling Options

Goes in: EDU + Portal main content area • Advanced Grid Wrapper
Margin-bottom: 6rem + has margin-bottom options
Max-width: 86rem • aligned center

The quote is meant for 1 up in a row. It can have 2-up on Desktop (on a full width page layout), but the quotes need to go to 1-up at tablet and mobile.

Has 3 styling options

1. Quote mark above text (both centered)
2. Quote mark on left of text (left aligned) - default
3. Quote mark plus custom IMAGE on left of text (left aligned)

Styling options and instructions

Goes in: EDU + Portal main content area • Advanced Grid Wrapper • related 1 content + related 2 content on legacy page layouts
Margin-bottom: 2rem + has margin-bottom options

Has options for:

• H2 header
• Body text
• Button styling

Link options for:

• Internal link
• External link
• Document or image to download

Goes in: .edu main content area, related 1 content, and related 2 content + Advanced Grid Wrapper
Margin-bottom: 3rem + has margin-bottom options

Goes in: .edu main content area, related 1 content, and related 2 content + Advanced Grid Wrapper
Margin-bottom: 6rem + has margin-bottom options
Note: font size is 16px when in related content

Often used to bring iframes onto page.

Goes in: EDU + Portal main content area • Advanced Grid Wrapper • related 1 content + related 2 content on legacy page layouts
Margin-bottom: 0 (with margin-bottom options)

Note: Some iframes have extra space below where the image/video ends. Adding more margin-bottom options will add to any space already showing.

Goes in: EDU + Portal main content area • Advanced Grid Wrapper
Page layouts: most page layouts; do not use on 2 Column with Sticky form
Margin-bottom: 6rem + has margin-bottom options

Has options for:

• making items links

Goes in: EDU + Portal main content area • Advanced Grid Wrapper
Margin-bottom: 6rem (has margin-bottom options)

Goes in: .edu main content area + Advanced Grid Wrapper
Margin-bottom: 6rem (with margin-bottom options)

Note: When placed within the AGW, 3 across with colored background, iPad horizontal view will have the buttons overwrite the edges of the boxes.

Tabbed Content Wrapper
Creates a tabbed display of content. Requires at least one Tabbed Content Item to be present in section. Only one wrapper per section allowed.

Tabbed Content Item
Content item shown in tabbed display. Requires Tabbed Content Wrapper to be present in section.

Goes in: EDU + Portal main content area (not yet Advanced Grid Wrapper)
Margin-bottom: 6rem + has margin-bottom options

Has options for:

• 1, 2 or 3 columns at desktop in content area
• 1 or 2 columns at tablet in content area

Rules:

1. Tabbed Content Wrapper needs to be placed in same location/folder as Tabbed Content.
2. One Tabbed Content item needs to have True checked indication it will be visible upon page load. The other Tabbed Content can remain false.

Being phased out - use General Content Block Instead

Goes in: .edu main content area, related 1 content, and related 2 content + Advanced Grid Wrapper
Margin-bottom: 3rem + has margin-bottom options

Being phased out - use General Content Block within the Advanced Grid Wrapper to bring in content instead.

Grid Wrapper - Build a custom grid layout and display all Grid Items in the current section.
Grid Wrapper with padding - Build a custom grid layout and display all Grid Items in the current section.

Goes in: .edu main content area (does not go in Advanced Grid Wrapper)
Margin-bottom: none

 Grid Item - Build a custom grid layout and display all Grid Items in the current section.

Grid Item - General Content - adds multiple columns of general content to a page
Grid Item - Image Link w/Border - Add a linked Image w/border as a Grid Item.

Goes in: .edu main content area (does not go in Advanced Grid Wrapper)
Margin-bottom: none