# No Internet View

<mark style="color:green;">What is No Internet View?</mark>

When the user is using the application without internet connection, instead of showing the infinite loader, you can use our customized No Internet View screen.

## <mark style="color:green;">Enable No Internet Integration</mark>

<figure><img src="https://3731994945-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MlBy5z08zL1UoCwNqmg%2Fuploads%2Fbf9CPuAIEL7HTEHDHXjG%2FScreenshot%202025-12-12%20at%204.31.06%E2%80%AFPM.png?alt=media&#x26;token=74ad7f00-cb3b-4cc6-85fc-9b2178715da7" alt=""><figcaption></figcaption></figure>

## <mark style="color:green;">Customize it however you want</mark>

### **Header Image**

Choose the main illustration displayed at the top of the No Internet screen.

1. **Select Image :** Pick from a set of professionally designed default images.
2. **Upload Image :** Upload your own custom illustration.\
   Supported formats: PNG. JPG. PEG

<figure><img src="https://3731994945-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MlBy5z08zL1UoCwNqmg%2Fuploads%2FAsj8sQvipWpKiW4k1t3N%2FScreenshot%202025-12-12%20at%204.43.56%E2%80%AFPM.png?alt=media&#x26;token=b81a550a-60b6-410a-b57f-5f7051489232" alt=""><figcaption></figcaption></figure>

### **Title**

This section lets you customize the main heading displayed on the No Internet screen.

#### **Fields:**

* **Title** – Main text (required)
* **Text Style** – Use predefined styles or choose **Custom**
* **Font Size (px)** – Defines size in pixels
* **Font Weight** – Regular / Medium / Bold
* **Font Style** – Select from available font families
* **Color** – Choose preset colors or apply a custom HEX value with opacity

![](https://3731994945-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MlBy5z08zL1UoCwNqmg%2Fuploads%2FEHL7V1lUrMDylUs5GXj4%2FScreenshot%202025-12-12%20at%204.46.20%E2%80%AFPM.png?alt=media\&token=2fc1ea14-502e-4772-b8d8-a74244a8ec45)![](https://3731994945-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MlBy5z08zL1UoCwNqmg%2Fuploads%2FY3HXg6JVZ7YU6FlYQo2m%2FScreenshot%202025-12-12%20at%204.48.53%E2%80%AFPM.png?alt=media\&token=be8f72d0-d4ed-4123-8d8f-ee44c10b6dd4)

### **Description**

Customize the explanatory text shown below the title.

#### **Fields:**

* **Description** – Required text explaining the issue
* **Text Style** – Use default or custom
* **Font Size (px)** – Adjust text size
* **Font Weight** – Regular / Medium / Bold
* **Font Style** – Choose any available font
* **Color** – Theme-based or custom HEX value

Use this to guide users clearly, e.g.:

> "No internet connection found. Check your connection and try again."

![](https://3731994945-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MlBy5z08zL1UoCwNqmg%2Fuploads%2FaOqh72fCwS5DXDVYhDd5%2FScreenshot%202025-12-12%20at%204.50.20%E2%80%AFPM.png?alt=media\&token=4978f32b-96a2-45a7-899e-5cf6a59c4011)![](https://3731994945-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MlBy5z08zL1UoCwNqmg%2Fuploads%2F6rDgJ0pNsz1CCA0JDKIj%2FScreenshot%202025-12-12%20at%204.49.21%E2%80%AFPM.png?alt=media\&token=5a7f394c-a934-414f-a7c1-7c65d836b1b6)

### **Button**

Configure the action button displayed at the bottom of the No Internet screen.

#### **Fields:**

* **Button Text** – Label text (required)
* **Button Style** – Choose from available button design presets

This button usually performs a **Retry** action or reloads the screen when the user regains connection.

![](https://3731994945-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MlBy5z08zL1UoCwNqmg%2Fuploads%2FlcP7sFgNN2NIeiwg8bPD%2FScreenshot%202025-12-12%20at%204.54.10%E2%80%AFPM.png?alt=media\&token=ed7918b2-2968-410c-9a40-523b80c86185)![](https://3731994945-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MlBy5z08zL1UoCwNqmg%2Fuploads%2FC7e1lF8r8Dj1U5E10yed%2FScreenshot%202025-12-12%20at%204.54.20%E2%80%AFPM.png?alt=media\&token=bc303ece-d880-4eeb-ad48-a9012c6ccf4d)

### **Save Changes**

Once customization is complete:

* Click **Save As a Draft** if you want to save it but not publish yet
* Click **Publish**  to apply the No Internet View to your live app version