You are here

mmenu-primary-navigation.html.twig in Mobile sliding menu 8

<!--<li><a href="/">Home</a></li>-->
<!--<li><a href="/about">About us</a>-->
<!--<ul>-->
<!--<li><a href="/about/history">History</a></li>-->
<!--<li><a href="/about/team">The team</a></li>-->
<!--<li><a href="/about/address">Our address</a></li>-->
<!--</ul>-->
<!--</li>-->
<!--<li><a href="/contact">Contact</a></li>-->



  <ul>
    <li><a href="/"><i class="fa fa-home"></i>Home</a></li>
    <li class="Divider">jQuery.mmenu plugin</li>
    <li><a href="/whats-new.html"><i class="fa fa-lightbulb-o"></i>What's new</a></li>
    <li class="Selected"><a href="/examples.html"><i class="fa fa-code"></i>Examples & Playground</a></li>
    <li>
      <span><i class="fa fa-graduation-cap"></i>Tutorials</span>
      <ul>
        <li>
          <span>Basic off-canvas menu</span>
          <div>
            <p>This tutorial guides you through the first steps of creating an app look-alike sliding menu for your website and webapp.</p>
            <ul>
              <li><a href="/tutorials/off-canvas">Getting started</a></li>
              <li><a href="/tutorials/off-canvas/the-page.html">The page</a></li>
              <li><a href="/tutorials/off-canvas/the-menu.html">The menu</a></li>
              <li><a href="/tutorials/off-canvas/styling-lists.html">Styling lists</a></li>
              <li><a href="/tutorials/off-canvas/fire-the-plugin.html">Fire the plugin</a></li>
              <li><a href="/tutorials/off-canvas/open-and-close-the-menu.html">Open and close the menu</a></li>
              <li><a href="/tutorials/off-canvas/learn-more.html">Learn more</a></li>
              <li><a href="/tutorials/off-canvas/video.html">Video tutorial</a></li>
            </ul>
          </div>
        </li>
        <li>
          <span>Advanced menu with rich content</span>
          <div>
            <p>This tutorial shows you how you can create an advanced menu with rich content.</p>
            <ul>
              <li><a href="/tutorials/advanced">Getting started</a></li>
              <li><a href="/tutorials/advanced/the-menu.html">The menu</a></li>
              <li><a href="/tutorials/advanced/styling-lists.html">Styling lists</a></li>
              <li><a href="/tutorials/advanced/thumbnail-grid.html">Thumbnail grid</a></li>
              <li><a href="/tutorials/advanced/learn-more.html">Learn more</a></li>
            </ul>
          </div>
        </li>
        <li>
          <span>Mobile navigation headers</span>
          <div>
            <p>This tutorial guides you through the first steps of creating beautiful mobile navigation header.</p>
            <ul>
              <li><a href="/tutorials/mhead-plugin">Getting started</a></li>
              <li><a href="/tutorials/mhead-plugin/the-header.html">The header</a></li>
              <li><a href="/tutorials/mhead-plugin/fire-the-plugin.html">Fire the plugin</a></li>
              <li><a href="/tutorials/mhead-plugin/learn-more.html">Learn more</a></li>
            </ul>
          </div>
        </li>
        <li><a href="/tutorials/dynamic-content.html">Dynamic content</a></li>
        <li><a href="/tutorials/animated-hamburger.html">Animated hamburger icon</a></li>
      </ul>
    </li>
    <li>
      <span><i class="fa fa-file-text-o"></i>Documentation</span>
      <ul>
        <li>
          <span>Core</span>
          <div>
            <p>The plugin core consists of the actual plugin and some essential add-ons.</p>
            <ul>
              <li><a href="/documentation/core">Introduction</a></li>
              <li><a href="/documentation/core/options.html">Options</a></li>
              <li><a href="/documentation/core/configuration.html">Configuration</a></li>
              <li><a href="/documentation/core/api.html">API</a></li>
              <li><a href="/documentation/core/scss.html">CSS &amp; SCSS</a></li>
              <li class="Divider">Core add-ons</li>
              <li><a href="/documentation/core/off-canvas.html">Off-canvas</a></li>
              <li><a href="/documentation/core/screen-reader.html">Screen reader</a></li>
              <li><a href="/documentation/core/scroll-bug-fix.html">Scroll bug fix</a></li>
            </ul>
          </div>
        </li>
        <li>
          <span>Extensions</span>
          <div>
            <p>With these extensions, you can easily extend the look and feel of your menu.</p>
            <ul>
              <li><a href="/documentation/extensions">Introduction</a></li>
              <li class="Divider">Available extensions</li>
              <li><a href="/documentation/extensions/border-style.html">Border style</a></li>
              <li><a href="/documentation/extensions/effects.html">Effects</a></li>
              <li><a href="/documentation/extensions/fullscreen.html">Fullscreen</a></li>
              <li><a href="/documentation/extensions/listview.html">Listview</a></li>
              <li><a href="/documentation/extensions/multiline.html">Multiline</a></li>
              <li><a href="/documentation/extensions/page-dim.html">Page dim</a></li>
              <li><a href="/documentation/extensions/popup.html">Popup</a></li>
              <li><a href="/documentation/extensions/positioning.html">Positioning</a></li>
              <li><a href="/documentation/extensions/shadows.html"><em class="Counter badge">UPDATE</em>Shadows</a></li>
              <li><a href="/documentation/extensions/themes.html">Themes</a></li>
              <li><a href="/documentation/extensions/tileview.html">Tileview</a></li>
            </ul>
          </div>
        </li>
        <li>
          <span>Add-ons</span>
          <div>
            <p>With these add-ons, you can easily add additional behavior to your menu.</p>
            <ul>
              <li><a href="/documentation/addons">Introduction</a></li>
              <li class="Divider">Available add-ons</li>
              <li><a href="/documentation/addons/auto-height.html">Auto height</a></li>
              <li><a href="/documentation/addons/back-button.html">Back button</a></li>
              <li><a href="/documentation/addons/columns.html">Columns</a></li>
              <li><a href="/documentation/addons/counters.html">Counters</a></li>
              <li><a href="/documentation/addons/dividers.html">Dividers</a></li>
              <li><a href="/documentation/addons/drag.html">Drag</a></li>
              <li><a href="/documentation/addons/dropdown.html">Dropdown</a></li>
              <li><a href="/documentation/addons/fixed-elements.html">Fixed elements</a></li>
              <li><a href="/documentation/addons/iconbar.html">Iconbar</a></li>
              <li><a href="/documentation/addons/icon-panels.html">Icon panels</a></li>
              <li><a href="/documentation/addons/keyboard-navigation.html">Keyboard navigation</a></li>
              <li><a href="/documentation/addons/lazy-submenus.html">Lazy submenus</a></li>
              <li><a href="/documentation/addons/navbars.html">Navbars</a></li>
              <li><a href="/documentation/addons/page-scroll.html">Page scroll</a></li>
              <li><a href="/documentation/addons/searchfield.html">Searchfield</a></li>
              <li><a href="/documentation/addons/section-indexer.html">Section indexer</a></li>
              <li><a href="/documentation/addons/set-selected.html">Set selected</a></li>
              <li><a href="/documentation/addons/sidebar.html">Sidebar</a></li>
              <li><a href="/documentation/addons/toggles.html">Toggles</a></li>
            </ul>
          </div>
        </li>
        <li>
          <span>Framework wrappers</span>
          <div>
            <p>Fix the quirks that the jQuery.mmenu plugin has with popular frameworks using these framework wrappers.</p>
            <ul>
              <li><a href="/documentation/wrappers">Introduction</a></li>
              <li class="Divider">Available framework wrappers</li>
              <li><a href="/documentation/wrappers/angular.html">Angular</a></li>
              <li><a href="/documentation/wrappers/bootstrap.html"><em class="Counter badge">UPDATE</em>Bootstrap</a></li>
              <li><a href="/documentation/wrappers/jquery-mobile.html">jQuery Mobile</a></li>
              <li><a href="/documentation/wrappers/magento.html">Magento</a></li>
              <li><a href="/documentation/wrappers/olark.html">Olark</a></li>
              <li><a href="/documentation/wrappers/turbolinks.html">Turbolinks</a></li>
              <li><a href="/documentation/wrappers/wordpress.html">WordPress</a></li>
            </ul>
          </div>
        </li>
        <li><a href="/documentation/translations.html">Translations</a></li>
        <li><a href="/documentation/custom-build.html">Custom build</a></li>
        <li><a href="/documentation/changelog.html">Changelog</a></li>
      </ul>
    </li>
    <li><a href="/on-and-off-canvas.html"><i class="fa fa-arrows-h"></i>On- and Off-canvas</a></li>
    <li><a href="/download.html"><i class="fa fa-download"></i>Download &amp; License information</a></li>
    <li><a href="https://github.com/FrDH/jQuery.mmenu" target="_blank"><i class="fa fa-github"></i>Fork us on GitHub</a></li>
    <li>
      <span><i class="fa fa-support"></i>Support</span>
      <ul>
        <li><a href="/support/tips-and-tricks.html">Tips and tricks</a></li>
        <li><a href="/support/problem-solving.html">Problem solving</a></li>
        <li><a href="/support/contact.html">Contact</a></li>
      </ul>
    </li>
    <li class="Divider">Also available</li>
    <li><a href="/wordpress-plugin"><i class="fa fa-wordpress"></i>mmenu WordPress plugin</a></li>
    <li><a href="/mhead-plugin"><i class="fa fa-bars"></i>jQuery.mhead plugin</a></li>
    <li id="donate">
      <p>The jQuery.mmenu plugin is open source software,
        you are free to use the jQuery.mmenu plugin for your personal or non-profit websites.
        For commercial usage, please <a href="/download.html">purchase a license</a>.</p>
    </li>
  </ul>

