# Configuring Key pages
**Key pages** divide a web application into relevant parts based on URL patterns, and events detected based on CSS selectors and/or browser tab titles. This way, you can gain insights on business-critical points of end-users journey by allowing you to:
* Tag page view events, even if you disable[ URL collection](#keypages-discoveringkeypagesbycollectingurlsurlcollect) for specific applications for privacy reasons. Upon detecting an event, [Nexthink browser extension](/platform/configuring_nexthink/bringing-data-into-your-nexthink-instance/deploying-nexthink-in-non-vdi-environment/installing-the-nexthink-browser-extension.md) tags the page view or usage event with the pre-defined key pages.
* Track the usage of different parts or elements of an application, unlike URLs, which are not available on `web.events` table.
* Detect soft navigation events where URLs remain unchanged.
* Indicate specific business operations when adequately defined. For some business applications such as Oracle NetSuite ERP or SAP S/4 HANA ERP, the URLs change according to the application functionality.
* Provide insights into which pages are loaded for various business transactions, how often, and what their page load time is.
* Filter the **Applications** dashboard based on specific key pages.
***
## Configuring Key pages for web applications
After [configuring the fields in the General tab](/platform/user-guide/applications/configuring-applications/configuring-web-applications.md) of the web application configuration, follow these steps to configure the **Key pages** tab:
{% stepper %}
{% step %}
[Discover key pages](#keypages-discoveringkeypagesbycollectingurlsurlcollect) specific to the target web application by collecting URLs.
{% endstep %}
{% step %}
[Add key pages](#keypages-definingkeypages) for the web application.
{% endstep %}
{% step %}
Optionally, [define CSS selectors](#defining-css-selector) for **Key page detection** based on page elements.
CSS key-page identifier detection works even when the web application URL remains unchanged.
If needed, use defined CSS selectors as identifiers when [adding key pages](#keypages-definingkeypages).
{% endstep %}
{% step %}
[Order key pages](#ordering-key-pages) to ensure proper URL matches.
{% endstep %}
{% endstepper %}
{% hint style="info" %}
**Alternative option**—requires [Nexthink Adopt](/platform/user-guide/adopt.md):
Import predefined and non-customizable key pages from [built-in default configuration](/platform/user-guide/applications/configuring-applications/configuring-web-applications.md#configuringwebapplications-understandingurlpatterns-1) templates available for specific web applications. This feature is different from applications installed from Nexthink Library.
{% endhint %}
### Discovering key pages by collecting URLs
The [Collect URLs option](/platform/user-guide/applications/configuring-applications/configuring-web-applications.md#configuringwebapplications-collectingurls) is enabled by default for general application configurations**.** Therefore, to discover key pages specific to an application:
1. Click on the **Troubleshoot** tab of the chosen application dashboard page.
2. View the **Key pages & URLs** table to identify URLs with the most significant number of **Frustrating page loads** for end-users.
You can map these URLs into key pages as Nexthink displays them in descending order for page load times.
### Adding key pages
To create a new key page from the selected web application configuration page, under the **Key pages** subtab:
1. Click the **Add key page** button to open **Edit key page** pop-up and fill in the fields:
* The **Key page name** can be composed of any standard safe character combination separated by a space, up to 100 characters long. It must be unique across an application.
2. Add at least one **identifier to use**:
* The **URL path** to detect the key page. The system supports the use of `*` [wildcards](#considerations-when-defining-url-paths-for-key-pages).
* The **Base URL pattern** restricts key-page URLs to the application's URL patterns defined under the [General tab](/platform/user-guide/applications/configuring-applications/configuring-web-applications.md#configuringwebapplications-understandingurlpatterns). Therefore, key-page patterns can match more than one base application pattern.
* **Tab title** with full name—or partial name using `*` wildcards—displayed on your browser tab for the specific webpage.
* This method enables you to detect soft navigation events where URLs remain unchanged.
* [Configured CSS selectors](#defining-css-selector) of page elements that Nexthink uses to consistently identify the key page whenever the element is present on the webpage.
* This method enables you to detect soft navigation events where URLs remain unchanged.
3. **Save** after all fields are defined.
#### Considerations when defining URL paths for key pages
When defining key pages, it's important to consider the following points:
* The path pattern can contain any character allowed in URLs, as well as the wildcard character `*`.
* The path pattern can contain more than one `*` wildcard.
* Any wildcards `*` need to be specified. If you do not define the `*` as a prefix for the path, the system appends it to the application’s URL pattern without any `*`. See the [examples](#keypages-examplesofkeypagepatternskeypatternexample) below.
* The same path pattern and application pattern name pair cannot appear more than once in the current application definition. As a workaround, select more than one application pattern for the given key page path.
* The key page name needs to be unique per application.
Examples of Key page URL patterns
Key page path `*page1*`which belongs to the application URL pattern `*://www.example.com/foo/*`
* This translates into `*://www.example.com/foo/*page1*`
Key page path `page2` which belongs to the application URL pattern `*://www.example.com/foo/*`
* This translates into `*://www.example.com/foo/page2`
### Defining CSS selectors for k**ey pages**—optional
{% hint style="info" %}
In addition to URL-based tracking, Nexthink **Key pages** also capture events using browser tab titles and CSS element selectors. These methods identify soft navigation events where URLs remain unchanged.
{% endhint %}
To define CSS selectors for **Key page detection** based on page elements, from the selected web application configuration page under the **Key pages** subtab:
1. **Add a new key page identifier** to open a popup window and fill in the fields:
* **Name** for the target web page element.
* **CSS selector** of the page element that Nexthink uses to consistently identify key pages whenever the element is present on the webpage.
* **CSS selector** supports complex selectors, for example: `#id > .class div[attr=value]`
* Extract **CSS selector** from the web application page using your[ browser developer tools](/platform/user-guide/applications/configuring-applications/configuring-web-applications/transactions.md#transactions-usingthechromedevelopertoolsdevtools) or [Nexthink browser extension](/platform/user-guide/applications/configuring-applications/configuring-web-applications/transactions.md#transactions-usingthenexthinkbrowserextensionbrowser)—the extension does not currently support Firefox.
2. **Save** the CSS key page identifier for future use when [adding key pages](#keypages-definingkeypages).
### Organizing key pages in the correct order
You can overlap key page match patterns by following the appropriate order in the Nexthink web interface.
When reviewing a set of key pages, matching operations start at the top of the list and move towards the bottom to find a match. If the system finds a match, the process stops, and other patterns are not checked.
For example, the pattern `/a/b/*` should be listed above `/a/*`; otherwise a page `/a/b/c` would match `/a/*` and not `/a/b/*`. Below you can find an image with an explanation of the correct order.
In the example above, the ideal configuration would be the first option. In the second one, Outbound and Dispatch Shipment are tagged with the first key page, as it has a more generic tag.
To change the order of key pages from the selected web application configuration page:
1. Under the **Key pages** tab, hover an item from the list and open the action menu.
2. Click one of the possible options: **Move up**, **Move down**, **Move to top**, or **Move to bottom**.
## FAQ
How can I view the key pages currently configured for a web application?
To view the key pages currently configured for a web application:
1. Open to **Applications** > **Manage applications** from the main navigation.
2. From the **Applications** table, open the [application configuration](/platform/user-guide/applications/configuring-applications.md#managingapplications-configuringapplications) page of the target web application.
3. Go to the **Application settings** > **Key pages** tab to examine the list of configured key pages.
***
RELATED TASKS
* [Configuring Transactions](/platform/user-guide/applications/configuring-applications/configuring-web-applications/transactions.md)
* [Setting application licenses](/platform/user-guide/applications/configuring-applications/configuring-web-applications/application-licenses.md)
* [Setting application thresholds](/platform/user-guide/applications/configuring-applications/configuring-web-applications/thresholds.md)
RELATED TRAINING
* [How to configure the Applications module](https://learn.nexthink.com/courses/how-to-configure-applications-module)
---
# 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://docs.nexthink.com/platform/user-guide/applications/configuring-applications/configuring-web-applications/key-pages.md?ask=
```
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.