is when you’ll begin to experience a full business school education, blended with the liberal arts and sciences. Link
Cards
Profile Cards
Goes in: Main content area + Advanced Grid Wrapper
Margin-bottom: 6rem (with margin-bottom options)
Has options for:
- Animation
- Make the card a modal
- Background colors
- Make All Text White (must have "no background" chosen)
- Headshot image
- Top border
Styling - Image Centered with Text Below
Can have up to 4 cards across
Profile Name
Image Centered with Text Below
Font size Smaller.
Profile Name
Image Centered with Text Below
Font size is Smaller.
Styling - Image Left with Text Below
Can have up to 2 cards across
Profile Name 22|24|28
Styling Image Left with Text Below 16|16|18
Small text is chosen 14|14|16. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Profile Name
Styling Image Left with Text Below
Font size Smaller. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Styling - Image Left with Text Right
Ideal for 1 card across
FirstName LastName 22|28|33
Image Left with Text Right 18|20|20
Large text chosen. Description 16|18|18. Background is Cedar Key LT. Horizontal Card 2 or more card sin a row. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud Weather Channel ullamco laboris nisi ut aliquip.
Stat Cards
Goes in: .edu main content area + Advanced Grid Wrapper
Margin-bottom: 6rem (with margin-bottom options)
Has options for:
- Background color or background image
- Top border
- Stat text sizes
- Stat color
- Body text sizes
- Body text color can be chosen manually within TinyMce
Notes
- links in the body text will be the Summer Nights blue unless a different color is chosen manually within the TinyMce.
- The Stat counter works best when it below the fold on the page the counter the starts when the page scrolls.
Guidelines For Use
-
Max characters are meant for full width page layouts, as 2 col + 3 col are going away. If these are placed on 2 column page layouts, please use fewer digitsor a smaller text size to accommodate for less width.
-
Stat max character count is 7 (ex., 6 numbers and 1 $)
-
Body text max character count should be around 200 (but input will allow for more to add for formatting and links)
-
-
When cards are 4-up at Desktop
-
Stat text size - use small size (medium could fit for low digit count)
-
Body text size - use discretion based on text amount (cards can get very long at smaller widths)
-
Card at mobile must be 2-up or 1-up
-
-
When cards are 3-up at Desktop
-
Stat text size - use medium or small (large could fit for low digit count)
-
Body text size - use discretion
-
Card at mobile must be 2-up or 1-up
-
-
When cards are 2-up at Desktop
-
Stat text size - can be any size (small, medium or large)
-
Body text size - use discretion
-
LARGE cards must be 1-up at MOBILE
-
This is because the text size is designed to be large, and therefore wouldn’t fit on 2-up at mobile)
-
-
100
%
80%
BG is when you’ll begin to experience a full business school education, blended with the liberal arts and sciences
Card Simple
Goes in: EDU + Portal main content area + Advanced Grid Wrapper
Margin-bottom: 6rem (with margin-bottom options)
Spans width: 100% of container it is in
Note: if the card is too thin where the image isn’t really visible, the width may not work well (due to the text and the image fighting to fill the space that card is allotted) and the card should be stacked at that point
Has options for:
- Image placement - top or bottom (with control over height) and left or right (with control over width). Note: when placed outside AGW, only place image on left or right as card will span 100% of container and will be too wide.
- Background color
- Top bar and top bar color
- Button styling
- TinyMCE allows for body text to have links.
- Font Sizing options
Title Large 22|28|33
Subtitle 20|20|20Body Text for large font sizing is 18px. Card has Cedar Key LT background.
Goes in: .edu main content area + Advanced Grid Wrapper
Margin-bottom: 3rem (with margin-bottom options)
Spans width: 100% of container it is in
Note: if the card is too thin where the image isn’t really visible, the width may not work well (due to the text and the image fighting to fill the space that card is allotted) and the card should be stacked at that point
Note: images may look stretched on Internet Explorer
Has options for:
- Image and image placement - top or bottom (with control over height) and left or right (with control over width). Note: when placed outside AGW, only place image on left or right as card will span 100% of container and will be too wide.
- Top bar color (default top color mango) and top bar hover color
- Button styling Note: if button not chosen, card has no hover
- When card is has link, whole card is button
- Note: Needs to be placed in AWG to float next to other cards
Date Cards
Goes in: .edu main content area + Advanced Grid Wrapper
Margin-bottom: 6rem (with margin-bottom options)
Has options for:
- Background color
- Top border
November
1
Early Decision I Early Action
For students applying Early Decision I or Early Action
November
1
Early Decision I Early Action
For students applying Early Decision I or Early Action link
November
1
Early Decision I Early Action >>
For students applying Early Decision I or Early Action
November
2-12
Multiple Days - Using Smaller Day Text
For students applying Early Decision I or Early Action
Goes in: .edu main content area + Advanced Grid Wrapper
Margin-bottom: 6rem (with margin-bottom options)
Note: Only use background colors that provide enough contrast with the text color used. For color contrast combinations see the Colors page.
Has options for:
- Image
- Top border
- Bottom border
- Font sizes
Business Cards
Goes in: EDU + Portal main content area + Advanced Grid Wrapper
To place in page: place Card Slider Wrapper and Card Slider Cards (underneath) in main content area (cards can also be placed within a sub-section, but do not need to be in a sub-section to work)
To Place in AGW: Wrapper and cards need to be in child sectionunder AGW. The cards themselves do not go into the AGW (they do not have keyword Placement dropdowns). The Card Slider Wrapper brings the cards in, as long as the Keyword Placement dropdown matches the keywords in the AGW. See example in AGW >>
Margin-bottom: 6rem (with margin-bottom options)
Note: When using a 2 Column Layout with more than 2 cards across, and adding bulleted text, the text may run off the page. Be sure to set more than 2 cards across at Tablet.
Note: Make sure the dropdown indicating how many cards across at tablet and desktop is chosen within the Card Slider Card Wrapper CT. If the dropdown is not chosen, cards make stack instead of being a slider.
Has options for:
- Amount of cards across at tablet and desktop. This is a dropdown that is within the Card Slider Card Wrapper content type.
- Body text size. There are now 2 sizes that can be chosen from a dropdown for the body text (17px or 20px). The font is always Oswald (sans-serif) within this content type.
- Images placed on th ecard via teh Media Input will sit at the top of the card and will be flush with the cards edge.
- Images placed within the TinyMce will sit inside the card and have padding around it.
Jira ticket: ITCMS-2951 to merge with Differentiator Card (+ wrapper) + add sections to make like Capital Markets Progress Report
Goes in: .edu main content area + Advanced Grid Wrapper
To place in page: place Differentiator Wrapper and Differentiator Cards in main content area (cards do not need to be in sub-section)
To place in AGW: Wrapper needs to be in child section, under where ADW is, and cards can be in same folder. The cards themselves do no go into the AGW alone, but the Wrapper needs to have the Keyword Placement dropdown match AGW Keyword placement in parent section.
See example in AGW >>
Margin-bottom: 6rem (with margin-bottom options)
All Differentiator Cards stack on tablet and mobile.
Note: Before using large text, make sure it fits in its container on tablet and mobile device. Large text can overflow from the box it is in. Using an image as the text allows the text to be responsive.
Use image for large number instead of Hero Stat input if cards will be placed in Advanced Grid Wrapper that takes up less then 100% of the row.
Best MBA for Entrepreneurship
For XX years, U.S. News & World Report has ranked the Babson MBA #1 for entrepreneurship.
400+ Babson graduate students participate in student consulting projects across 80+ partner organizations each year.
Starting salary for 2018 Babson MBA graduates
Goes in .edu: main content area + Advanced Grid Wrapper
Margin-bottom: no margin-bottom outside of AGW as usually sits within wrapper
Inside Advanced Grid Wrapper Spans width: 100% of container it is in
Outside AGW: max-width: 57rem
Thought and Action - in AGW
At a campus wide community meeting on Thursday, College leaders gathered with students, faculty, staff, alumni, and governance to share updates on strategic planning efforts, and share the vision for Babson's bold future. "There is disruption in the marketplace that, for a lot of people, is scary," said President Stephen Spinelli Jr.
Thought and Action - in AGW
At a campus wide community meeting on Thursday, College leaders gathered with students, faculty, staff, alumni, and governance to share updates on strategic planning efforts, and share the vision for Babson's bold future. "There is disruption in the marketplace that, for a lot of people, is scary," said President Stephen Spinelli Jr.
Thought and Action - in AGW
At a campus wide community meeting on Thursday, College leaders gathered with students, faculty, staff, alumni, and governance to share updates on strategic planning efforts, and share the vision for Babson's bold future. "There is disruption in the marketplace that, for a lot of people, is scary," said President Stephen Spinelli Jr.
Do Not Use the Following Content Types
Goes in .edu: main content area + Advanced Grid Wrapper
Margin-bottom: no margin-bottom as usually sits within wrapper
Inside Advanced Grid Wrapper Spans width: 100% of container it is in
Outside AGW: max-width: 57rem
Has option for:
- divider line to appear on right side
Goes in .edu: main content area + Advanced Grid Wrapper
Margin-bottom: no margin-bottom as usually sits within wrapper
Inside Advanced Grid Wrapper Spans width: 100% of container it is in
Outside AGW: max-width: 57rem
Has option for:
- background color
Body text goes here.
Body text goes here.
Body text goes here.