Is there way to load a new content in a page without reloading the navigation and menu?

I have a main application page setup with a header and a left navigation menu. Right now, when I click on a menu to navigate to a new page, it reloads the whole page. What can I do so it only loads the main content without loading the header and left navigation menu every time. In addition, when the new page is loaded, the URL should reflect the updated page.

I believe the only way you’ll be able to achieve this is by building a single page application. Each “page” in your app will actually be a group. Group visibility can be controlled by URL parameters if you need the URL to be unique based on the current page.

When menu option 1 is clicked > navigate to the same page with a parameter: “view = page1” (or something). Visibility condition on Group 1 is based on the url parameter (“get data from page url”). So… “When get view is page1 > this element is visible”

When you navigate to the same page and only send different parameters, I’m fairly certain the entire page doesn’t “reload”, so that menu and header should stay in place.

Try that, but again, this does mean your entire app needs to be on 1 actual Bubble page.


Gaby | Coaching Bubble
Private coaching, courses, and tons of free resources

2 Likes

Thanks! That’s a creative approach. I will have to experiment with the URL parameters. I have not done that before. With the entire app on 1 page, I can imagine design and workflow can get little messy; nevertheless, I will give it a try as my app it’s not that big. I think this will give the user a better visual experience.

1 Like

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