Unlimited Plugins, WordPress themes, videos & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Code
  2. PHP
Code

Páginas de error del sitio web 404/403 con PHP Auto-Mailer

by
Difficulty:IntermediateLength:MediumLanguages:

Spanish (Español) translation by Luis Chiabrera (you can also view the original English article)

Las páginas de error de sitios web son quizás una de las piezas más olvidadas de un sitio web totalmente redondeado. No solo son importantes, sino que también te dan la oportunidad de divertirte un poco. Aunque muchos desarrolladores web confían en los registros del servidor para estar atentos a las visitas en las páginas de error, voy a adoptar un enfoque diferente mediante el uso de un correo electrónico generado por PHP. Además, le daremos un toque especial al diseño, agregaremos navegación básica y un enlace al sitemap del sitio web.

Acerca de las páginas de error

404 Not Found

La página de error más común, en la que es más probable que esté familiarizado, es la "página 404 No encontrado". Más personas encuentran este tipo de página de error que cualquier otra. Otros mensajes de error comunes que puede haber encontrado son 500 Error interno del servidor, 400 Solicitud incorrecta o 403 Prohibido. ¿Se pregunta para qué es el número? Simplemente se refiere al código HTTP.

404 Not Found

Las páginas de error predeterminadas son bastante aburridas (como puede ver más arriba) y no ofrecen ningún otro propósito a los visitantes, aparte de informarles que ocurrió un error aburrido. Por estos motivos, es una gran idea proporcionar páginas personalizadas para los errores más comunes encontrados. Este tutorial solo cubrirá dos: "404 No encontrado" y "403 Prohibido".

Compruebe si hay soporte de página de error personalizado

Primero, verifique que su proveedor de alojamiento le permita usar sus propias páginas de error. Casi todos lo hacen, y la mayoría de ellos incluso proporcionan un área de configuración dentro de su panel de control para ayudarlo a crear rápidamente las páginas. En este tutorial configuraremos un servidor web Apache (el más común). Esto es más fácil de lo que piensas.

Configurar .htaccess

A continuación, conéctese a su servidor a través de FTP o panel de control y navegue hasta el directorio raíz del documento (generalmente www o public_html) que contiene los archivos de su sitio web. Estaremos buscando el archivo .htaccess. A veces está oculto, así que asegúrese de estar viendo todos los archivos, incluidos los ocultos. Si su servidor no tiene uno, puede crear uno usando cualquier editor de texto. Asegúrese de hacer una copia de seguridad del archivo .htaccess si su servidor ya tiene uno.

Agregue las siguientes líneas a su archivo .htaccess:

La primera mitad (ErrorDocument 404) le dice al servidor que vamos a definir la ubicación del documento de error 404. La segunda mitad define la ubicación real del documento de error. En este caso, lo pondremos en el directorio "error" y los llamaremos 404.php y 403.php, respectivamente.

Ahora guarde el archivo .htaccess y cárguelo en el directorio raíz del documento.

Diseñar las páginas de error personalizadas

Es mejor seguir con el mismo diseño que usa su sitio web para no confundir a sus visitantes y arriesgarse a perderlos. También debe incluir elementos útiles, como un mensaje de error cortés, enlaces sugeridos, una función de búsqueda o un enlace a su mapa del sitio. Estas características dependerán del nivel de contenido que proporcione su sitio web y de lo que crea que será más útil.

Envato Marketplace 404 Page

Como puede ver a continuación, la página 404 No encontrado para Nettuts + ha indicado el error y enfatizó la función de búsqueda al incluirla en el cuerpo debajo del mensaje de error. Puede llevar esto un paso más allá incluyendo una breve lista de enlaces a posibles páginas que podrían alentar al visitante a continuar explorando más el sitio (aunque sea simple y breve), o incluso una imagen cómica (a todos les gusta reírse, ¿no? ). Para sitios web pequeños, puede ser una buena idea incluir un sitemap visible también.

Page Not Found

Aquí hay algo que reuní para este tutorial que también puede usar para su sitio web (incluido en la descarga anterior). Es muy simple, por lo que podrá colocar el contenido directamente en la plantilla de su sitio web existente. Como puede ver, intenté incluir un poco de un elemento de humor al tiempo que también indico el error con cortesía e incluyo algunas opciones para ayudar al visitante a encontrar lo que estaba buscando o continuar navegando por el sitio web.

