The flow of navigation for an app is generally as follows:
Splash Screen -> Walkthrough Screen (For First-Time Users) -> Authentication Screen (If Required) -> Home Screen
Nectar follows the same convention by default. But you can change the flow completely by configuring some parameters.
window.config.navigationobject, you can make changes.
enabled: !Framework7.device.standalone && !Framework7.device.cordova
The above code means that when a user visits your web app via web browser URL, the custom splash screen is shown. This custom splash screen is not native but just an HTML page defined in
If the app is installed on user home screen or the app is Cordova based, then this custom splash screen is not shown. Instead native splash screen is shown defined in
<meta>tags for PWAs and
Splash is mandatory for Cordova, optional for PWAs (In PWAs, splash screens are automatically created from the
If you want to disable splash screen for the website, then set:
Nectar comes with a Walkthrough screen, which is defined in
If you want to disable walkthrough screen, then set:
By default, this walkthrough screen is enabled, and shown to the user when the web app is installed and opened for the first time. After that the walkthrough screen is not shown.
If you want to always show the walkthrough screen, then set:
If your app needs user authentication, then set:
If you want to present the user with Log In screen as the app starts, then set:
guestAccess: false // If true, the app will skip the Log In screen.
Even if your app needs user authentication, there are some screens which should be accessed by guest users. You can define such screens inside:
By default, the home screen is set to
You can change it to other screen, for example,