Hi all, does anyone know how they would go about creating a mega menu? This is generally a pretty standardised type of desktop navigation within marketplaces and e-commerce (well web design period I guess).
I have tried
To use a Focus Group, but the offset settings doesn’t allow it to be full width 100% to the page settings and responsive to it.
Floating group doesnt stick to the parent element and will scroll down the page so is not a viable option.
Hide/Shoe element within the header but this will push down the page content below it which is not optimal.
I should be able to click on header menu navigation option and show a full width sub menu which is, anyone have any ideas on how to achieve this in Bubble?
Great, thanks. Yes I got confused when I set up the workflow to trigger off the nav text and repeated it for the reference. Thanks for the quick responses & solution!
Only downfall of this by the looks of it is that the Focus Group does not stay a part of a reusable element. So I would need to repeat this and it’s workflows for every instance I have of the header/navigation i.e. I cannot actually use this as a reusable element. Unless there is a solution I don’t know of here. Happy to create separate thread.
I’m not sure what you mean by “the Focus Group does not stay a part of a reusable element.”
It should be perfectly possible to have a group focus inside a reusable element, so I don’t understand the issue… maybe some screenshots, or links to your editor would help clarify your issue…
I hope so. Apologies only been using Bubble for a few days. Used to other no-code tools so have yet to work everything out.
This is my reusable element with the main navigation created within a Group and then my GroupFocus element (megamenu) which sits outsite of it:
As soon as I add the reusable element (navigation) into a page the group is no longer there. I appreciate the reusable element doesnt show all of its componenets when added to a page but when I go into preview mode to test out the toggle to reveal the megamenu it does not work.
Hope this explains the issue being experienced. But again, as new to Bubble, I could be missing something here. Thanks.
@adamhholmes I figured out the issue I think, so yes all group elements are usable within the reusable element. But the issue I have found is that the Floating Group or Focus Group elements height will be restricted to the Reusable Element rather than the page.