404 Not Found

Notará que no especifica el código de error HTTP en el cuerpo de la página. En su lugar, elegí usar solo el código de error en el título de la página. La razón de esto es mantener las cosas tan simples y fáciles de usar como sea posible. A la mayoría de las personas no les importa lo que significa 404 o 403, quieren saber qué está pasando en un lenguaje sencillo. Para las personas que desean el código de error, todavía está disponible a través del título.

Si quieres ver algunos diseños 404 realmente geniales visita:

Auto-Mailer PHP y por qué usaremos la notificación por correo electrónico

Esta es la parte del tutorial en la que algunos gurús de la web pueden discutir. Puede usar los registros de su servidor web para buscar páginas de error y mucho, mucho más. ¿Por qué elijo las notificaciones por correo electrónico?

  1. No quiero iniciar sesión en mi servidor todos los días y revisar toda esa información adicional.
  2. Estoy disponible por correo electrónico casi literalmente todo el día, la forma más rápida de contactarme es mediante correo electrónico (o twitter). Con esto en mente, quiero saber acerca de los errores 404 y 403 bastante rápido para que el correo electrónico sea lo mejor.
  3. Un número cada vez mayor de personas está iniciando sitios web, mientras que la mayoría de esas personas no saben casi nada acerca del alojamiento web, y mucho menos de los registros del servidor. Estas personas solo estarán ejecutando sitios pequeños; así que el correo electrónico es ideal.
  4. Recibir una notificación de inmediato me permite actuar rápidamente si se "recolecta" un sitio web mío (plantillas de ThemeForest), si alguien está intentando acceder a algo restringido repetidamente o si tengo un enlace roto en alguna parte.

Así que con todo lo dicho, vamos a seguir con el código vamos a!

El código

Primero, crearemos un archivo llamado error-mailer.php que se utilizará para recopilar información sobre nuestro visitante y enviar el correo electrónico. Una vez que haya creado el archivo, comenzaremos especificando nuestra configuración de correo electrónico y correo electrónico.

Luego recopilaremos información sobre nuestro visitante, como la dirección IP, el URI solicitado, el agente de usuario, etc. El siguiente código recopilará esa información.

Ahora escribiremos el script para enviarnos la información por correo electrónico con los detalles especificados anteriormente.

Estamos utilizando la clase phpMailer para hacer esto como lo demostró Jeffrey a través del blog ThemeForest para crear un formulario de contacto AJAX agradable. Esta versión de la clase phpMailer es para PHP 5/6, por lo que si su servidor está ejecutando PHP 4, deberá usar la versión correspondiente descargándola aquí.

Páginas de error 404.php y 403.php

Lo último que debemos hacer es personalizar las páginas de error que diseñamos anteriormente al enviar los encabezados adecuados y establecer la variable $ error_code insertando el siguiente código al principio de cada página respectivamente (separados por -------).

Lo que estamos haciendo aquí primero es configurar el encabezado HTTP correcto para devolver 404 No encontrado y 403 Prohibido, respectivamente. Cuando los motores de búsqueda aterrizan accidentalmente en esta página, queremos asegurarnos de que saben qué tipo de página es, en lugar de pensar que es una página web normal llamada 404.php o 403.php.

Luego especificamos el código de error que se usará en el script de correo e incluimos el script de correo para que pueda hacer su trabajo. De esta manera, si realizamos un cambio en el script de correo, solo necesitamos editar un archivo en lugar de dos o más (si configura páginas de error personalizadas adicionales).

Conclusión

¡Ahí tienes! Sus propias páginas de error personalizadas que son compatibles con los motores de búsqueda, y le informarán por correo electrónico cuando haya tenido un visitante, así como toda la información que necesitará para solucionar cualquier problema. Algunas últimas cosas a considerar:

  1. Internet Explorer requiere páginas de error que tengan al menos 512 byes de tamaño (si utiliza los archivos de ejemplo, estará bien)
  2. Los sitios web de alto tráfico tienen el potencial de generar MUCHOS correos electrónicos, así que asegúrese de configurar algún tipo de filtro de correo electrónico para estas notificaciones de error para que no inunden su bandeja de entrada. Utilizo Gmail, así que solo tengo una configuración de etiqueta y filtro para estos correos electrónicos.
Advertisement
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.