Cómo crear una página de Error 404 en WordPress

cabecera-como-crear-una-pagina-de-error-404-en-wordpress

En esta ocasión he necesitado crear una página de error 404 en WordPress para uno de los blogs que gestiono. Una de las cosas a tener en cuenta en nuestro blog son los visitantes que perdemos debido a errores a la hora de acceder a la página. Muchas de las visitas acaban accediendo a páginas que no existen y finalmente terminan abandonándolo por no encontrar lo que necesitaban.



Hay varios motivos por los que alguien puede acabar en una página errónea de nuestro sitio web.

– Porque han escrito mal alguna dirección de nuestro sitio.

– Porque hemos decidido eliminar una página o cambiar la estructura de páginas del blog.

Por ejemplo:

Tengo una página dentro de mi blog con un enlace hacia ella, que se llama:

 https://www.asesortecnologico.es/tutoriales-de-arduino/

Se me ocurre eliminarla o simplemente renombrarla por la siguiente:

http://www.asesortecnologico.es/tutoriales/arduino/

Entonces el enlace a la página anterior dejaría de ser válido.

Para evitar que los visitantes abandonen nuestro sitio cuando accedan a él, podemos crear una página de error 404  en nuestro WordPress, en el caso de que nuestro tema no la traiga, o personalizar la que trae por defecto. Y desde ahí volver a redirigir al visitante a donde mejor nos convenga.

¿Qué necesito para crear mi página de error 404 en WordPress?

Lo primero es una idea. Buscando por las redes he encontrado ejemplos muy currados de páginas de error 404, os dejo una muestra para que cojáis inspiración.

24-4 Media

crear una página de error 404 en wordpress

Broken Like

crear una página de error 404 en wordpress1

Houston We Have a Problem

crear una página de error 404 en wordpress2

Oops! 404 File Not Found

crear una página de error 404 en wordpress3

B3ta

crear una página de error 404 en wordpress4

Catswhocode

Ellos siempre encuentran la solución. 

crear una página de error 404 en wordpress5

klaus 

(Ésta me ha encantado. Mi primer ordenador fue un COMMODORE 64 🙂 )

crear una página de error 404 en wordpress6

Deaxon

Y por último os dejo ésta… Que es un poco bizarra, lo sé jaja.

crear una página de error 404 en wordpress7

Una vez que nuestra inspiración se haya puesto en marcha y tengamos clara la idea de lo que queremos hacer, puede darse el caso de que nuestro tema ya incluya por defecto una página de error 404 o puede pasarte cómo a mí y que tengas que crearla desde cero.

Quizá se te ocurra la opción de copiar directamente la página 404.php que trae alguno de los temas por defecto (por ejemplo el Twenty Thirteen Theme), pero te advierto qué cada tema está estructurado de forma diferente y seguramente no te funcione.

¿Entonces qué hago?

Pues investigar un poco en los archivos de vuestro tema. Lo más común es que en el index.php encontremos lo que necesitamos, sin embargo yo he decidido tomar como plantilla la página page.php porque prefiero el diseño que tiene.

Abrimos el archivo y modificamos lo necesario. Este es el archivo page.php original.

<?php get_header();
<div id="post-holder; class=rowgt>
<div class=col-md-9>
?php
while (have_posts()) : the_post();
get_template_part('content', 'page');
comments_template();
endwhile;

<div>
?php get_sidebar();
</div>
?php get_foot

He eliminado todas las secciones que contenían código relacionado con los posts o comentarios, incluso el sidebar, hasta dejarlo así:


?php get_header(); ?
<div id="post-holder" class="row">
<div class="col-lg-12">
<img src="/wp-content/uploads/404-error.png"
<div style="text-align: center;">
<h2 style="color: #df1d1d;"> Error 404 <span style="color: #000;">¿Qué has tocado ya?</span></h2>
<p style="font-size: 1.5em; margin-bottom: 1em;">
<stron>A ver, en serio... ¿qué estabas buscando? ¡Que la has liao parda!</strong>
</p>
</div>
</div>
</div>
?php get_footer(); ?

Guardamos el fichero como 404.php y lo subimos a la carpeta principal del tema. Ya podemos comprobar nuestra nueva página de error 404.

Aquí podéis ver la mía:

https://www.asesortecnologico.es/asdf

¡Si te ha gustado o te ha sido útil el post no dudes en compartirlo!

Fuente:

http://codex.wordpress.org/Creating_an_Error_404_Page




Deja un comentario

asesor-tecnologico

Consultoría tecnológica para tus proyectos online.

(+34) 665 04 53 75

info@asesortecnologico.es

Seguro que puedo ayudarte

¡Escríbeme!

Responderé cualquier pregunta o te proporcionaré un presupuesto de mis servicios en menos de 24 horas.