How to display different menus based on page content?

Technical Q&A
,
1

Hi, i would like to have different menu displayed depending on the content of the page, i managed to find an older discussions where someone gave a bit of code

 {% assign menu_handle = 'main-menu' %} 
      
{% if template %}
   {% if template contains 'banana' %} 
      {% assign menu_handle = 'banana_menu' %}
   {% endif %}
{% endif %}
{% include 'site-nav', linklist: menu_handle %}

Capture d’écran 2023-09-21 à 02.57.33.png
Capture d’écran 2023-09-21 à 02.57.33.png2020×222 10 KB

Capture d’écran 2023-09-21 à 02.57.26.png
Capture d’écran 2023-09-21 à 02.57.26.png1322×310 10.8 KB

now i have a main menu for my whole site, except the page including “banana”, however, it messed with the css and i don’t understand why

  <div class="header__bottom container--large">

      <span class="scrollable-navigation-button scrollable-navigation-button--left" aria-hidden="true">{%- render 'theme-symbols', icon: 'chevron' -%}</span>
      <scrollable-navigation class="header-links">
        {%- render 'site-nav', linklist: section.settings.main_linklist, blocks: section.blocks, type: 'classic' -%}
      </scrollable-navigation>
      <span class="scrollable-navigation-button scrollable-navigation-button--right" aria-hidden="true">{%- render 'theme-symbols', icon: 'chevron' -%}</span>

      <div class="header-actions header-actions--blocks" data-js-header-actions>{{ header_blocks }}</div>

    </div>

i “only” removed " {%- render ‘site-nav’, linklist: section.settings.main_linklist, blocks: section.blocks, type: ‘classic’ -%} " to add the code above

the theme i’m using is LOCAL by Krown Themes

thank you