I have a Craft project set up locally, and I have installed a plugin for menus. I have set up the menu with the plugin in the administration, and I have managed to output the menu in the template by using this:
{{ craft.olivemenus.getMenuHTML('topBar')}}
But, I would like to use my own HTML, and only use the links from the created plugin. This is the template that I would like to use:
<div class="top-bar">
<div class="row">
<div class="column">
<div class="top-bar-title">
<a href="/">
<span class="first">Forandrings</span><span class="second">fabrikken</span>
</a>
</div>
<div>
<div class="top-bar-left">
<ul class="dropdown menu js-topbar-menu">
<li>
<!--
<a href="#" class="dropdown-menu-link"><i class="ion-android-menu"></i> <span>Meny</span></a>
-->
<a href="#" class="dropdown-menu-link">
<div id="nav-icon1">
<span></span>
<span></span>
<span></span>
</div>
<span class="menu-text">Meny</span>
</a>
</li>
</ul>
</div>
<div class="top-bar-right">
<ul class="menu">
<li class="menu-search-bar show-for-large">
<form action="{{ url('search/results') }}">
<div class="search">
<button type="submit" class="search-submit-button">
<i class="search-icon ion-android-search"></i>
</button>
<input name="q">
</div>
</form>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div class="dropdown-content">
<div class="row">
<div class="small-12 columns hide-for-large">
<ul>
<li class="menu-search-bar search-bar-small-screen">
<div class="search">
<i class="search-icon ion-android-search"></i>
<input name="search">
</div>
</li>
</ul>
</div>
</div>
<div class="row small-up-1 medium-up-3 large-up-5">
<div class="column column-block">
<h4><a href="/page.html">Ideen</a></h4>
<ul>
<li>
<a href="/page.html">Innholdsside</a>
</li>
<li>
<a href="/news/artikkel">Artikkel</a>
</li>
</ul>
</div>
<div class="column column-block">
<h4><a href="/page.html">Hva gjør vi?</a></h4>
<ul>
<li>
<a href="/page.html">Innholdsside</a>
</li>
<li>
<a href="/news/artikkel">Artikkel</a>
</li>
</ul>
</div>
<div class="column column-block">
<h4><a href="/page.html">Proff</a></h4>
<ul>
<li>
<a href="/article-list">Innholdsside</a>
</li>
<li>
<a href="/news/artikkel">Artikkel</a>
</li>
</ul>
</div>
<div class="column column-block">
<h4><a href="/page.html">Kunnskapsenter</a></h4>
<ul>
<li>
<a href="/page.html">Innholdsside med lengre tittel</a>
</li>
<li>
<a href="/news/artikkel">Artikkel</a>
</li>
</ul>
</div>
<div class="column column-block">
<h4><a href="/page.html">Om oss</a></h4>
<ul>
<li>
<a href="/page.html">Innholdsside</a>
</li>
<li>
<a href="/news/artikkel">Artikkel</a>
</li>
</ul>
</div>
</div>
How can I do that?
I have tried with using the function that I saw in the plugin file olivemenus/services/OlivemenusService.php
:
{{ craft.olivemenus.getMenuByHandle('topBar')}}
Because I thought that function would just return the items of the menu, but I got an error message:
Neither the property "getMenuByHandle" nor one of the methods "getMenuByHandle()", "getgetMenuByHandle()"/"isgetMenuByHandle()" or "__call()" exist and have public access in class "Craft\OlivemenusVariable".
{{ craft.olivemenus.getMenuByHandle('topBar')}}
won't work because they don't expose that method to the template in github.com/OliveStudio/olivemenus/blob/master/variables/…. – Brad Bell Jun 6 '17 at 16:50