How to create a menu that doesn't need to be loaded

Hi Bubblers,

Not sure if anyone has tried this, and I couldn’t find any resources on YouTube that touches on this subject so I thought I try here.

If any of you have a LinkedIn account, you can try it out. In LinkedIn, their main navigation menu is on top of the page. What I’ve noticed is that when I click on each item of the menu, the menu itself doesn’t reload, only the bottom content section does. See video here: 2022-06-09_19-26-44

I want to replicate this for my app as well and couldn’t figure out how this can be achieved. I don’t believe this can be done by just showing and hiding elements as the URL does change.

Is there like a “frame” concept in Bubble where I can get the menu group to remain but load the other groups as needed?

FundKernel Development

LinkedIn is a SPA (single page app)

Do a search on the forum and there’s plenty of threads discussing how to do this. High-level is you use URL parameters or a plugin like Sudsy to change the URL and then you have things hide/show on the page based on the URL. Everything lives on one big page vs. split up across many pages.

This means the page doesn’t have to reload and therefore you can configure things like menus to just be static and always showing

There are pros/cons of going down this route. So I’d have a read of what people have been saying and consider your own use case to whether this is right for your app.

Josh @ Support Dept
Helping no-code founders get unstuck fast :rocket:save hours, & ship faster with an expert :man_technologist: on-demand

I post daily about no-code and Bubble on Twitter Follow Support Dept on Twitter

1 Like

LinkedIn is a SPA (single page app)

Really? But doesn’t SPA impact the performance of the app since everything has to be loaded in the background? Or is that not how hide/show works?

This topic was automatically closed after 70 days. New replies are no longer allowed.