Hello artisan, today I will show you how to create a custom error page in laravel 8.0. This means 404 pages. This article will give you a simple example of how to create a 404 error page in laravel 8.0. In this article, we will implement a how to set 404 error page in laravel 8.0.
You need to create a blade file like as bellow
Read also: How to create pagination in laravel 8.0
Read also: How to generate pdf using dompdf in laravel 8.0
404.blade.php
on errors(resources/views/errors) directory in laravel 8. you can see I created 404 blade file and check it on your project.
Almost we are using the theme for front-end or backend side and we always looking for set 404, 500, or 505 error page design from there that we used for the project. So it is a very simple and easy way to create custom 404 pages in laravel 8 projects. I added the below screenshot of laravel 8 error page design.
Create custom 404 page
You can desing you custom error page according to yours need. In this example, I am going to show you how to create a custom error page in laravel 8.0. stay tuned!
resources/views/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">
<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: #34495e;
}
.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">
<h1 class="m-0">404</h1>
<h6 class="alert alert-danger">Page not found</h6>
<h3>GO <a href="{{url('/')}}">HOME</a></h3>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
Now you can simply run your application by following command:
php artisan serve
Now you can open following url and you will see error page as above:
http://localhost:8000/wqwwq