Cards

1- IMD Next Session Cards

This block is always used to display next sessions for a program. This block pulls data automatically from the program metadata, so you don’t have to do any manual work. Simply add the block, and choose the program you want from the list of programs.

Features

1. Blue background
2. Automatic data pulling
3. Manual data entry option
4. Title, description (below the title), and additional text (below the cards)
5. Option to add a CTA
6. Two option for the apply link behavior: open in the same/a new tab

3- IMD Program Cards

This block can be used to add program cards, program cards with a filter, and marketplace programs dynamically.

Features

1. Option to choose from two CTA styles: Text arrow and Button
2. Option to display “Download brochure” CTA
3. Options to show/hide card title, description, tag line, top tag, course mode filters, card image, faculty, next program date, location, duration, and program dates
4. Option to inherit the “Download brochure” CTA from the program metadata. To do this, set both ‘Display Brochure Link’ and ‘Inherit Display Brochure from program’ to ‘Yes’ respectively
5. Option to display 3 or 4 cards per row
6. Cards Behavior : you can add different types of cards within the same block: manual , automatic or promotional
7. Cards:
   • Manual selection
   • Automatic content (Filter by Category)
   • Promotional card:
     • Title
     • Description (WYSIWYG)
     • CTA
     • Background color
8. Options to choose from 4 the background colors: white, grey, blue, and green

IMD Single Program Card

This block can be used to add 1 card, program, marketplace program or promotional card inside or outside a container or a column block.

Features

1. Option to choose from two CTA styles: Text arrow and Button
2. Option to display “Download brochure” CTA
3. Options to show/hide card title, description, tag line, top tag, course mode filters, card image, faculty, next program date, location, duration, and program dates
4. Option to inherit the “Download brochure” CTA from the program metadata. To do this, set both ‘Display Brochure Link’ and ‘Inherit Display Brochure from program’ to ‘Yes’ respectively
5. Card:
   • Manual selection
   • Promotional card:
     • Title
     • Description (WYSIWYG)
     • CTA

Example 1: Single Program card without a container

Example 2: Single Program card with a container

4- IMD specific card blocks

These blocks replace the functionality offered by the old IMD Cards block, allowing for a more performant backend experience. We have now a whole set of specific blocks to add Events, Bios (Faculty or Member), News, Publications and Reflections in a card-like fashion, both dynamic or manually picked from a list. Each one of the specific block allows adding custom cards with only the relevant fields, and the new IMD Custom Cards block allows to add fully customized cards, including video coming from Youtube or Wistia

The available blocks are:

• IMD Event Cards block
• IMD Persona Cards block (covering Faculty and Member post types)
• IMD News Cards block
• IMD Publication Cards block
• IMD Reflection Cards block
• IMD Custom Cards block

Common features

1. Title and description fields for the block 
2. Select card size: Small, 4 cards per row, or Medium, 3 cards per row 
3. Choose the scroll Orientation: stacked cards or horizontal scroll 
4. Option to choose from two background colors: white or grey 
5. Options to use a set of filters to retrieve content, or manually pick posts.
6. Option to add custom cards
7. Options to show/hide the different elements inside the card: Title, description, image, etc. 
8. Show or Hide “Show more” Button (infinite scroll switch) 
9. Option to add content in a popup 

IMD Single Card

This block can be used to add 1 Event, Research & Knowledge publication, News, Faculty bio, and faculty publication (article) in a dynamic or manual way. inside or outside a container or a column block.

Features

1. Option to show/hide: card image, top tag, topics, description, location, Author, and date
2. Option to open in a new tab
3. Option to add an embedded YouTube/Wistia video to the card. When using a video
4. Option to add content in a popup 

Example 1: Manual selection of News outside container/column

Example 2: Custom option used to add a video card inside container

Title goes here

Description goes here

Watch now

5- IMD Large Cards No Image [2]

Features

1. Each card has a title and description fields
2. One CTA per card
3. Option to choose the style of the button
4. Option to to add a form/workflow in the button

Example

6- IMD Full-width Text and Image

This block showcases an image with text. It’s flexible and can be used on multiple scenarios. Note that this block is always used in the “Is this program for me?” section of every program. It can also be used in the class profile section of a program if the section doesn’t have stats.

Features

1. Title and description fields
2. Option to choose from two background colors: white or grey
3. Options to control the size (viewport or container size), layout (Image on the left or the right), and title color (blue/black)
4. Three options to control the image and text sizes:
   1. Picture 40 – Text 60: this is the default behavior of the block. In this mode, the text takes more space than the image
   2. Picture 60 – Text 40: in this mode, the picture takes more space than the text. Use it if the image is more important than the text
   3. Picture 50 – 50
5. One CTA
6. Option to choose the style of the button
7. Option to to add a form/workflow in the button
8. Option to add another image under the text
9. Option to add a padding around the main image

7- IMD Cascading Cards [3]

Features

1. Title field for the block
2. One CTA for the block in general
3. Option to choose from two background colors: white or grey
4. Title and description fields for each card
5. One CTA per card
6. Option to choose the style of the button
7. Option to to add a form/workflow in the button
8. Two card types: image as content (cascade effect) and image as background
9. Two options to choose the cards alignment:
   • Cascading: this options keeps the cascading effect
   • In line: this option turns off the cascading effect and changes the cards to be top aligned
