App Layout
As Nectar has Single Page Application (SPA) architecture, the app shell layout is defined inside index.html

Navigation Layouts

Nectar supports two main navigation layouts widely used in apps — Hamburger and Tab Bar.
Hamburger Layout
Tab Bar Layout

Setting up Hamburger Layout

By default, Hamburger layout is set up for Nectar.
1. Open /assets/custom/js/config.js file.
2. Inside window.config.theme = { set navigation: 'hambuger'
3. Open index.html file.
4. Uncomment HTML inside <!-- Hamburger Navigation -->
5. Comment HTML inside <!-- Tab Bar Navigation -->

Setting up Tab Bar Layout

1. Open /assets/custom/js/config.js file.
2. Inside window.config.theme = { set navigation: 'tabbar'
3. Open index.html file.
4. Uncomment HTML inside <!-- Tab Bar Navigation -->
5. Comment HTML inside <!-- Hamburger Navigation -->
You can use only one type of navigation layout at a time, either Hamburger or Tab Bar.
Push State (#!) does not work for Tab Bar Layout.
Last modified 2yr ago