CMS Development

ScottWelch
Contributor

Is there a list of accessible properties in the Menu type field in Design Manager?

SOLVE

I'm working on a newer and simpler footer menu that our current template makes a mess of. I'd like to know all the properties (Django) I can access so that I can draw the menu cleanly. As of now, I can't get out of wrapping each link in a <div> - arrrrrrgh! it's at least working but not optimal. 
FWIW - structure I'm going for is:
<nav>
<div>
<h3></h3>

<a></a>....
</div>
(repeat <div>...</div> as necessary for menu sections/columns)

</nav>

 

 

 

0 Upvotes
1 Accepted solution
Anton
Solution
Thought Leader

Is there a list of accessible properties in the Menu type field in Design Manager?

SOLVE

Hey @ScottWelch,

of course there is a Hubl function for building menus/navigations. 

Here's the doc for creating custom navigations with hubl and the menu function itself.

 

Basically you'd wrap your menu in a for-loop and use the navigation variables.

What might be quite benefitial are the if-statements and operators and expresions tests.

 

hope that helps

 

best, 

Anton

 

 

Anton Bujanowski Signature

View solution in original post

4 Replies 4
Anton
Solution
Thought Leader

Is there a list of accessible properties in the Menu type field in Design Manager?

SOLVE

Hey @ScottWelch,

of course there is a Hubl function for building menus/navigations. 

Here's the doc for creating custom navigations with hubl and the menu function itself.

 

Basically you'd wrap your menu in a for-loop and use the navigation variables.

What might be quite benefitial are the if-statements and operators and expresions tests.

 

hope that helps

 

best, 

Anton

 

 

Anton Bujanowski Signature
ScottWelch
Contributor

Is there a list of accessible properties in the Menu type field in Design Manager?

SOLVE

Thanks for the tips @Anton . The nav module I used as a base was doing a bunch of nested lists which worked for the top nav, but the prior footer was clunky and built by using a separate nav for each column. very un-django if I say so myself. I'll go check out the article when I have a moment and hopefully mark this as "accepted solution" 😁

0 Upvotes
Anton
Thought Leader

Is there a list of accessible properties in the Menu type field in Design Manager?

SOLVE

You're welcome!

One thing that I always advise is: Keep it as simple as possible, try to don't overengineer stuff and think about the person who's gonna edit/work with this. If you're the only person who will work with custom coded modules in the portal - awesome. Proceed as you like. 🙂 If a "non-developer" or "non-that-familiar" person should work with it - there's nothing wrong by using multi modules. 

 

Also here a few other ideas to maybe make your life easier:

  • create your navigation in the global nav editor(settings->Content->navigation), add an empty element or an element without link, write a JavaScript which will look for the empty label and wrap everything between two empty elements in a div and apply a flexbox CSS to it
  • Create a HubDB navigation (quite overengineered but possible)
  • Wrap your headlines in the global nav in html-tags like h3 and style it with CSS (kinda like idea 1)
  • Create a for-loop in a for-loop without the menu node/function. Add a simple text for the labels and a link field to the second-level loop and a simple text for headlines to the first loop. You've created your own custom menu module 🙂 The good thing by doing so: you have full control over everything and you can add a lot more custom options like icons or description text for each nav item to it quite easy

 

 

best

Anton

Anton Bujanowski Signature
Jaycee_Lewis
Community Manager
Community Manager

Is there a list of accessible properties in the Menu type field in Design Manager?

SOLVE

Hi, @ScottWelch 👋 Thanks for your question! Let's invite some community members to the conversation. Hey, @ChrisoKlepke @Anton, do you have any tips for @ScottWelch

 

Thank yo for taking a look! — Jaycee

linkedin

Jaycee Lewis

Developer Community Manager

Community | HubSpot