Please ensure Javascript is enabled for purposes of website accessibility Icon Boxes | University of West Florida
Skip to main content
Logo of University of West Florida

Icon Boxes

The Icon Boxes content type utilizes the Font Awesome Pro icon set with over 14,800 icons to choose from for web managers to add fully accessible graphics to their pages.

Important Information

Add one Icon Box per icon/column. There is no maximum number of icons you can use, but rows are limited to a max of 3 and new rows will start automatically. Visit the Font Awesome Icon Library to select your icon, and click or tap on your desired icon. Inside that page, copy out the icon class, e.g. "fab fa-500px". You will need this (without quotation marks) inside the content type to pull in your icon. OIC has purchased a pro account, so ALL icons at this link should be available for use.

At a Glance

  • Requires Placeholder: No
  • Placement: Almost anywhere
  • Special Setup: None
  • Image Sizes: Uses Font Awesome Icons. See below for more information.

Icon Boxes contains the following elements:

  • Name - Used in Sitemanager only. This does NOT show up on your webpage.
  • Heading - This will be your content heading. Larger, bold text with extra spacing.
  • Header Type - (<h2>) by default
  • Icon Size - Font Awesome Icon Sizes. The examples below use "4x".
  • Font Awesome Classes - The two icon classes from Font Awesome, e.g. “fas fa-user-graduate”
  • Icon Label - Enter a short description of the icon for accessibility.
  • Icon Color - Sets the color of the icon itself.
  • Title - Optional header text under the icon.
  • Title Header Type - for font size only. Actual header tags are not used here so do not worry about accessibility and properly nesting headers.
  • Title Internal Link - Use this to send users to another uwf.edu webpage when they click or tap the title.
  • Title External Link - Use this to send users to an external site when they click or tap the title.
  • Body - The main area for your content.

Icon Boxes: Example

Sample Heading

Students Rule

You can add text here if you like, but it is not required.

Worldwide Impact

The icons you see here are using the 4x size option.

Winner Winner

3 icons max (this is not adjustable) per row.

New Row

The 4th icon will start a new, centered row.

New Row

If icon boxes don't fill a row, they will be centered in the space.