---
title: "Connection"
slug: "connection-template"
updated: 2026-06-29T10:44:26Z
published: 2026-06-29T10:44:26Z
canonical: "learn.servitly.com/connection-template"
---
> ## Documentation Index
> Fetch the complete documentation index at: https://learn.servitly.com/llms.txt
> Use this file to discover all available pages before exploring further.
# Connection
This component provides the templates you can use to display the connection information for the connected products.
The templates below can be used to display the status and quality of the connection, even aggregated on location or customer, helping the various users of the DPS to understand if there is any connectivity problem. To do this, in addition to the [Connection Status](https://help.servitly.com/hc/en-us/articles/10476163144221) metric, it is necessary to configure the [Connection Index](https://help.servitly.com/hc/en-us/articles/11712620810524) insight.
Technical templates require defining additional thing properties to save the connection type (Wi-Fi or Cellular), and a metric to register the signal level. For each template, you can find the list of required data.
## Customers Overview
Visualization of connection analysis among multiple customers. It can be used in a general-purpose page, either as a standalone page or as a fragment combined with other templates.
| Template name | *connection_customers_overview* |
| --- | --- |
| Usage | General Page |
| Target users | Service Manager, Sales Manager |
This template displays:
- The number of customers grouped by connection index level.
- The number of machines grouped by connection index level.
- The list of customers sorted by customer connection index.
ScreenshotTemplate

```xml
```
## Thing Details
Provides the operations manager with a detailed view of the connection index of a single machine. It can be used within the detail view of a thing, either as a full page or as a reusable fragment embedded alongside other content.
| Template name | *connection_thing_details* |
| --- | --- |
| Usage | Thing Details Page |
| Target users | Operation Manager |
This template displays:
- The average value and trend of the connection index over time, highlighted by a threshold.
- The percentage of time spent in online status.
- The number of disconnections.
- The total time disconnected.
- The daily details of the connection status.
ScreenshotTemplate

```xml
```
## Thing Details Technical
Provides technical users with useful information about the connection of a single machine. It can be used within the detail view of a thing, either as a full page or as a reusable fragment embedded alongside other content.
| Template name | *connection_thing_details_technical* |
| --- | --- |
| Usage | Thing Details Page |
| Target users | Service Technician, Internal Maintenance Technician, R&D Manager |
This template displays:
- The type of connection and signal level.
- The connection index for the past 30 days.
- The details of the connection status for the past 7 days.
- The connection index benchmark of the past 30 days compared with similar products.
- The Wi-Fi and signal level.
- The firmware version history.
ScreenshotTemplate

```xml
```
## Customer Details
Displays aggregate connection analysis across multiple machines. It can be used in a general-purpose page, either as a standalone page or as a fragment combined with other templates.
| Template name | *connection_customer_details* |
| --- | --- |
| Usage | General Page |
| Target users | Operation Manager, Service Manager |
This template displays:
- The average connection index over the selected period.
- The trend of the Connection Index over the selected period.
- The number of machines grouped by the quality of the Connection Index.
ScreenshotTemplate

```xml
```
## Thing Card Detailed
Displays machine connection information in a card. It can be used within the detail view of a thing, either as a full page or as a reusable fragment embedded alongside other content.
| Template name | *connection_thing_card_detailed* |
| --- | --- |
| Usage | Thing Details Page |
| Target users | Operation Manager, Service Manager |
This template includes:
- The connection index of the last day.
- The percentage of time spent in online status.
- The number of disconnections.
- The total disconnection time.
ScreenshotTemplate

```xml
```
## Thing Card Index
Displays the machine connection index over the last 30 days on a card. It can be used within the detail view of a thing, either as a full page or as a reusable fragment embedded alongside other content.
| Template name | *connection_thing_card_index* |
| --- | --- |
| Usage | Thing Details Page |
| Target users | Any |
The value is highlighted according to the connection index thresholds. In this way, at a quick glance, it will be possible to see if everything is okay.
ScreenshotTemplate

```xml
```
## Thing Grid
Displays the connection insight of multiple machines through a thing grid widget. It can be used in a general-purpose page, either as a standalone page or as a fragment combined with other templates.
| Template name | *connection_thing_grid* |
| --- | --- |
| Usage | General Page |
| Target users | Operation Manager, Service Manager |
ScreenshotTemplate

```xml
```
## Thing List
Display a list of things with additional columns related to the connection. It can be used in a general-purpose page, either as a standalone page or as a fragment combined with other templates.
| Template name | *connection_thing_list* |
| --- | --- |
| Usage | General Page |
| Target users | Any |
ScreenshotTemplate

```xml
```
# Configuration
Here are some tips for integrating the Connection Index within your DPS, supporting the various users who need to know how products are connected to the cloud.
The templates provided by this component can be used inside main pages, tabs, or embedded into cards.
## Connection Page
For the Service Manager and Sales Manager, you can add a main page called Connection, which provides these users with a connection index overview of the customers.
To add the Connection page, you should:
1. Enter the *Interfaces / Views* page.
2. Select the *General* tab and then the View you want to modify (e.g., Service Manager).
3. Press the *Add Page* button and provide the required information. As the icon for the menu item, you can use one of the images in the Resources paragraph below. 
4. Press the *Add Sub Page* button and provide the required information. 
5. Select the *connection_index_customers_overview* template.
6. Confirm and save the page.
For the *Service Manager* view, you also need to configure an additional page:
1. Enter the *Service Manager* view.
2. Select the *Customer* details page.
3. Add a sub-page named *Connection*, set the navigation as *Tab,* and the path as *connection.*
Select the template named *connection_customer_details*.
## Resources
You can use the following icons in case the page is visible into a menu.
| Dark | Light |
| --- | --- |
|  |  |
For more icons, you can refer to this [page](https://help.servitly.com/hc/en-us/articles/12119392844828).