# Navigation

## Overview

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.

1. Open `/assets/custom/js/config.js`
2. Inside `window.config.navigation` object, you can make changes.

## Splash Screen

```javascript
splash: {
    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 `/partials/screens/splash.html`

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 `manifest.json` or `<meta>` tags for PWAs and `config.xml` for Cordova.

Splash is mandatory for Cordova, optional for PWAs (In PWAs, splash screens are automatically created from the `manifest.json` or `<meta>` tags.)

If you want to disable splash screen for the website, then set:

```javascript
splash: {
    enabled: false
}
```

## Walkthrough Screen

Nectar comes with a Walkthrough screen, which is defined in `/partials/screens/walkthrough.html`

If you want to disable walkthrough screen, then set:

```javascript
walkthrough: {
    enabled: false
}
```

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:

```javascript
walkthrough: {
    showFirstTimeOnly: false
}
```

## Log In Screen

If your app needs user authentication, then set:

<pre class="language-javascript"><code class="lang-javascript"><strong>authentication: {
</strong>    required: true
}
</code></pre>

If you want to present the user with Log In screen as the app starts, then set:

```javascript
authentication: { 
    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:

```javascript
authentication: {
    ignoreRoutes: []
}
```

### Home Screen

By default, the home screen is set to `'./partials/screens.home.html'`

You can change it to other screen, for example,

```javascript
home: {
    url: './partials/screens/dashboard.html'
}
```


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://pmsgz.gitbook.io/nectar/basics/navigation.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.