Menu Loop

  <ul>
    <Note>#1</Note>
    <Loop type=menu menu="CTA Blocks">
      <Note>#2</Note>
      <li class="menu-item menu-item-{Field id}">
        <Note>#3</Note>
        <a href="{Field url}" target="{Field target}" rel="noopener">
          <Note>#4</Note>
          <div><Field title /></div>
          <div><Field description /></div>
          <div>Visit</div>
        </a>
      </li>
    </Loop>
  </ul>
  1. <Loop type=menu> outputs menu items in a given menu. The menu attribute expects the title or ID of a menu.
  2. Each menu item has an ID, sort of like a post. The ID is useful for generating HTML IDs or unique classnames for styling or Javascript.
  3. The menu loop returns not only the URL of each item, but also the link target for custom menu items, which can be set to open in new tabs.
  4. Finally! A use for the menu item description!