Hi. I'm trying to create a menu for the odoo website. This menu is about being a megamenu. For this I have created a template that replaces the haeader's menu. I attach codes below. On the other hand I have created a controller that serves the content in my case of the products (this is simply a test then I want to show only certain products or categories). The problem arises in that I do not know how to connect said controller with the menu. Since the driver receives a route and the web page menu should appear on all routes.

main.py -> The conntroller to send data to the template redering

class WebsitePerson(Website):
    @http.route(
        '/', //// -> I dont know how to put here  ////
        auth='public',
        website=True
    )
    def show_custom_menu(self, **kwargs):
        res = {}
        products = request.env['product.template'].search([])
        res = {
            'productos': products,
        }
        return http.request.render('theme_candy.theme_gourmand_nav',res)

template.xml -> Its the template to renderize elements

<template id="theme_gourmand_nav" name="Gourmand Name" inherit_id="website.layout">
<xpath expr="//div[@id='wrapwrap']/header" position="replace">
    <header t-att-class=" 'editable_mode' if editable else '' ">
<!-- TRYING TO SHOW THE RENDERED ELEMENTS RENDERED
 -->
<t t-foreach="productos" t-as="prod">
  <t t-esc="prod.name"/><br/>
</t>
 <nav id="cbp-hrmenu" class="cbp-hrmenu" role="navigation">
   
          <ul id="top_menu">
            <li>
              <a href="#"><span t-esc="user_id.name" /></a>
              <div class="cbp-hrsub">
                <div class="cbp-hrsub-inner"> 
                  <div>
                    <h4>OPTIONS</h4>
                    <ul>
                      <li> <a href="/web" role="menuitem">My Account</a></li>
                      <li id="o_logout">
                      <a t-attf-href="/web/session/logout?redirect=/" role="menuitem">
                        Logout
                      </a>
                     </li>
                    </ul>
                  </div>
                </div><!-- /cbp-hrsub-inner -->
              </div><!-- /cbp-hrsub -->
            </li>
          </ul>
        </nav>
 </header>
   </xpath>
  </template>

I suspect that the structure I am using is not the correct one, I do not know if I have to inherit some kind of the controller from the website module or if I should do it in some other way, I want to show the menu in all the pages of the web and that the menu receives data from the backend. Any idea how to perform this step? So there are megamenuq modules that do similar things but they are payments and I can not see the code. I would appreciate help as soon as possible.

Thank you very much in advance and if you do not understand what my problem is I am willing to clarify it more.