Forum Documentation Showcase Pricing Learn more

Using URL parameters for one page navigation

#1

Just want to share that I recently modified my app to a one-page design and am showing/hiding groups, rather than having separate pages, and using URL parameters to show and hide the groups has been immensely helpful. The entire app loads more quickly now since everything is loaded on the first page and I can automatically populate repeating groups’ content, and transitions between showing and hiding groups is seamless.

It doesn’t seem super intuitive at first but it’s pretty powerful once setup. Anyone can feel free to ask questions on how I did this or provide other tips, I’m learning quite a bit!

Jordan

1 Like

#2

How are you managing this for SEO? Are you using parameters instead of states for this very reason?

0 Likes

#3

My app is closed so SEO isn’t a concern, except for my home / landing page which may be built outside of Bubble. However, I would assume that traffic could be accurately measured by using the parameters, but meta tags could be more of an issue when using a one-page design with groups like this.

0 Likes

#5

Hello Jordan,

I am using the same structure as you with a closed app and there is one issue I am facing.

When I navigate to myapp?tab=thing&unique_id=123456789x123456789 I show a group which loads the thing with that unique id, and display its fields.

Now when I navigate sometimes I get the first thing in the DB shown instead of the one with the specific unique id. It seems that the unique id is not there fast enough even though it is in the url.

So i am considering moving back to using sates or a hybrid version I don’t know.

Did you run into that type of issue ?

0 Likes

#6

As you I fixed the problem with the plugin Browser Storage. My URL is now clean, and I can write (like cookies) anything I want in Session storage or Local Storage (see the plugin for more info).

0 Likes

#7

ok indeed that seems to be the best idea !

But why use the browser storage and not the regular states on a group ?

0 Likes

#8

You passed info from one page to another within URL, right? That’s my understanding. Maybe explain more what you mean by regular states on a group from one page to another? Local storage is permanent in the browser. So when a user closed and come back, the info is still their to identify the user.

0 Likes

#9

Yes correct I get it now thank :smiley:

Nice indeed !

Thanks!

Jules

1 Like

#10

Hi! Does anyone has available an editor version of this type of one-page-structure, or at least some kind of detailed screenshots to check out all this related to using the url parameters, groups, etc?

@jordan.shotwell @jules.marcilhacy @JohnMark

0 Likes

#11

I agree…I always find it so much more helpful when editors are shared or screen shots at a minimum to help others figure their own way through instead of needing to ask before even making a first attempt based on a model or example

0 Likes

#12

Hi @boston85719 & @CapiBalid,

This link below should help :slight_smile:
https://forum.bubble.is/t/architecture-layout-best-practice-one-page-with-multiple-functions-groups-vs-multiple-pages/12541/8?u=mukhtar007

0 Likes

#13

Thanks, will read through but looks like it is the answer…cheers

0 Likes