How to Create A Custom 404 Error Page in Laravel 10

This Laravel 10 tutorial will help us understand how we can create any error page like 404, 403, 419, 255, 405 or 500 which is customizable in our laravel app. Laravel 10 is the best framework which provides us easy ways to add exceptions to the pages.

The best thing about Laravel is we get a error handling class which helps us identify, handle and respond every error happening in Laravel environemnt. We can also handle errors with the auto-response if we set debug property to “false” but we can also add a custom error handling template as well.

Let’s see the example on how we can create our custom 404 error page in Laravel 10.

Create New Laravel Project

We need to create a new Laravel project for this. We will use this command:

composer create-project laravel/laravel --prefer-dist laravel-404-error-handling

Create A Custom 404 Error Page

We need to understand that we have to create blade view for error pages. Check and move the pat from here resources/views/, then we have to create errors folder to store the error pages and add 404.blade.php file in the directory. So if there’s no relevant URL available the user will redirect to the 404 page.

Same goes for creating blade views for 255, 403, 405, 419 and 500 errors.

Include the following code in resources/views/errors/404.blade.php error file.

<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>404 Custom Error Page Example</title>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
</head>
<body>
    <div class="container mt-5 pt-5">
        <div class="alert alert-danger text-center">
            <h2 class="display-3">404</h2>
            <p class="display-5"> 404- You Hit The Deadlock</p>
        </div>
    </div>
</body>
</html>

Once we added our script now we need to test our error 404 custom template by running the app

php artisan serve

We all know why 404 error pages shown. The user gets redirected to that whenever the existing URL goes down/offline/does not exist.

http://127.0.0.1:8000/not

This is the simplest way to create your custom error 404 template in Laravel 10. Please feel free to post your comments/questions regarding this post.

Contents

Create New Laravel Project

Create A Custom 404 Error Page