How to create custom error page in Laravel?

Share Me
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  

Today now in this post i will show you How to create custom error page in Laravel? If we are think about how can we create the custom error page as like 403, 404, 405, 408, 500, 502, 504 on my laravel application then we can do this easily and implement this very easily. So we can set the custom error page globally in our laravel project. If we want to create 404 our custom design error page then we can do this very easily.

So now in this post i will show you about how to create the custom layout for error page, if we think here we want to display the 404 page layout difference, 505 error page layout difference, 500 error page layout difference for etc. we can do it very simple. We need to just create the every page have its own the blade layout as like for 404.blade.php, 404.blade.php or 504.blade.php etc.

Ok, so at first need to open app/Exceptions/Handler.php file and just bellow code. Here Handler.php file is handle our all the error like 404, 500 etc, on that way i will add the code if we have blade layout file for special error as like 404.blade.php file then it will display on your file.

So at first open the handle.php and put the bellow code.

app/Exceptions/Handler.php

namespace App\Exceptions;


use Exception;
use Illuminate\Validation\ValidationException;
use Illuminate\Auth\Access\AuthorizationException;
use Illuminate\Database\Eloquent\ModelNotFoundException;
use Symfony\Component\HttpKernel\Exception\HttpException;
use Illuminate\Foundation\Exceptions\Handler as ExceptionHandler;


class Handler extends ExceptionHandler
{


     /**
     * A list of the exception types that should not be reported.
     *
     * @var array
     */
    protected $dontReport = [
        AuthorizationException::class,
        HttpException::class,
        ModelNotFoundException::class,
        ValidationException::class,
    ];


     /**
     * Report or log an exception.
     *
     * This is a great spot to send exceptions to Sentry, Bugsnag, etc.
     *
     * @param  \Exception  $e
     * @return void
     */
    public function report(Exception $e)
    {
        parent::report($e);
    }


     /**
     * Render an exception into an HTTP response.
     *
     * @param  \Illuminate\Http\Request  $request
     * @param  \Exception  $e
     * @return \Illuminate\Http\Response
     */
    public function render($request, Exception $e)
    {
        if($this->isHttpException($e)){
            if (view()->exists('errors.'.$e->getStatusCode()))
            {
                return response()->view('errors.'.$e->getStatusCode(), [], $e->getStatusCode());
            }
        }
        return parent::render($request, $e);
    }
}

Okay now hope we are ready to the create custom blade layout file for our specific error. So now in this example i am going to create the 404.blade.php file for only for 404 error code. If we want to create the more like then we need to create more like this way for 403.blade.php, 405.blade.php etc.

So at first create the 404.blade.php file on errors folder and then put the bellow code.

resources/views/errors/404.blade.php

@extends('layouts.app')


@section('content')
    <div class="error-page">
        <h2 class="headline text-info"> 404</h2>
        <div class="error-content">
            <h3><i class="fa fa-warning text-yellow"></i> Oops! Page not found.</h3>
            <p>
                We could not find the page you were looking for.
                Meanwhile, you may <a href="">return to dashboard</a> or try using the search form.
            </p>
        </div>
    </div>
@endsection

Read Also: Generate Captcha code and Validation by using BotDetect package in laravel

Thanks for read. I hope it help you. For more you can follow us onĀ facebook.

About code chef

My name is Shahriar sagor. I'm a developer. I live in Bangladesh and I love to write tutorials and tips that will help to other Developer's. I am a big fan of PHP, Javascript, JQuery, Laravel, Codeigniter, VueJS, AngularJS and Bootstrap from the early stage.

View all posts by code chef →