10. Options to control the title alignment: Left, Center, Right

8- IMD Post-it [4]

This block is always used to represent the program benefits in the overview page of all programs. However, it’s not only used for benefits as it fits various scenarios. So, feel free to use it if it fullfill your desired outcome.

Features

1. Title field for the block
2. Option to choose from two background colors: white or grey
3. Title and description fields for each card
4. Option to add a link to each card with a property to open links in a new tab
5. Option to change the card’s title color

9- IMD Horizontal Cards

Features

1. Title field for the block
2. Option to choose from two background colors: white or grey
3. Title, subtitle, and description fields for each card
4. Up to two CTAs per card
5. Option to add a popup

Example

10- IMD Large Ranking Cards [2]

Features

1. Title and description fields for the block
2. Option to choose from two background colors: white or grey
3. Each card has a description field and a CTA

11- IMD Certificate Cards

This block is used on the online certificate page.

Features

1. Title and description fields for each card
2. Option to choose from two styles

12- IMD Diploma Cards

This block is used in the diploma pages.

Features

1. Title and description fields for the block
2. Option to choose from two background colors: white and grey
3. Each card has a name, board status, job title, description, and timeline title fields
4. Option to select programs automatically or/and add text manually.

13- IMD Cascading Circle Cards

Features

1. Title and description fields for the block
2. Option to choose from two background colors: white or grey
3. Option to choose from three slide types: Custom, Center Manual Selection, Dynamic centers
   1. Custom: You can add any image, any title, and any description you want. Below are the features that you’ll have if you choose Custom:
      1. Option to add an image
      2. Title and description fields
      3. Add one CTA per slide
   2. Center Manual Selection: You can choose from a list of centers and initiatives
   3. Dynamic Centers: This option works like a filter, so based on your input, the block will display appropriate centers or initiatives. Below are the features that you’ll have if you choose Dynamic Centers:
      1. Category: Select from two categories: Initiative or Center
      2. Topics: Choose from a list of topics
      3. Max Number of Centers: Choose the max number of centers to display. Remember, the centers that will display are based on the criteria you set i.e. the category and topics.

14- IMD News Grid

Features

1. Title and description fields for the block
2. Option to choose from three background colors: white, blue, or grey
3. Option to choose from three card types: Custom, News Manual Selection, Dynamic News
   1. Custom: You can add any image, any title, and any description you want. Below are the features that you’ll have if you choose Custom:
      1. Option to add an image
      2. Title and description fields
      3. Add one CTA per card
   2. News Manual Selection: You can choose from a list of news articles
   3. Dynamic News: This option works like a filter, so based on your input, the block will display appropriate news articles. Below are the features that you’ll have if you choose Dynamic News:
      1. IMD Product type: Select the product type you need
      2. Topics: Choose from a list of topics
      3. Max Number of News: Choose the max number of news to display. This block can show 3 news articles at max

15- IMD Text and CTA Card

Features

1. Title and description fields for the block
2. Option to choose from three background colors: white, blue, or grey
3. Option to choose the card color. The available colors are white, blue, or grey
4. Each card has a tag, a title, and a description field
5. Each card has one CTA
6. Option to choose the style of the button
7. Option to to add a form/workflow in the button

16- IMD Upcoming Events with a Highlight

This block displays events automatically based on their start date with an option to highlight one event in a special card.

Features

1. Title field for the block
2. Option to choose from 2 background colors: white and grey
3. Field to choose the number of events you want
4. A list where you can choose a specific event to highlight it
5. Option to add a custom button
6. Option to choose the style of the button
7. Option to to add a form/workflow in the button

17- IMD Highlighted Event

Features

1. Title, description, date, location, and tag fields
2. Option to choose from two background colors: white or grey on the portrait layout
3. Image as a background
4. One CTA
5. Option to choose the style of the button
6. Option to to add a form/workflow in the button

Example

18- IMD Minimal Cards no Background [3]

Features

1. Option to choose between 3 background colours: White, Grey, Blue  
2. Option to add a title and a description above the cards  
3. Option to add 3 cards per row  
4. Each card contains: Image, title, description and a link  
5. All the card area is clickable in case there is a link/No button 

19- IMD Testimonials 

This block is used to add testimonial cards. 

Features

1. Option to choose from 4 Scroll orientation features
2. Title and description field for the block
3. Each card has the following fields:
   • Name field
   • Position field
   • Image field
   • Title filed
   • Quote field
4. Option to choose from 4 background colors: white, grey, blue, and green

20- IMD Sessions highlighted card

This is a dynamic block that is used to add a highlighted program card.

Features

1. Option to upload three images for the three different resolutions:
   • Background Image Large: for desktop
   • Background Image Medium: for tablet
   • Background Image Small: for mobile
2. A filed where you can select the program you want from a list
3. Options to choose from 4 the background colors: white, grey, blue, and green

Example:

20 – IMD Grid

Features

1. Title and description fields for the block
2. Option to choose from four background colors: white, grey, blue and green
3. Option of having a list of rows/columns
   • Max 4 columns per row, min 1 column per row
4. When adding the card to the columns, add the possibility of choosing between content type
   • Mixed: you can either choose custom( Adding manually: image, title, description, button), or News (typing the title of the news article in the search box and adding it)
   • News only: you can only add news by typing the title of the news article and add it

Example 1 (Mixed content)

Example 2 (News only)