Forum Academy Marketplace Showcase Pricing Features

How to implement a single-page like application

I have created a toggle button like this one which will load 2 different pages.
My initial approach is redirecting to separate pages. And I thought if I can implement a tab-like page. But not actually a tab but a toggle icon.

bubble-toggle

If yes, would you share what object, plugins should I use?

Thanks!
Lui

Hey there!

What you could do is have two very large wrapper groups. These groups contain all the elements of each “page” you want the toggle to go between. You can hide or show each group based on the state of the switch.

There are loads of tutorials for this. Here’s Bubbles

Thank you for help. Not the “work around” I’m exactly looking for.

But, this is very interesting.

could you provide more details on what you’re trying to accomplish? i re-read your post but if @anthony.schanen’s solution wasn’t quite right, what’s not fitting about it for your project?

Thank you for asking. I thought there’s an object like the Tab Element that I can just drag and drop, and boom use.
@anthony.schanen 's suggestion kinda do the job. I just need to take care the updating of the custom states and the lay-outing of each “page”.

My bad. What I mean is, that’s not the exact solution I’m looking for.

I’d recommend spending an hour on these videos from @rico.trevisan: Single-page application framework: App Shell [free tutorial]

Once you get his concept down, simply add another condition for the toggle… or depending on what you’re building, you may not end up needing the toggle anymore :slight_smile:

1 Like

Thank you Taylor. That’s pretty interesting - using options.

1 Like