Canvas Docs

Icon Nav List

A vertical Bootstrap .nav icon-link list (nav-item > nav-link > icon + text), used by off-canvas menu panels. It is shown in the block inserter as Canvas Icon Nav List and registered as canvas-core/icon-nav-list.

Select the block on a page and its own settings open in the sidebar, in the panels below:

The Icon Nav List settings in the block editor sidebar

Settings

Each setting is named exactly as the block editor names it, followed by what it does and what it starts as. Where a setting carries a Shown when line, it stays hidden until that condition is met, which is the usual reason a setting looks missing from the sidebar:

Layout

  • List ElementDefaultList (default)

    A list whose links are not list items uses a plain container: the shape a Bootstrap list group has.

    ChoicesList (default)Plain containerNavigation landmark

  • Wrap Each Link in a List ItemDefaultOn

    Off places the links directly in the list, with no .nav-item wrapper. Always off when the list is not a .

  • Bootstrap Nav Base ClassesDefaultOn

    Emits "nav … flex-column" on the list. Off leaves the list carrying only the class named below, for a design whose own component class replaces them.

  • Link ClassesDefaultEmpty

    Replaces nav-link on every link. Empty keeps nav-link.

  • Icon PositionDefaultBefore the text, inside it

    After places the icon as a sibling of the text box, which is how a list group pushes it to the far end of the row.

    ChoicesBefore the textinside itAfter the textbeside it

  • Icon ClassesDefaultEmpty

    Utility classes on every icon. Empty keeps me-2; enter "none" for a bare icon.

Settings

  • Nav Modifier Class (Optional)DefaultEmpty

    Extra class inserted between "nav" and "flex-column" on the wrapping (e.g. "primary-nav" for the off-canvas panel's main list). Leave empty for a plain "nav flex-column" secondary list.

Items

  • ItemsDefaultEmpty

    The links in the list, in the order given here. Nothing is shown until you add at least one.

    Each row of Items takes:

    • IconDefaultbi-house

      e.g. bi-house. Leave empty for a text-only item.

    • TextDefaultMenu item

      Wording of this link.

    • URLDefault#

      Address this link opens.

Every Canvas block also carries the Animation, Scroll Effects and Advanced panels, which are described in Controls every Canvas block has.

Other blocks in Header: App Menu, Header Button, Header Cart, Header Container, Header Icon Link, Header Info.

Was this page helpful?
Icon Nav List · Canvas WP Docs