HubSpot CMS

Multilingual menu module

This module is commonly used inside the header (global module). There you can choose one menu per language. So it basically allows you to have one template/header/footer for as many languages as you need.

Unverified
?

After receiving a minimum of 25 recommendations, an entry earns the "Community Approved" badge.

Please keep in mind, all entries are community created and may not be fully supported by HubSpot.

11 Recommendations

View on:

GitHub

HTML + HUBL
          
            


{% for lang in module.menu_by_lang %}
  {% if (slug is string_startingwith lang.lang_slug) ||  (loop.last and found != 1) %}
    {% menu
      id="{{ lang.id }}",
      root_type="{{ module.root_type }}",
      flyouts="{{ module.flyouts }}",
      max_levels="{{ module.max_levels }}",
      flow="{{ module.flow }}"
    %}
    {% set found = 1 %}
  {% endif %}
{% endfor %}

          
        
CSS
          
            

          
        
JS
          
            // js

          
        
Have Questions?

Ask technical questions in Slack.

HubSpot Developer Slack

Not a member yet? - join here
READ ME (VIEW IN GITHUB)

Multilingual menu module

This module is commonly used inside the header (global module). There you can choose one menu per language. So it basically allows you to have one template/header/footer for as many languages as you need.

Did I mention it also works in the system pages? :)

You only need a repeatable group that will create the dictionary we need (in our case the group slug is: menu_by_lang): The lang_slug will be the slug that will be compare to, while the menu_id will be the asociated menu to such slug/lang.

{
  [
    "lang_slug": "es/",
    "menu_id": "1234"
  ],
  [
    "lang_slug": "en/",
    "menu_id": "0000"
  ]
}

*Notice: the last element/row will be the default element to display if there is no match with the slug *

 
11 Recommendations

Gonzalo

leadstreet

Head developer in leadstreet

View Gonzalo’s Gallery (2 Entries)

Contribute to the Gallery!

We bet you’ve coded some amazing stuff. Showcase them and help the community grow.

Contribute

Other Open Source Projects

Browse all other open source projects

CrankShaft Framework

A modern framework for accelerating build times on the HubSpot CMS. Based on a modified Bootstrap 4 framework.

Lead developers: Jon McLaren

Developer Chrome Extension

Chrome/Chromium extension for HubSpot CMS Developers that adds a developer menu, dark theme and useful shortcuts to commonly used HubSpot query parameters, resources, and tools for making HubSpot Development easier and more enjoyable.

Lead developers: Jon McLaren , William Spiro , Gonzalo Torreras

VS Code HubL Language Extension

This extension enables super fast local development of CMS pages, and is a great compliment to using the new local HubL server. It contains comprehensive HubL tag, function, filter and expression test auto-complete snippets, as well as their documentation.

Lead developers: William Spiro

Not coding on HubSpot CMS yet?

We invite you to explore why thousands of developers LOVE coding with HubSpot!

Contribute
Made with  by community members: InboundLabs.co