File

templates/mmenu-primary-navigation.html.twig
View source
  1. <!--<li><a href="/">Home</a></li>-->
  2. <!--<li><a href="/about">About us</a>-->
  3. <!--<ul>-->
  4. <!--<li><a href="/about/history">History</a></li>-->
  5. <!--<li><a href="/about/team">The team</a></li>-->
  6. <!--<li><a href="/about/address">Our address</a></li>-->
  7. <!--</ul>-->
  8. <!--</li>-->
  9. <!--<li><a href="/contact">Contact</a></li>-->
  10. <ul>
  11. <li><a href="/"><i class="fa fa-home"></i>Home</a></li>
  12. <li class="Divider">jQuery.mmenu plugin</li>
  13. <li><a href="/whats-new.html"><i class="fa fa-lightbulb-o"></i>What's new</a></li>
  14. <li class="Selected"><a href="/examples.html"><i class="fa fa-code"></i>Examples & Playground</a></li>
  15. <li>
  16. <span><i class="fa fa-graduation-cap"></i>Tutorials</span>
  17. <ul>
  18. <li>
  19. <span>Basic off-canvas menu</span>
  20. <div>
  21. <p>This tutorial guides you through the first steps of creating an app look-alike sliding menu for your website and webapp.</p>
  22. <ul>
  23. <li><a href="/tutorials/off-canvas">Getting started</a></li>
  24. <li><a href="/tutorials/off-canvas/the-page.html">The page</a></li>
  25. <li><a href="/tutorials/off-canvas/the-menu.html">The menu</a></li>
  26. <li><a href="/tutorials/off-canvas/styling-lists.html">Styling lists</a></li>
  27. <li><a href="/tutorials/off-canvas/fire-the-plugin.html">Fire the plugin</a></li>
  28. <li><a href="/tutorials/off-canvas/open-and-close-the-menu.html">Open and close the menu</a></li>
  29. <li><a href="/tutorials/off-canvas/learn-more.html">Learn more</a></li>
  30. <li><a href="/tutorials/off-canvas/video.html">Video tutorial</a></li>
  31. </ul>
  32. </div>
  33. </li>
  34. <li>
  35. <span>Advanced menu with rich content</span>
  36. <div>
  37. <p>This tutorial shows you how you can create an advanced menu with rich content.</p>
  38. <ul>
  39. <li><a href="/tutorials/advanced">Getting started</a></li>
  40. <li><a href="/tutorials/advanced/the-menu.html">The menu</a></li>
  41. <li><a href="/tutorials/advanced/styling-lists.html">Styling lists</a></li>
  42. <li><a href="/tutorials/advanced/thumbnail-grid.html">Thumbnail grid</a></li>
  43. <li><a href="/tutorials/advanced/learn-more.html">Learn more</a></li>
  44. </ul>
  45. </div>
  46. </li>
  47. <li>
  48. <span>Mobile navigation headers</span>
  49. <div>
  50. <p>This tutorial guides you through the first steps of creating beautiful mobile navigation header.</p>
  51. <ul>
  52. <li><a href="/tutorials/mhead-plugin">Getting started</a></li>
  53. <li><a href="/tutorials/mhead-plugin/the-header.html">The header</a></li>
  54. <li><a href="/tutorials/mhead-plugin/fire-the-plugin.html">Fire the plugin</a></li>
  55. <li><a href="/tutorials/mhead-plugin/learn-more.html">Learn more</a></li>
  56. </ul>
  57. </div>
  58. </li>
  59. <li><a href="/tutorials/dynamic-content.html">Dynamic content</a></li>
  60. <li><a href="/tutorials/animated-hamburger.html">Animated hamburger icon</a></li>
  61. </ul>
  62. </li>
  63. <li>
  64. <span><i class="fa fa-file-text-o"></i>Documentation</span>
  65. <ul>
  66. <li>
  67. <span>Core</span>
  68. <div>
  69. <p>The plugin core consists of the actual plugin and some essential add-ons.</p>
  70. <ul>
  71. <li><a href="/documentation/core">Introduction</a></li>
  72. <li><a href="/documentation/core/options.html">Options</a></li>
  73. <li><a href="/documentation/core/configuration.html">Configuration</a></li>
  74. <li><a href="/documentation/core/api.html">API</a></li>
  75. <li><a href="/documentation/core/scss.html">CSS &amp; SCSS</a></li>
  76. <li class="Divider">Core add-ons</li>
  77. <li><a href="/documentation/core/off-canvas.html">Off-canvas</a></li>
  78. <li><a href="/documentation/core/screen-reader.html">Screen reader</a></li>
  79. <li><a href="/documentation/core/scroll-bug-fix.html">Scroll bug fix</a></li>
  80. </ul>
  81. </div>
  82. </li>
  83. <li>
  84. <span>Extensions</span>
  85. <div>
  86. <p>With these extensions, you can easily extend the look and feel of your menu.</p>
  87. <ul>
  88. <li><a href="/documentation/extensions">Introduction</a></li>
  89. <li class="Divider">Available extensions</li>
  90. <li><a href="/documentation/extensions/border-style.html">Border style</a></li>
  91. <li><a href="/documentation/extensions/effects.html">Effects</a></li>
  92. <li><a href="/documentation/extensions/fullscreen.html">Fullscreen</a></li>
  93. <li><a href="/documentation/extensions/listview.html">Listview</a></li>
  94. <li><a href="/documentation/extensions/multiline.html">Multiline</a></li>
  95. <li><a href="/documentation/extensions/page-dim.html">Page dim</a></li>
  96. <li><a href="/documentation/extensions/popup.html">Popup</a></li>
  97. <li><a href="/documentation/extensions/positioning.html">Positioning</a></li>
  98. <li><a href="/documentation/extensions/shadows.html"><em class="Counter badge">UPDATE</em>Shadows</a></li>
  99. <li><a href="/documentation/extensions/themes.html">Themes</a></li>
  100. <li><a href="/documentation/extensions/tileview.html">Tileview</a></li>
  101. </ul>
  102. </div>
  103. </li>
  104. <li>
  105. <span>Add-ons</span>
  106. <div>
  107. <p>With these add-ons, you can easily add additional behavior to your menu.</p>
  108. <ul>
  109. <li><a href="/documentation/addons">Introduction</a></li>
  110. <li class="Divider">Available add-ons</li>
  111. <li><a href="/documentation/addons/auto-height.html">Auto height</a></li>
  112. <li><a href="/documentation/addons/back-button.html">Back button</a></li>
  113. <li><a href="/documentation/addons/columns.html">Columns</a></li>
  114. <li><a href="/documentation/addons/counters.html">Counters</a></li>
  115. <li><a href="/documentation/addons/dividers.html">Dividers</a></li>
  116. <li><a href="/documentation/addons/drag.html">Drag</a></li>
  117. <li><a href="/documentation/addons/dropdown.html">Dropdown</a></li>
  118. <li><a href="/documentation/addons/fixed-elements.html">Fixed elements</a></li>
  119. <li><a href="/documentation/addons/iconbar.html">Iconbar</a></li>
  120. <li><a href="/documentation/addons/icon-panels.html">Icon panels</a></li>
  121. <li><a href="/documentation/addons/keyboard-navigation.html">Keyboard navigation</a></li>
  122. <li><a href="/documentation/addons/lazy-submenus.html">Lazy submenus</a></li>
  123. <li><a href="/documentation/addons/navbars.html">Navbars</a></li>
  124. <li><a href="/documentation/addons/page-scroll.html">Page scroll</a></li>
  125. <li><a href="/documentation/addons/searchfield.html">Searchfield</a></li>
  126. <li><a href="/documentation/addons/section-indexer.html">Section indexer</a></li>
  127. <li><a href="/documentation/addons/set-selected.html">Set selected</a></li>
  128. <li><a href="/documentation/addons/sidebar.html">Sidebar</a></li>
  129. <li><a href="/documentation/addons/toggles.html">Toggles</a></li>
  130. </ul>
  131. </div>
  132. </li>
  133. <li>
  134. <span>Framework wrappers</span>
  135. <div>
  136. <p>Fix the quirks that the jQuery.mmenu plugin has with popular frameworks using these framework wrappers.</p>
  137. <ul>
  138. <li><a href="/documentation/wrappers">Introduction</a></li>
  139. <li class="Divider">Available framework wrappers</li>
  140. <li><a href="/documentation/wrappers/angular.html">Angular</a></li>
  141. <li><a href="/documentation/wrappers/bootstrap.html"><em class="Counter badge">UPDATE</em>Bootstrap</a></li>
  142. <li><a href="/documentation/wrappers/jquery-mobile.html">jQuery Mobile</a></li>
  143. <li><a href="/documentation/wrappers/magento.html">Magento</a></li>
  144. <li><a href="/documentation/wrappers/olark.html">Olark</a></li>
  145. <li><a href="/documentation/wrappers/turbolinks.html">Turbolinks</a></li>
  146. <li><a href="/documentation/wrappers/wordpress.html">WordPress</a></li>
  147. </ul>
  148. </div>
  149. </li>
  150. <li><a href="/documentation/translations.html">Translations</a></li>
  151. <li><a href="/documentation/custom-build.html">Custom build</a></li>
  152. <li><a href="/documentation/changelog.html">Changelog</a></li>
  153. </ul>
  154. </li>
  155. <li><a href="/on-and-off-canvas.html"><i class="fa fa-arrows-h"></i>On- and Off-canvas</a></li>
  156. <li><a href="/download.html"><i class="fa fa-download"></i>Download &amp; License information</a></li>
  157. <li><a href="https://github.com/FrDH/jQuery.mmenu" target="_blank"><i class="fa fa-github"></i>Fork us on GitHub</a></li>
  158. <li>
  159. <span><i class="fa fa-support"></i>Support</span>
  160. <ul>
  161. <li><a href="/support/tips-and-tricks.html">Tips and tricks</a></li>
  162. <li><a href="/support/problem-solving.html">Problem solving</a></li>
  163. <li><a href="/support/contact.html">Contact</a></li>
  164. </ul>
  165. </li>
  166. <li class="Divider">Also available</li>
  167. <li><a href="/wordpress-plugin"><i class="fa fa-wordpress"></i>mmenu WordPress plugin</a></li>
  168. <li><a href="/mhead-plugin"><i class="fa fa-bars"></i>jQuery.mhead plugin</a></li>
  169. <li id="donate">
  170. <p>The jQuery.mmenu plugin is open source software,
  171. you are free to use the jQuery.mmenu plugin for your personal or non-profit websites.
  172. For commercial usage, please <a href="/download.html">purchase a license</a>.</p>
  173. </li>
  174. </ul>