While making changes or updating a web application we require to show a page that tells the end-user that the web application is under maintenance and won't be available for a while. To accomplish this requirement we add an Html page to the root directory of the web application named "App_offline.htm".
This mainly helps us to show the end-user a user-friendly message instead of an ugly and flimsy error.
Below is a code snippet of the contents for an "App_offline.htm" which is made using Bootstrap 3.
<!doctype html>
<html>
<head>
<title>Down for maintenance</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<style>
.error-template {
padding: 40px 15px;
text-align: center;
background-color:#efefef;
margin-top: 50px;
}
.error-actions {
margin-top: 15px;
margin-bottom: 15px;
}
.error-actions .btn {
margin-right: 10px;
}
</style>
</head>
<body marginwidth="0" marginheight="0">
<div class="container">
<div class="row">
<div class="col-md-12">
<div class="error-template">
<h1>
This site is currently down for maintenance
</h1>
<div class="error-details">
We will be back up and running as fast as possible. <br /> Sorry for the inconvenience.
</div>
</div>
</div>
</div>
</div>
</body>
</html>
