Add a Link Grid (Navigation Menu)

[   User Guide Navigation]

Page Design & Structure Add a Link Grid (Navigation Menu)

A link grid is a navigation menu that typically appears below the banner title and banner image (if present). If you choose the "front page" theme type when applying a theme to a page, a link grid is added automatically with preconfigured links. You can also use the Link Grid tool to manually add or edit a navigation menu on a page. Regardless of how the link grid was added, the interface for modifying it is the same.

 Tips for Link Grids

  1. Use link grids sparingly. They are most commonly used on the course home (front) page, but there may be other situations when they are appropriate.
  2. When linking to external content in the link grid, configure the link to open in a new tab.

Examples

Here are some examples of the same link grid with different institutional styles applied

Instructions

Add a link grid to a page

  1. Place your cursor in the editor where you want the link grid to go.
  2. Open the Add New Elements ( ) tab in the sidebar.
  3. Select the Link Grid tool. The Edit Current Element ( ) tab opens with Link Grid selected as the active tool.
    Link Grid button
  4. Use the Content panel to configure the following for each link:
    Link Grid: Content Panel

    • Items - use the number field, , , or icons to add or remove items from the list.
    • Alignment - aligns icon + link text for all links in grid.
    •   Display order - use the handles to drag links to their desired location.
    •   Icon - click the placeholder or default icon to select the desired icon.
    • Link Text - enter desired link text.
    •  Link Destination - enter the desired link destination. This is a shortcut to the Link tool, where you can set the destination for each Link List item. You'll need to reselect Link Grid as the active tool to continue editing the list.
  5. Open the Style panel:
    1. Expand the Custom Themes panel and then open Link Grid Styles to set or change the style and layout of the link grid. Select the desired style from the available options.
      Link Grid: Style Panel

    2. Use the column control options in the Style panel to set the number of links (or columns) that will appear on each row on a large (desktop), medium (laptop, large tablet), and small (small tablet, phone) screen.
      Link Grid: Style: Column Control 

Edit a Link Grid 

  1. Select the Edit Current Element ( ) tab in the sidebar.
  2. Place your cursor within the link grid.
  3. Choose Link Grid as the active tool:
    Link Grid button
  4. Use the options available in the Content and Style panels to make the desired changes as described in steps 4–5 in the previous section.

Learn More

Cidi Labs DesignPLUS User Guide: Link Grid