Feature Boxes
Feature boxes are a card-based format used for displaying text and images together in a consistent group. Used sparingly on the MCCMS website, they allow for slider functionality and can each contain buttons with links. The height of each feature card matches the height of the feature box with the most content to remain consistent across the page.
/10x0:340x220/prod01/channel_8/media/studio-sites/studio-sites-template/studio-site-720X480.jpg)
Heading for feature box 1
This is the description field for the card. The image on a feature card should be resized to 720x480 before uploading to the T4 Media Library.
It is recommended to add a link to all feature boxes.
Total box height matches the box height of the feature box that contains the most text.
/0x0:720x480/prod01/channel_8/media/training/studio-site-training-guide-photos/720X480-surgicalphoto-example.jpg)
Heading text
This is the description field for a card that doesn't include any links and has very little text.
It is not recommended to use feature boxes without links as you can see this box is still clickable but will not take you anywhere.
/0x0:720x480/prod01/channel_8/media/training/studio-site-training-guide-photos/720X480-WF761288_0016.jpg)
Heading for feature box 3
Feature box 3 has a description with a lot of text and a button link.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur consectetur lacinia ligula, id volutpat dolor mattis vel. Pellentesque porta a urna vel porta. Nullam eu massa id orci aliquet imperdiet ut non tellus. Maecenas molestie massa enim. Phasellus quis arcu semper, accumsan dui sed, faucibus nulla. Mauris congue enim id ante dictum bibendum. Nullam facilisis nisi a neque dictum efficitur. Ut tempor ornare aliquet.
How to add feature boxes to a Studio Site page
From the T4 Site Structure, navigate to the page you are updating.
- Click Add Content.
- Select Feature boxes from the list of content types.
- Use the following content elements:
- Name: Add descriptive name
- Main heading: Optional, used to add a main H3 heading above a group of feature boxes.
- Main description: Optional, used to add a main description (sentence or paragraph) above a group of multiple feature boxes.
- Slider: Select to add clickable arrows page visitors can use to manually scroll through a minimum of four consecutive feature boxes.
- Select image: Click 'Select media' to navigate to the image for the feature box that has been uploaded to the T4 Media Library. The image must be resized to 720x480.
- Heading: Used to add the bold heading/title of the individual feature box.
- Description: Used to add the content within the individual feature box. Do not add links to the text in the description field of a Feature Box.
- Open link in new tab: Select to have the link open in a new tab.
- Use only one of the following:
- Link (internal): Use to link to a different section or content within the MCCMS website.
- Link (external): Paste the URL to an external website (any webpage that does not contain college.mayo.edu as part of the URL.
- CTA link text: Enter text to be used on the button of the feature box.
- Click Save Changes to save content as a draft. Preview your updates and ensure the content displays appropriately, follows MCCMS Styles and Standards, and is free of errors. If everything displays correctly in the preview, approve the updates to be published.