大象传媒

Skip to main content
School of Medicine IT Web Guide

Icon Boxes

Creating An Icon Box

Many fields are self explanatory and will not be addressed in this documentation. This documentation will focus on tips, best practices and explanation of fields that generally need some clarification.

  1. Determine where the Cell will be used.
  2. In the Dashboard, select Cells in either the top or left-hand navigation.
  3. Select the Add New button.
  4. Cell Name: provide a descriptive name so that site editors understand the purpose or placement of the cell. This field does not display anywhere other than in the Dashboard where it lists all Cells for a website.
  5. Layout: Repeatable Boxes
  6. Box Category: Icon Link Boxes
  7. Box Style: Icon Box
  8. Define the base settings:
    1. Primary Heading 补苍诲听Primary Text: heading and text fields that display above the icon boxes.
    2. Add Title Accent Underline: show or hide the short yellow accent line that displays under the Primary Heading.
    3. Background Color Options: choose the color of the icons
    4. Include Link (Global): selecting Yes will provide you with the choice of adding an optional link per box.
    5. Column Layout: choose the number of columns in which the icon boxes will be arranged.
      • The four column layout only works on pages without left-hand navigation (e.g.: a web site’s home page). This is to prevent the content from getting too squished. Look at the examples to see what it looks like on a page with and without left-hand navigation.
  9. For each box:
    1. Select the Add New Box button.
    2. Icon: click the聽Valid Icons聽link below the field to browse the available icon options. You can also reference our聽short list of popular icons聽for School of Medicine websites. Once you鈥檝e selected an icon, add it鈥檚聽name聽to the聽Icon聽field in Cells.
      Screenshot showing the location of the Valid Icons link below the Icon field.
    3. Box Heading: this is the main heading of the icon box. Provide a clear indication of the topic of the box.
    4. Box Text: this is the description within the icon box. Provide additional information related to the box heading.
    5. Include Link (Box): each box has the option of linking to a webpage.
    6. More Link Text: this is the text that appears in the button at the bottom of the icon box. Provide a short description of where the box links to. This field is restricted to 30 characters. Ensure the text you add is meaningful and descriptive – view our accessibility documentation for more information. This option only appears if you select Yes to Include Link.
  10. Click the Create Cell button.
  11. If you’re ready, you can display the Cell on your website.