The Blank School engages Babson community members and leads research to create entrepreneurial leaders.
Hero Images, Carousels, and Above the Footer
One exception to the color on hero images is the Main Homepage Hero (on the EDU and Portal Homepages). Their text is always white and sits on a green background on smaller screens.
There are three way the Hero CTA Combo can be used
With An Image With A Video With No Image Or Video Portal Example
Goes in EDU + Portal: as hero under header (in Page Header sub-section) • page layouts from 2019 and new ones)
Similar to Page Header Image and the CTA Group, but it combines both. Differences: font-family is Oswald instead of Zilla Slab; does not include sub-title option; only 1 font-size; only 1-4 CTAs (not 5). Note: as the same as the CTA Group the characters < > do currently not show up. • class .hero-cta-combo
margin-bottom: none
Has options for:
- Option to remove image overlay - A “Keep Overlay” dropdown is under “Hero Image” choice for the Image only
- Default = Yes
- H1 can be left empty
- For the new Templates to be published soon - when left emtpy, the heading from the page title (or Heading 1) input appears as the heading on the page.
- Optional text inputs are now above and below the heading 1
- Make sure to not put too many lines of text. They can get cut off at Tablet size or mobile.
- Image Or Video are option for the Hero
- They can also be left empty
- When left empty, a green bar appears behind the CTAs (see below).
- Hero H1 input will not appear if no image is chosen. H1 is only for on top of image.
- Note: Hero H1 input should be left blank in order for Heading 1 input within the page to display.
- 4th CTA has an optional Anchor Link.
- The other CTAs can be skipped to fill out the CTA 4 and the colors will always be in order (Babson Green, Courtyard Green, Summer Nights, Peacock Blue Dark).
Instructions to add anchor tag ID (to the location on the page that needs to be scrolled to):
- If linking to a Form Assembly Form (by itself without it being inside a Form Assembly Wrapper) add form-assembly-container to the anchor link input in CTA 4.
- If linking to a Form Assembly Wrapper add babson__registration-form to the anchor link input in CTA 4.
- If the desired anchor location is not a form, a general content block or a code content type can be added above the location with this code placed in the Tools / <> Source Code area <div id=”anchorTag”></div>


No Title or Image Added

Goes in: .edu as hero under header
To place on page: Carousel Content Type needs to be placed in main content area. Then add Content Card content types (which become the slider images) in Carousel Slides sub-section.
class .carousel--wrapper
margin-bottom: none



Goes in: EDU + Portal as hero under header (in Page Header sub-section)
Page layouts 2 Column - 2019 and new page layouts (2 Column PL, Simple PL, Full Width PL)
Margin-bottom: none
Options:
- Can be placed with the CTA Group (also in the Page Header) sub-section

Goes in: EDU + Portal as hero (in Page Header child section) or in main content area
Place as hero: place Video Hero Content Type in Page Header sub-section.
Place on page: place Video Hero Content Type in main content area.
Margin-bottom: none
Note: Trick is to crop video

Older content type that is mainly placed in Inner 2 Column and Inner 3 Column page layouts within the Main Content area.
Goes in: EDU or Portal as hero in main content area
Note: if switching a page layout to a new PL page layout the Section Header content types will need to be moved into a sub-section called Page Header. Or, the image could be replaced with a Page Header Image within a Page Header sub-section
margin-bottom: none

Goes in: .edu in main content area on Inner 2 Column and Inner 3 Column page layouts.
Can be placed with new PL page layouts within main content area.
margin-bottom: 2rem

Goes in: .edu as hero under header
Place as hero: place in Page Header sub-section
Page Layouts: 2 Column - 2019 and new page layouts (2 Column PL, Simple PL, Full Width PL)
margin-bottom: none
Note: do not add iframe as hero

Page Layouts: 2 Column - 2019 and new page layouts (2 Column PL, Simple PL, Full Width PL)

Goes in: .edu above footer in Page Footer child section
Page Layouts: 2 Column - 2019 and new page layouts (2 Column PL, Simple PL, Full Width PL)
margin-bottom: none
Goes in .edu: abover footer in Page Footer sub-section
Goes in: .edu Homepage + Portal Homepage only
margin-bottom: 0 (no margin-bottom options)
See below map of where image will not be covered by arrow or text
Jira Ticket: ITCMS-3024 Style: Content Card: break away content layout html/main-homepage-hero-item into own CT

Also part of homepage slider - hero-item-thumb