Two Different Tabs

Hi,

I’m new to Bubble, and I’m trying to add a new tab at the top called ‘Manage,’ which is separate from Dashboard, but it’s showing up as if it’s the same. How do I make them separate, so when I click Manage on the right side, the manage tab shows up, and when I hit Dashboard on the left side, the Dashboard shows up.

https://fscltest.bubbleapps.io/version-test/account?debug_mode=true

Thanks

Hey @sam10

You need to create custom states and conditions on elements to make it work

Here is the demo: https://ambroisetestapps.bubbleapps.io/version-test/tabs?debug_mode=true
And the editor: https://bubble.io/page?type=page&name=tabs&id=ambroisetestapps&tab=tabs-1

Hope that helps

@ambroisedlg Thanks Im trying to figure it out. I need to add a new state. What would the state type be?

@sam10 Have a look on the group Main (the one with both tabs in it). The state is “Tab” which is of type Number

@ambroisedlg I can’t seem to get Manage to show as a tab on the top, and therefore I can’t test it, do you know what to do to show the ‘Manage’ Tab at the top?

@sam10 I’m not sure I understand why you can’t show the tab, can you share your editor in view mode?
The structure is:

  • Group Main is the group that includes two other sub-groups: Dashboard and Manage.
  • When a sub-group is clicked, it changes the state “Tab” of Main to either 1 (for Dashboard) or 2 (for Manage)
  • Both sub-groups have conditions depending on the “Tab” state

@ambroisedlg here you go
Design:https://bubble.io/page?type=page&name=account&version=test&id=fscltest&tab=tabs-1
Workflow: https://bubble.io/page?type=page&name=account&version=test&id=fscltest&tab=tabs-2

@sam10

  1. My state Tab of type Number (1 and 2) was only an example. It seems you are using a current state of type Text on the Dashboard Menu Desktop, which works too. But then in your “When Button Manage is clicked” workflows, you should set this to
    Element : Dashboard Menu Desktop
    Custom state : current
    Value : manage

  2. You currently have the same conditions (When current is dashboard) on both the Dashboard button and Manage button in your Desktop Menu Dashboard buttons. The condition for the Button Manage should be “When current is manage
    tabs-state1

  3. Same thing on the Group Manage, you currently have “When current is dashboard > This element is visible”. It should be “When current is manage > This element is visible”

If you make all those changes it should work fine :wink:

@ambroisedlg Thank you so much! The only issue I’m having is that whenever I try to have it say for the Value ‘Group Manage’ it is forcing me to put in an additional value after (for example: 's Tab…). Not sure how to get around this.

@sam10 don’t try to put a dynamic value in this, just write manage
It’s the same logic than for the Button Dashboard that you did perfectly btw

@ambroisedlg Ok - i got that part, I think we’re almost there! It’s still not visibly showing up in the Dashboard Menu Desktop Is there anything Im still missing?
Thanks!

@sam10 did you solve this? I can’t see anything wrong with your setup

Hey @ambroisedlg I don’t know if you know what’s going on, but the manage tab is popping up, and then going away (attached video) when I reload the page. Do you know why this could be happening/how to fix it?

Thanks

Hey @sam10 I’m not in front of my computer right now but I’m thinking it might be because of a combination of a « Do when » workflow with a custom state on the Manage button

If you can’t find the issue, the best way to solve this might be to reproduce the design (delete the Manage button and replace it by a new one)

Happy to have a look some time tomorrow, let me know if you solved it by then

Hey @ambroisedlg I still can’t seem to figure it out. It went back to the way it was… not sure what I did wrong. If you have some time to take a look, that’d be great! Thanks

@sam10

The button Manage is now visible but it seems that the whole thing is a horizontal RG, not sure that’s the best way to display the menu to be honest

I made an account_test page and changed the menu to a standard group for you to see the difference and pick whichever you prefer