How to use built in Bar element (bottom Nav)

Yeah! I’m thrilled to see an existing element for bottom navigation! How do I learn how to configure it so the nav buttons go to the right page and that the nav button text says the right word? I searched your documentation, but found nothing.

Hey @fredo22, not sure to fully understand your need.

Do you want to change the text in the navbar and changing its links?

yes, change text in each tab of the bottom nav bar and set page link.

Aka: HOW TO CONFIGURE the bottom nav bar :wink:

It’s bound to a variable called ‘Architecture’ in ‘Bottom bar’ folder. You can either adjust it there or unbind the repeated div and edit the icons, text and links directly.

thanks @luka . What are the pros and cons of the two methods? It seems easier to unbind and just change them manually. As long as I add the links to other pages correctly, am I missing out on any essential functionality that I’d get if I left it bound to Architecture variable and made edits there?

@luka When I try to replace “icon”:”icon-home” with “icon”:“fas fa-list-ul]” it doesn’t work.
Screen Shot 2023-04-24 at 10.51.24 AM

@Joyce Would you please consider doing a video on how to configure the Bar element (bottom navigation)? I can’t find any documentation, and the user experience for that element is very confusing! I can tell that it’s powerful, but editing in the Architecture variable isn’t working for me, and editing the “Target” formula is utterly confusing me. Please help :wink: Thanks for considering.

1 Like

if youre familiar with linked sections you should unbind the bottom bar from the variable and just use the editing to set links, icons and texts. we might change this element to not use the variable anymore, but its only there for newer users who arent aware of the linked sections

so yes, just unbind it and edit it as you wish then use it as a linked section

Never mind :slight_smile: @luka explained that I’m just as well off forgetting about the variable and configuring each tab manually.

1 Like

The element is now updated in the toolkit not to use the variable. Thank you for the feedback

1 Like