How to use the Omega Menu Module

The Features below are defined in the advanced menu tool in HubSpot. This allows for adjustments to the menu to be defined at the menu level to allow for customizations.

To Create a Mega Menu Dropdown

  • Use "__mega" to define a mega menu dropdown and text immediately after __ will be the identifier for the cta IE: "__mega_section1" 
  • In the Page navigation in HubSpot settings find a top level menu item and at the end of the text area for the label use "__mega" to define a mega menu dropdown and the text immediately after "__mega" will be the identifier for the cta IE: "__mega_section1". Keep in mind that these have to be unique in order for the menu to operate.Screenshot 2024-03-12 at 9-43-41 AM-png
  • Then Select the module. And add in your mega menu settings in the module. Make sure your name matches the name you placed in the Advanced Menus.

To Create a Subtext in the Menu Item

  • add "||" to separate the main line and the subtext. Anything after the || will be separated. This works on All levels of the Menu.Screenshot 2024-03-12 at 9.44.22 AM

To Create a CTA in the menu

  • add "__CTA--secondary_color" where "secondary_color" would pull the secondary color, you can also set it as primary_color, tertiary_color. Screenshot 2024-03-12 at 9.31.27 AM

Screenshot 2024-03-12 at 9.31.36 AM

To Place an Icon in the menu

  • The icon library that we use is Font Awesome (basic). To add an icon to the menu item add "iconname__fa" where "iconname" is the internal name of the icon. This works for top level as well as child items
Screenshot 2024-03-12 at 10.20.42 AMScreenshot 2024-03-12 at 10.22.12 AM