Bottom Navigation Bar
The Bottom Navigation Bar provides quick access to key sections of your app, similar to apps like Instagram or YouTube.
As shown in the image, QuikApp allows you to fully customize the navigation menu, layout, and styling to match your app’s branding and user flow.
Navigation Items (Tabs)
You can add up to 5 navigation tabs.
Fields Used (Per Tab)
- Menu Icon
Select an icon from the QuikApp icon library for each tab.
You can also upload custom icons in ICO file format.
- Menu Title
Text label shown below or beside the icon (e.g., Home, Menu, FAQ, Contact). - URL
The destination link opens when the tab is tapped.- Website URL (e.g., https://yourwebsite.com/page)
- Special value: chatbot (to open the in-app chatbot)
- Remove Icon (–)
Delete a navigation item.
⚠️ A message will be shown if you exceed the maximum allowed 5 number of menus.
Chatbot Integration
Enable Chatbot (Toggle)
Allows you to add a Chatbot tab directly into the bottom navigation bar for instant user support.
Navigation Layout & Styling
- Icon Positioning Choose how icons and text are displayed (e.g., Icon above text).
- Navigation Background Color Sets the background color of the bottom navigation bar.
- Icon Color Color of navigation icons (inactive state).
- Font Color Color of menu labels (inactive state).
- Active Menu Color Highlight color for the currently selected tab.
- Font Style Select the font family for menu labels.
- Font Size Adjust the size of the menu text.
- Font Format Apply Bold or Italic styling to labels.
Why It’s Useful
Quick access
Allows users to navigate between main sections with a single tap.
Improves usability
Reduces navigation friction and improves overall app experience.
Brand consistency
Custom colors, fonts, and icons help maintain a consistent brand identity.
How to Enable Bottom Navigation
- Go to App Dashboard
- Navigate to Customization → Bottom Navigation Bar
- Toggle Bottom Navigation Bar ON
- Add up to 5 tabs and configure icons, titles, and URLs
- Save and preview the app in real time
