Laravel Custom 404 Error Page Example
Today, In this tutorial we explain to you how to create custom create 404 and 500 error page in laravel. why we need to this error page? when visitor wrong type web URL use in our site and that type of page not available in our site then we can display an error page.
We can easy to makes custom error message using the exception handler. laravel provides exception handler class and it always checks all exceptions thrown. so it’s depending on the exception.
There are two methods available in handle class. such as report and render. when the report method handles the current request and returns the without rendering an error page. the render method gives responds with an error message. it’s converting HTTP response status from the exception and even sends it back to the browser.
Modify The Handler.php File
Let’s create a custom 404 page so we have to modify the render method in app/Exceptions/Handler.php file.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 | <?php namespace App\Exceptions; use Exception; use Illuminate\Foundation\Exceptions\Handler as ExceptionHandler; class Handler extends ExceptionHandler { /** * A list of the exception types that are not reported. * * @var array */ protected $dontReport = [ // ]; /** * A list of the inputs that are never flashed for validation exceptions. * * @var array */ protected $dontFlash = [ 'password', 'password_confirmation', ]; /** * Report or log an exception. * * @param \Exception $exception * @return void */ public function report(Exception $exception) { parent::report($exception); } /** * Render an exception into an HTTP response. * * @param \Illuminate\Http\Request $request * @param \Exception $exception * @return \Illuminate\Http\Response */ public function render($request, Exception $exception) { if($this->isHttpException($exception)){ switch ($exception->getStatusCode()) { case '404': return $this->renderHttpException($exception); break; case '500': return $this->renderHttpException($exception); break; default: return $this->renderHttpException($exception); break; } }else{ return parent::render($request, $exception); } } } ?> |
Create Blade Files
So finally, first we will create the new directory “resources/views/errors” and that directory in create a “resources/views/errors/404.blade.php” file. paste the below code in this file.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 | <html> <head> <style> #notfound{position:relative;height:100vh}#notfound .notfound{position:absolute;left:50%;top:50%;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.notfound .notfound-404{position:relative;height:150px;line-height:150px;margin-bottom:25px}.notfound .notfound-404 h1{font-family:titillium web,sans-serif;font-size:186px;font-weight:900;margin:0;text-transform:uppercase;-webkit-background-clip:text;background-size:cover;background-position:center}.notfound h2{font-family:titillium web,sans-serif;font-size:26px;font-weight:700;margin:0}.notfound p{font-family:montserrat,sans-serif;font-size:14px;font-weight:500;margin-bottom:0;text-transform:uppercase}.notfound a{font-family:titillium web,sans-serif;display:inline-block;text-transform:uppercase;color:#fff;text-decoration:none;border:none;background:#5c91fe;padding:10px 40px;font-size:14px;font-weight:700;border-radius:1px;margin-top:15px;-webkit-transition:.2s all;transition:.2s all} </style> </head> <body> <div id="notfound"> <div class="notfound"> <div class="notfound-404"> <h1>404</h1> </div> <h2>Oops! This Page Could Not Be Found</h2> <p>Sorry but the page you are looking for does not exist, have been removed. name changed or is temporarily unavailable</p> <a href="#">Go To Homepage</a> </div> </div> </body> </html> |
