1- IMD CTA Banner No Image

This block is used when you want to highlight something important on the page, usually a step that the user can/should take next.

Features

1. Blue, white, or grey background with no image
2. Two layouts: Default and horizontal (horizontal is the most used layout)
3. Title and description fields
4. WYSIWYG editor for the horizontal layout
5. Up to two CTAs (buttons) in the horizontal layout with an option to choose from four styles
6. One CTA in the default layout

Example 1: Default layout

Example 2: Horizontal layout

2- IMD Banner with Image and Link

Features

1. Blue background
2. Pre title, title, and description fields
3. Option to add an image
4. One CTA

Example

3- IMD Homepage Hero Slider

This hero block is used on the homepage only.

Features

1. Control the animations length
2. Add slides with an image background
3. Add slides with a video background
4. One CTA per slide
5. Option to add a gradient
6. Embedded YouTube / Wistia video

Example

A live example can be found on IMD’s homepage.

4- IMD Reflection Hero

This hero block is used on the reflection pages only.

Features

1. Text background: blue split background with an option to add an image
2. Pre title, title, description, and date fields
3. Normal background: Possibility to remove the split blue background and have the full image as a background
4. If the normal background is chosen, the editor can add a gradient or an overlay on top of the image, which helps with text readability
5. Option to add an embedded YouTube video

Example

Example 2: Normal background with gradient

Example 3: Normal background with overlay

5- IMD Advanced Program Hero

This is the default hero block for most pages like program pages, category pages, SM/SEM pages, campaign pages, and any other generic page. As a general rule of thumb, if you need a hero on a page, this block is what you need. This is excluding the homepage and the special post types, such as News, Events, Research & Knowledge, Faculty Bios, and Reflections

Features

1. Option to have an image as a background 
2. Option to have a blue split background with an image (labelled as “Text background” in the backend) 
3. Option to add a dark overlay on top of the image 
4. Option to add origami overlay or use origami background for programs, centers, and alumni
5. Pre title, title, and description fields 
6. Option to add an embedded YouTube / Wistia video 
7. Option to have a video as a background 
8. Option to add a counter or a form 
9. Option to add 2 CTAs 
10. Option to add an icon (example: IMD logo on campaign pages) 
11. Options to control the color and size of the title field 
12. Option to turn the title field to a WYSIWYG editor for a full styling control 

How to add the Origami?

Follow these steps in the backend to add the Origami background:

1. Click on the “Origami settings” tab
2. Click on the “Origami” radio button
3. Select the origami type (Programs, Center, Alumni)
4. Choose either “Origami overlay” if you want to add the Origami shapes on top of the image or “Origami Background” if you want the Origami effect to be the background with no image
5. From the “Origami Overlay/Background” dropdown, choose the category of the page or the category you want to use
6. If you choose “Origami Background” in step 2, you need to:
   1. Select the category you want
   2. Select the version you like from the 3 available versions (A, B, and C)

Example 1: program hero with a video and CTA

Example 2: hero with counter

Example 3: campaign page hero with a logo and form

Example 4: hero with blue split text background

Example 5: Origami hero as an overlay

Example 5: Origami hero as an overlay

Example 6: Hero with customized black and blue text

6- IMD Banner with Card

Features

1. Blue background
2. Pre title, title, and description fields
3. Option to add a card with image and a downloadable file
4. Up to one CTA

Example

7- IMD Hero with List

Features

1. Image as a background (found under the Settings tab in backend)
2. Title and description fields
3. Option to add a list of items with links
4. Up to one CTA

Example

8- IMD Faculty Banner

Features

1. Split blue background with image
2. Title and description fields
3. Up to one CTA
4. Option to add a popup. The popup has a title and a description field with a property to add buttons at the end

Example

9- IMD Text Hero

Features

1. Blue background with a gradient
2. Title and description fields

Example

10- IMD R&K Article Banner

Features

1. Option to choose from 4 hero types (styles):
   • Split text image: A blue slash with an image
   • Split text no image: A blue slash without an image
   • Banner Image with Full gradient
   • Banner Image with gradient: An image with half a gradient
2. Option to add a dark overlay on the image
3. Pre title, title, description, authors, and date fields
4. Option to upload an image
5. Option to embed a YouTube/Wistia video
6. Option to add one CTA
7. Option to add a reference

Example: