How do i set up sub-pages in bubble? HELP!

Hi all, first post here and i’ve only been using Bubble a few weeks but loving it.

I’m struggling to get my head around structuring the navigation of my site/app. I’ve read the documentation on get data from page url and also read all the posts that i can find on this topic and i feel it’s just outside my grasp currently.

I’m trying to build a choose your own adventure system for early readers, and the set up i have currently is:
Index is a user page with a repeating group of children that ‘belong’ to that user which navigates to a child’s page with a repeating group of books that are owned by that child’s user owner

What i’d like to do is create a starting page for each story, that is unique to each story, and use this format to navigate the sub pages of the story as they choose various options.

i.e. www.myurl.com/username as the page showing all the children once they are logged in

when the child clicks their name navigate to their own page www.myurl.com/username/childname

when they click on the story it goes to
www.myurl.com/username/childname/story1title
(or this might be simpler as myurl.com/story1title if that makes more sense but i’m not sure how that can conflict with other readers reading that page?)

I can pass my variables between pages fine, and i can get my pages to display readable URL’s of the story titles i’ve passed, but i can’t actually get it to navigate to those pages that i have titled like that, it just goes to my standard front cover page for all stories which is the internal link i have set up in the workflow. (The content in it is dynamic, so it looks like all separate stories, but i need to be able to really branch out)

So i know there is something fundamental i’m missing, in terms of creating sub-pages. All the web work i’ve done in the past used folders to sub-page but bubble is clearly more powerful/complicated. I’d be grateful for any assistance, as it seems like it should be straightforward but i’m bouncing off something.

Best wishes

Phil

1 Like

while sub pages sound nice and the urls u’ve described look clean, in terms of ease of coding and “minimal viable product” you will get a lot more mileage using floating groups as your “sub-pages” and if need be, url parameters (with a simple “tab” parameter or “page” parameter to store the name of the “sub-page” which would now be a floating group.)

then you can use the Page Load workflow and “Get data from url parameter” and when the “page” parameter matches the floating group you want to show, fade it in. when a “page” parameter doesn’t match, fade it out.

Hi Varshney,

Firstly, thanks for the reply, really appreciate it. I’m still totally a novice on bubble (Perl and C are my primary coding backgrounds) and with everything there is always more than one way to solve a problem right!

Your floating group is an interesting suggestion. I had been discounting using variables to show/hide elements on a single page to ‘build’ the story as i was concerned that all the elements would be loaded even if not needed which would make page load times very long. Do you know if all elements are background loaded, or whether the on page load function only loads elements that match?

I’m also not sure how straightforward it would be to build a store and library of books using toggled floating elements for the books, as opposed a repeating group, but i’m not attached to the design i have at the moment, i can sure make changes if i need to in order to get things going.

good question. you want to uncheck “This element is visible on page load” and that should improve the load time.

i think you may be even to save workflows and use the conditional tab in the floating group to display/hide it

Hi Varshney,

Thanks i’ll have a look into the floating element concept and see how i get on.

Out of curiosity, what makes the sub-page component so complicated? In my previous fairly basic web design it’s just folders, so i figured this was such an important function it would be pretty simple to execute?

Thanks

Another great question. There’s a whole thread devoted to this. I’ve been tinkering with bubble for a couple years and still consider myself a n00b, but if I remember correctly, loading a single page per app is generally more “performant” than The app/site have to deal with many pages.

As for simplicity, it may be easier to use your original design. And there is a plugin , I believe, specifically made for this “clean url” per page design. I’ll see if I can find it but you may beat me to the punch.

I think this should get you on your way :slight_smile:

You can use this (free) plugin for subpages.

Hi both Varshney and Xann, a million thank-yous! Both/either of the options you suggested look at first glance to achieve exactly what i hoped. I will 100% have a play around with them this weekend as it’s late in the UK and i’ve been on this all day.

Thanks again, you have made my day.