Drop Down menus

I’ve created several pages that are “at the top level”. I’d like to choose one to be the main menu and two to be drop downs from the top of the menu bar. I can’t figure out how to set this up. I see this in the docs, ‍"You ‍can ‍change ‍the ‍order ‍of ‍menu ‍items ‍using ‍drag ‍and ‍drop ‍in ‍the ‍menu ‍inspector, ‍including ‍moving ‍a ‍top ‍level ‍page ‍in ‍or ‍out ‍of ‍a ‍sub-menu." but can’t figure out how to move ‍a ‍top ‍level ‍page ‍in ‍or ‍out ‍of ‍a ‍sub-menu.

Hi @talkgtr,

there are two ways to do that, one is to let the Sparkle menu system automatically map your page layout to the menu, the second is to do it manually.

So for the automatic management, an item on the main menu (top level) is a page that’s not inside a section. A site section is mapped by the menu into a dropdown, so you can create the two sections and move the pages you want in dropdowns into those sections.

For the manual management it’s probably best to turn off the “auto add items” checkbox in the menu settings, so future page additions don’t alter the menu. You then use the buttons at the bottom of the page list, inside the menu settings, for example:

this is the flat list of pages, now I’ll add a couple sub-menus using the third button, between the “-” and the eye icon, then rearrange the items by dragging them inside submenus:


Does this work for you?

Thanks Duncan. I must be thick, let me show you what I’m trying to do. I want to add pages “Photos 1&2” to drop down individually below “History and photos” and then delete Photos 1&2 from the menu bar.

@talkgtr, I could suggest the following based on what Duncan has already mentioned…

  • turn “History & Photos” into a sub-menu title
  • when done either use your left hand panel or top-right Menu panel and drag “Photo 1” and “Photo 2” into the created sub-menu “History & Photos”
  • buy doing the above “Photo 1” and “Photo 2” will disappear from your main navigation bar and appear under “History & Photos” when hovered over in Preview

You probably will also need to create another page called “History” and place in in the sub-menu “History & Photos” because this primary navigation will only trigger the sub-menu pages so in the end you’ll have “History”, “Photo 1” and “Photo 2”.

Also have another read over Duncan’s documentation - https://sparkleapp.com/docs/menus.html
Good luck! :slight_smile:

Thanks @greenskin. w/ your direction I muddled around and made the sub menus work. Didn’t seem very intuitive, but I think I can repeat it. Thanks again for the help!

1 Like

With the different explanations, videos and documentation available, at this point I think it’s just a matter of gaining some confidence. Go ahead and play around with the menu, nothing bad can happen.

1 Like

Now that I’ve reread the docs a few times I understand the convention Sparkle uses for menus & submenus. Now I’m on to devices. Which sends me back to font Style ‍panel,…

Hi Duncan! Is there a way to have a submenu within a submenu? I tried that on Sparkle Free but was unable to create it. In your screenshots, what I tried to achieve was to have, say, page3 dropdown within page2 inside of sub1.

No, it’s not currently possible. The only case where you have 3 levels if if the top level is the hamburger menu.

1 Like