<p>I wrote up a blog post on how to do Client <a href="https://caffeinecreations.ca/blog/client-controlled-site-navigation/" rel="nofollow noreferrer">Controlled Navigation</a>. It's actually quite simple. All you need to do is create a structure for your nav, a couple of fields and then output the structure using any HTML you like.</p>

<p>The final code from the blog post is below:</p>

<pre><code>{% set navigation %}

 {% set pages = craft.entries.section('navigation').level('&lt;='~2) %}

 &lt;ul&gt;
   {% nav page in pages %}
     &lt;li&gt;
       {# Check for entry type / get related entry #}
       {% if page.type == 'internalLink' %}
           {% set linkedEntry = page.sitePageLink.limit(1).first() %}
           &lt;a href="{{ linkedEntry.url }}"  data-url="{{ linkedEntry.url }}"&gt;{{ page.title }}&lt;/a&gt;
       {% endif %}

       {# Check for entry type / get offsiteLinks #}
       {% if page.type == 'offsiteLink' %}
           &lt;a href="{{ page.offSiteLink }}"  data-url="{{ page.offSiteLink }}" {% if page.openInNewTab == '1' %}target="_blank"{% endif %}&gt;{{ page.title }}&lt;/a&gt;
       {% endif %}

       {% ifchildren %}
          &lt;ul class="dropdown" style="background:pink"&gt;
              {% children %}
          &lt;/ul&gt;
      {% endifchildren %}

     &lt;/li&gt;
   {% endnav %}
 &lt;/ul&gt;

 {% endset %}

 {# replace data-uri with active class #}
 {{ navigation|replace({('data-url="' ~ craft.request.getUrl() ~ '"'): 'class="active"'})|raw }}
</code></pre>

CC BY-SA 3.0
2017-06-06T23:22:18.960Z
2017-06-06T23:22:18.960Z
CreateSean
<p>This is what i did to get what i wanted. It's not the prettiest, but it works for now. I will have to soon make a PR on the repo and hope they merge it.</p>
<p>In the vendor/olivestudio/craft-olivemenus folder, look for this class: OlivemenusService and add the method below:</p>
<pre><code>public function getAllMenus($siteId) {
        $menu = OlivemenusRecord::find()
                    -&gt;where(['site_id' =&gt; $siteId])
                    -&gt;one();
        return Olivemenus::$plugin-&gt;olivemenuItems-&gt;getMenuItems($menu-&gt;id);
    }
</code></pre>
<p>Then look for OlivemenusVariable class and add this below:</p>
<pre><code>public function getAllMenus($siteId)
    {
            return Olivemenus::$plugin-&gt;olivemenus-&gt;getAllMenus($siteId);
    }
</code></pre>
<p>This basically gives you the ability to do this on your template:</p>
<p>{% set menus = craft.olivemenus.getAllMenus(currentSite.id) %}</p>
<p><em>Remember, might be deleted if your vendor folder gets removed by a new composer installation or package updates.</em></p>

CC BY-SA 4.0
2021-03-17T21:14:03.497Z
2021-03-17T21:14:03.497Z
Misterwyz
<p>Ok here my Solution</p>

<pre><code>{% set navigation %}
{% set pages = craft.entries.section('eisbahnHauptnavigation').all() %}
    &lt;ul class="menu"&gt;
        {% nav page in pages %}
            &lt;li&gt;
        {# Check for entry type / get related entry #}
            {% if page.type == 'internalLink' %}
            {% set linkedEntry = page.sitePageLink.limit(1).first() %}
                &lt;a href="{{ linkedEntry.url }}"  data-url="{{ linkedEntry.url }}"&gt;{{ page.title }}&lt;/a&gt;
            {% endif %}

            {# Check for entry type / get offsiteLinks #}
                {% if page.type == 'offsiteLink' %}
                &lt;a href="{{ page.offSiteLink }}"  data-url="{{ page.offSiteLink }}" {% if page.openInNewTab == '1' %}target="_blank"{% endif %}&gt;{{ page.title }}&lt;/a&gt;
                {% endif %}

                {% ifchildren %}
                &lt;ul class="submenu"&gt;
                {% children %}
                &lt;/ul&gt;
                {% endifchildren %}

        &lt;/li&gt;
    {% endnav %}
    &lt;/ul&gt;
{% endset %}

{# replace data-uri with active class #}
{{ navigation|replace({('data-url="' ~ craft.app.request.absoluteUrl() ~ '"'): 'class="active"'})|raw }}
</code></pre>

CC BY-SA 4.0
2019-05-05T18:10:57.373Z
2019-05-05T18:10:57.373Z
Christian Säum
<p>I have a Craft project set up locally, and I have installed a <a href="https://github.com/OliveStudio/olivemenus/wiki/01.-Introduction" rel="nofollow noreferrer">plugin</a> 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:</p>

<pre><code>{{ craft.olivemenus.getMenuHTML('topBar')}}
</code></pre>

<p>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:</p>

<pre><code>  &lt;div class="top-bar"&gt;
    &lt;div class="row"&gt;
      &lt;div class="column"&gt;
        &lt;div class="top-bar-title"&gt;
          &lt;a href="/"&gt;
              &lt;span class="first"&gt;Forandrings&lt;/span&gt;&lt;span class="second"&gt;fabrikken&lt;/span&gt;
          &lt;/a&gt;
        &lt;/div&gt;
        &lt;div&gt;
          &lt;div class="top-bar-left"&gt;
            &lt;ul class="dropdown menu js-topbar-menu"&gt;
              &lt;li&gt;
                &lt;!--
                &lt;a href="#" class="dropdown-menu-link"&gt;&lt;i class="ion-android-menu"&gt;&lt;/i&gt; &lt;span&gt;Meny&lt;/span&gt;&lt;/a&gt;
                --&gt;
                &lt;a href="#" class="dropdown-menu-link"&gt;
                  &lt;div id="nav-icon1"&gt;
                    &lt;span&gt;&lt;/span&gt;
                    &lt;span&gt;&lt;/span&gt;
                    &lt;span&gt;&lt;/span&gt;
                  &lt;/div&gt;
                  &lt;span class="menu-text"&gt;Meny&lt;/span&gt;
                &lt;/a&gt;
              &lt;/li&gt;
            &lt;/ul&gt;
          &lt;/div&gt;
          &lt;div class="top-bar-right"&gt;
            &lt;ul class="menu"&gt;
              &lt;li class="menu-search-bar show-for-large"&gt;
                &lt;form action="{{ url('search/results') }}"&gt;
                  &lt;div class="search"&gt;
                    &lt;button type="submit" class="search-submit-button"&gt;
                      &lt;i class="search-icon ion-android-search"&gt;&lt;/i&gt;
                    &lt;/button&gt;
                    &lt;input name="q"&gt;
                  &lt;/div&gt;
                &lt;/form&gt;
              &lt;/li&gt;
            &lt;/ul&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="dropdown-content"&gt;
    &lt;div class="row"&gt;
      &lt;div class="small-12 columns hide-for-large"&gt;
        &lt;ul&gt;
          &lt;li class="menu-search-bar search-bar-small-screen"&gt;
            &lt;div class="search"&gt;
              &lt;i class="search-icon ion-android-search"&gt;&lt;/i&gt;
              &lt;input name="search"&gt;
            &lt;/div&gt;
          &lt;/li&gt;
        &lt;/ul&gt;
      &lt;/div&gt;
    &lt;/div&gt;
    &lt;div class="row small-up-1 medium-up-3 large-up-5"&gt;
      &lt;div class="column column-block"&gt;
        &lt;h4&gt;&lt;a href="/page.html"&gt;Ideen&lt;/a&gt;&lt;/h4&gt;
        &lt;ul&gt;
          &lt;li&gt;
            &lt;a href="/page.html"&gt;Innholdsside&lt;/a&gt;
          &lt;/li&gt;
          &lt;li&gt;
            &lt;a href="/news/artikkel"&gt;Artikkel&lt;/a&gt;
          &lt;/li&gt;
        &lt;/ul&gt;
      &lt;/div&gt;
      &lt;div class="column column-block"&gt;
        &lt;h4&gt;&lt;a href="/page.html"&gt;Hva gjør vi?&lt;/a&gt;&lt;/h4&gt;
        &lt;ul&gt;
          &lt;li&gt;
            &lt;a href="/page.html"&gt;Innholdsside&lt;/a&gt;
          &lt;/li&gt;
          &lt;li&gt;
            &lt;a href="/news/artikkel"&gt;Artikkel&lt;/a&gt;
          &lt;/li&gt;
        &lt;/ul&gt;
      &lt;/div&gt;
      &lt;div class="column column-block"&gt;
        &lt;h4&gt;&lt;a href="/page.html"&gt;Proff&lt;/a&gt;&lt;/h4&gt;
        &lt;ul&gt;
          &lt;li&gt;
            &lt;a href="/article-list"&gt;Innholdsside&lt;/a&gt;
          &lt;/li&gt;
          &lt;li&gt;
            &lt;a href="/news/artikkel"&gt;Artikkel&lt;/a&gt;
          &lt;/li&gt;
        &lt;/ul&gt;
      &lt;/div&gt;
      &lt;div class="column column-block"&gt;
        &lt;h4&gt;&lt;a href="/page.html"&gt;Kunnskapsenter&lt;/a&gt;&lt;/h4&gt;
        &lt;ul&gt;
          &lt;li&gt;
            &lt;a href="/page.html"&gt;Innholdsside med lengre tittel&lt;/a&gt;
          &lt;/li&gt;
          &lt;li&gt;
            &lt;a href="/news/artikkel"&gt;Artikkel&lt;/a&gt;
          &lt;/li&gt;
        &lt;/ul&gt;
      &lt;/div&gt;
      &lt;div class="column column-block"&gt;
        &lt;h4&gt;&lt;a href="/page.html"&gt;Om oss&lt;/a&gt;&lt;/h4&gt;
        &lt;ul&gt;
          &lt;li&gt;
            &lt;a href="/page.html"&gt;Innholdsside&lt;/a&gt;
          &lt;/li&gt;
          &lt;li&gt;
            &lt;a href="/news/artikkel"&gt;Artikkel&lt;/a&gt;
          &lt;/li&gt;
        &lt;/ul&gt;
      &lt;/div&gt;
    &lt;/div&gt;
</code></pre>

<p>How can I do that?
I have tried with using the function that I saw in the plugin file <code>olivemenus/services/OlivemenusService.php</code>:</p>

<pre><code>{{ craft.olivemenus.getMenuByHandle('topBar')}}
</code></pre>

<p>Because I thought that function would just return the items of the menu, but I got an error message:</p>

<blockquote>
  <p>Neither the property "getMenuByHandle" nor one of the methods
  "getMenuByHandle()", "getgetMenuByHandle()"/"isgetMenuByHandle()" or
  "__call()" exist and have public access in class
  "Craft\OlivemenusVariable".</p>
</blockquote>

CC BY-SA 3.0
2017-06-06T13:51:18.627Z
It doesn't look like that plugin offers much customization. I'm guessing a big part of choosing this plugin was the admin interface? I've had good luck using a Structure section and building out the nav myself. Admin interface works fine, and I can add any level of customization I want.
Scott Stubblefield
CC BY-SA 3.0
2017-06-06T16:50:46.300Z
You might want to look for a menu plugin that's under more active development. `{{ craft.olivemenus.getMenuByHandle('topBar')}}` won't work because they don't expose that method to the template in https://github.com/OliveStudio/olivemenus/blob/master/variables/OlivemenusVariable.php.
Brad Bell
<templating><plugins><menu>
Customizing template of the Olive Menus plugin
# Customizing template of the Olive Menus plugin

(Asked by: username_0 on 2017-06-06)

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:
  
    
      
        
          
              Forandringsfabrikken
          
        
        
          
            
              
                
                
                  
                    
                    
                    
                  
                  Meny
                
              
            
          
          
            
              
                
                  
                    
                      
                    
                    
                  
                
              
            
          
        
      
    
  
  
    
      
        
          
            
              
              
            
          
        
      
    
    
      
        Ideen
        
          
            Innholdsside
          
          
            Artikkel
          
        
      
      
        Hva gjør vi?
        
          
            Innholdsside
          
          
            Artikkel
          
        
      
      
        Proff
        
          
            Innholdsside
          
          
            Artikkel
          
        
      
      
        Kunnskapsenter
        
          
            Innholdsside med lengre tittel
          
          
            Artikkel
          
        
      
      
        Om oss
        
          
            Innholdsside
          
          
            Artikkel
          
        
      
    

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".

**Tags:** templating, plugins, menu

> **Comments:**
> **username_1**: It doesn't look like that plugin offers much customization. I'm guessing a big part of choosing this plugin was the admin interface? I've had good luck using a Structure section and building out the nav myself. Admin interface works fine, and I can add any level of customization I want.  
> **username_2**: You might want to look for a menu plugin that's under more active development. `{{ craft.olivemenus.getMenuByHandle('topBar')}}` won't work because they don't expose that method to the template in https://github.com/OliveStudio/olivemenus/blob/master/variables/OlivemenusVariable.php.  

---

## 3 answers

### Answer by username_3 on 2017-06-06. Score: 1

I wrote up a blog post on how to do Client Controlled Navigation. It's actually quite simple. All you need to do is create a structure for your nav, a couple of fields and then output the structure using any HTML you like.
The final code from the blog post is below:
{% set navigation %}

 {% set pages = craft.entries.section('navigation').level('<='~2) %}

 
   {% nav page in pages %}
     
       {# Check for entry type / get related entry #}
       {% if page.type == 'internalLink' %}
           {% set linkedEntry = page.sitePageLink.limit(1).first() %}
           {{ page.title }}
       {% endif %}

       {# Check for entry type / get offsiteLinks #}
       {% if page.type == 'offsiteLink' %}
           {{ page.title }}
       {% endif %}

       {% ifchildren %}
          
              {% children %}
          
      {% endifchildren %}

     
   {% endnav %}
 

 {% endset %}

 {# replace data-uri with active class #}
 {{ navigation|replace({('data-url="' ~ craft.request.getUrl() ~ '"'): 'class="active"'})|raw }}


---

### Answer by username_4 on 2021-03-17. Score: 1

This is what i did to get what i wanted. It's not the prettiest, but it works for now. I will have to soon make a PR on the repo and hope they merge it.
In the vendor/olivestudio/craft-olivemenus folder, look for this class: OlivemenusService and add the method below:
public function getAllMenus($siteId) {
        $menu = OlivemenusRecord::find()
                    ->where(['site_id' => $siteId])
                    ->one();
        return Olivemenus::$plugin->olivemenuItems->getMenuItems($menu->id);
    }

Then look for OlivemenusVariable class and add this below:
public function getAllMenus($siteId)
    {
            return Olivemenus::$plugin->olivemenus->getAllMenus($siteId);
    }

This basically gives you the ability to do this on your template:
{% set menus = craft.olivemenus.getAllMenus(currentSite.id) %}
Remember, might be deleted if your vendor folder gets removed by a new composer installation or package updates.


---

### Answer by username_5 on 2019-05-05. Score: 1

Ok here my Solution
{% set navigation %}
{% set pages = craft.entries.section('eisbahnHauptnavigation').all() %}
    
        {% nav page in pages %}
            
        {# Check for entry type / get related entry #}
            {% if page.type == 'internalLink' %}
            {% set linkedEntry = page.sitePageLink.limit(1).first() %}
                {{ page.title }}
            {% endif %}

            {# Check for entry type / get offsiteLinks #}
                {% if page.type == 'offsiteLink' %}
                {{ page.title }}
                {% endif %}

                {% ifchildren %}
                
                {% children %}
                
                {% endifchildren %}

        
    {% endnav %}
    
{% endset %}

{# replace data-uri with active class #}
{{ navigation|replace({('data-url="' ~ craft.app.request.absoluteUrl() ~ '"'): 'class="active"'})|raw }}


---

