Cómo crear una página de error 404 personalizada en CodeIgniter

Una página de error 404 personalizada te permite mostrar al usuario una página bien diseñada cuando se produce un error de página no encontrada. Hace que la aplicación web sea fácil de usar y ayuda al usuario a volver de nuevo a tu sitio web. Sin una página de error 404, aparecería un mensaje de error en la pantalla del usuario indicándole que el enlace está roto o que la URL no existe. Este error, claro está, puede disuadir a los posibles visitantes, ya que pueden pensar que la web está caída o no es funcional. Para solventar esto, lo mejor es utilizar una página de error 404 personalizada, ya que te brinda la oportunidad de mostrarle al usuario un texto explicando qué ha ocurrido y proporcionarle varios enlaces para que pueda volver al inicio del sitio web para que no se pierda.

Hay muchas razones para tener una página de error 404 en CodeIgniter. Principalmente los enlaces rotos, los cuales suelen ser los principales responsables de mostrar una página de error 404. CodeIgniter muestra la página de error 404 por defecto cuando se produce un error 404. Pero puedes personalizar fácilmente dicha página de error (Páge-not-found) según tus necesidades.

En este tutorial, te mostraremos una manera sencilla de crear una página de error 404 personalizada con enlaces de navegación en CodeIgniter. No es necesario crear ningún controlador ni modificar ninguna funcionalidad para ello.

Antes de seguir con este tutorial, debes crear el HTML de tu página de error 404. Básicamente, la página de error 404 es una simple página HTML con enlaces de navegación para volver a la página principal.

Ve a tu directorio de aplicaciones web y abre el archivo application/views/errors/html/error_404.php en tu editor de código favorito. Quita el HTML que haya dentro e inserta tu HTML que has creado para la página de error 404.

Para utilizar base_url() o cualquier otra función de CodeIgniter, debes inicializar la clase CI_Controller. En la siguiente página de error de CodeIgniter 404, hemos colocado el HTML de página de error 404 personalizado con un enlace de navegación para volver a inicio. También, utilizamos la función base_url() para insertar el enlace hacia la página principal y cargar la imagen de la carpeta de assets.

<?php defined('BASEPATH') OR exit('No direct script access allowed'); ?>
<?php
$ci = new CI_Controller();
$ci =& get_instance();
$ci->load->helper('url');
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>404 Page Not Found</title>
<link href='http://fonts.googleapis.com/css?family=Amarante' rel='stylesheet' type='text/css'>
<style type="text/css">
body{
    background:url(<?php echo base_url(); ?>assets/images/bg.png);
    margin:0;
}
.wrap{
    margin:0 auto;
    width:1000px;
}
.logo{
    text-align:center;
}   
.logo p span{
    color:lightgreen;
}   
.sub a{
    color:white;
    background:rgba(0,0,0,0.3);
    text-decoration:none;
    padding:5px 10px;
    font-size:13px;
    font-family: arial, serif;
    font-weight:bold;
}   
.footer{
    color:#555;
    position:absolute;
    right:10px;
    bottom:10px;
    font-weight:bold;
    font-family:arial, serif;
}   
.footer a{
    font-size:16px;
    color:#ff4800;
}   
</style>
</head>
<body>
    <img src="<?php echo base_url(); ?>assets/images/label.png"/> 
    <div class="wrap">
       <div class="logo">
           <img src="<?php echo base_url(); ?>assets/images/woody-404.png"/>
               <div class="sub">
                 <p><a href="<?php echo base_url(); ?>">Go Back to Home</a></p>
               </div>
        </div>
     </div>
</body>
</html>

Una vez personalizado el archivo application/views/errors/html/error_404.php, escribe en la barra de direcciones de tu navegador una url que no exista en tu sitio web. Verás como ahora, si todo ha ido bien, aparecerá el HTML que has introducido en el archivo.

Fuente: codexworld.com

COMPARTE ESTE ARTÍCULO

ENVIAR A UN AMIGO
COMPARTIR EN FACEBOOK
COMPARTIR EN TWITTER
COMPARTIR EN GOOGLE +
¡SÉ EL PRIMERO EN COMENTAR!
Conéctate o Regístrate para dejar tu comentario.