10-Apr-2023
.
Admin
Hi all,
Today, I am going to show you laravel 9 create a custom error page with example. In this tutorial, we will learn how to create/build custom error pages in laravel 9 apps. So we can set the custom error page globally in our laravel 9 project. In this article, we will implement a how to set 404 error page in laravel 9.
laravel 9 display default error page 404, 500. But if you want to design of this pages. This tutorial will guide you step by step from scratch for how to create custom 404 error page in laravel 9.
You can create following error pages in laravel 9:
401 Error Page
403 Error Page
404 Error Page
419 Error Page
429 Error Page
500 Error Page
503 Error Page
Let's see how to customize the error page design in the laravel 9 app.
Step 1: Download Laravel
Let us begin the tutorial by installing a new laravel application. if you have already created the project, then skip following step.
composer create-project laravel/laravel example-app
Step 2: Publish Error Page Default Files
In this step, we will run laravel command to create default error page blade file. when you run below command then laravel will create "errors" directory with all error pages in views folder. so, let's run below command:
php artisan vendor:publish --tag=laravel-errors
Step 3: Update 404 Error Page Design
You can update 404 error page design with following code:
view/errors/404.blade.php
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js"></script>
<style type="text/css">
body{
margin-top: 150px;
background-color: #C4CCD9;
}
i{
font-size:90px !important;
color:#5D6572;
margin-top:20px;
}
.error-main{
background-color: #fff;
box-shadow: 0px 10px 10px -10px #5D6572;
}
.error-main h1{
font-weight: bold;
color: #444444;
font-size: 100px;
text-shadow: 2px 4px 5px #6E6E6E;
}
.error-main h6{
color: #42494F;
}
.error-main p{
color: #9897A0;
font-size: 14px;
}
</style>
</head>
<body>
<div class="container">
<div class="row text-center">
<div class="col-lg-6 offset-lg-3 col-sm-6 offset-sm-3 col-12 p-3 error-main">
<div class="row">
<div class="col-lg-8 col-12 col-sm-10 offset-lg-2 offset-sm-1">
<i class="fa fa-frown-o" aria-hidden="true"></i>
<h1 class="m-0">404</h1>
<h6>Page not found - Nicesnippets.com</h6>
<p>Lorem ipsum dolor sit <span class="text-info">amet</span>, consectetur <span class="text-info">adipisicing</span> elit, sed do eiusmod.</p>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
Run Laravel App:
All steps have been done, now you have to type the given command and hit enter to run the laravel app:
php artisan serve
Now, you have to open web browser, type the given URL and view the app output:
http://localhost:8000/tststs
Output:
I hope it can help you....
#Laravel 9
