WordPress Directo
  • Tutoriales
  • Plugins
  • Plantillas
  • Optimización
  • SEO
  • WordPress Hosting
No Result
View All Result
WordPress Directo
  • Tutoriales
  • Plugins
  • Plantillas
  • Optimización
  • SEO
  • WordPress Hosting
No Result
View All Result
WordPress Directo
No Result
View All Result

Cómo personalizar la página de error 404 en WordPress

Jorge López by Jorge López
21 septiembre 2015
in Optimización
Reading Time: 5 mins read
1

El error 404 aparece cuando visitamos una página en WordPress que ya no existe. La plantilla que viene por defecto es un poco pobre. Hoy te enseñamos a personalizar la página de error 404 en WordPress.

Muchas veces, navegando por Internet nos encontramos con un enlace que es de nuestro interés y, al acceder a él, nos aparece una página de error con un número: 404. Si accedemos a la documentación de Internet veremos que el error 404 indica que el host ha sido capaz de comunicarse con el servidor, pero no existe el recurso que ha sido pedido. Es decir, por el motivo que sea, esa entrada no existe ya en el WordPress. Estamos accediendo a un contenido muerto, un enlace zombi del que solo queda el recuerdo en forma de enlace en algún buscador o en alguna otra entrada de nuestro blog.

Hay que saber tratar este tipo de errores para no asustar al usuario, es por eso que muchas páginas lo tratan de forma amigable mostrando un contenido simpático y agradable y ofreciéndole al internauta varias opciones para, o bien encuentre el contenido que estaba buscando, o bien sepa salir de allí. A nadie nos gustan las páginas de error 404 en WordPress pero, ya que son inebitables, ¿por qué no ponérselo sencillo al usuario para que sepa encontrar una salida?

Como personalizar la pagina de error 404 en WordPress

Artículos relacionados

10 maneras de recibir más comentarios en tu WordPress

27 noviembre 2015

Cómo crear una web de empleo con WordPress

17 diciembre 2015

¿Cómo usar los atajos de teclado de WordPress?

17 septiembre 2015

WordPress soluciona un grave problema de seguridad antes de anunciarlo públicamente

8 febrero 2017

Si sois administradores de WordPress, os habréis fijado que la plantilla que viene por defecto es un poco pobre. Solo ofrece un pequeño buscador y unas simples indicaciones sobre lo que ha ocurrido. El usuario que visite esta página, lo más probable es que se quede un poco a cuadros al ver semejante mensaje, y ya no digamos si es primerizo en esto de Internet. Hay muchas maneras de personalizar la página de error 404 en WordPress y hoy en WPDirecto, te enseñamos unas cuantas…

Si solo queremos cambiar textos y diseño…

Si solo quieres cambiar textos y diseños debes saber que, por norma general, los themes de WordPress disponen de una plantilla dedicada exclusivamente al error 404. Puedes acceder a ella a través de esta ruta:

/wp-content/themes/ELNOMBREDETUTHEME/404.php

Para acceder a este archivo, tenemos que tener instalado un nuestro equipo un cliente FTP como Filezilla o similares, y entrar con los datos FTP que nos tuvo que solicitar nuestra empresa de hosting web para WordPress. Una vez dentro podemos retocar los textos, imágenes y demás contenido de diseño. Ojo, recomendamos que para ello se tengan unos cuantos conocimientos de diseño y algo de programación. No toques nunca por tocar, estate seguro de lo que estás haciendo.

Como personalizar la pagina de error 404 en WordPress
Fuente: Mehdi Kabab

Si queremos mostrar las publicaciones recientes en la página de error 404 en WordPress

Esto ya es un poco más avanzado. Si quieres mostrar las publicaciones recientes de tu blog a aquellos usuarios que, por error, estén visualizando una página 404 hay que modificar el archivo que te hemos indicado antes, el 404.php. Allí añadiremos este trozo de código:

<h2>Publicaciones más recientes</h2>

<ul>
  <?php
     //Extraemos los posts más nuevos
     $recent_posts = wp_get_recent_posts( array('post_status' => 'publish') );
     //Los recorremos en un bucle
     foreach( $recent_posts as $recent ){
       //Y vamos mostrandolos
       echo '
       <li>
         <a href="' . get_permalink($recent["ID"]) . '" title="'.esc_attr($recent["post_title"]).'" >' .   $recent["post_title"].'</a>
       </li> ';
     }
  ?>
</ul>

Una vez añadido esto, en la página 404 deberían aparecer las últimas entradas publicadas en nuestro sitio web.

Si queremos mostrar publicaciones relacionadas con la url que estaba buscando el usuario

Esto ya es para usuarios avanzados. Es posible que el usuario haya dado con la página 404 en base a una url extinta y que a él le interesaba. Como la url la tenemos en el navegador, es posible mostrar entradas relacionadas según la url que quería el usuario. También hay que modificar el archivo 404.php y añadir estas líneas de código:

<?php
//Argumentos de la query para los cuales cogemos la actual url
$query_args = array( 's' => basename($_SERVER['REQUEST_URI']) );
//Hacemos la consulta
$query = new WP_Query( $query_args );
//Si ha dado resultado...
if($query->have_posts()){
  //Lo mostramos
  echo "<h2>Es posible que estuviese buscando:</h2>";
  echo '<ul>';
  //Recorremos la consulta en bucle
  while ( $query->have_posts() ) : $query->the_post();
    echo '<li>';
    ?>
    <a href="<?php the_permalink() ?>" title="Enlace a <?php the_title_attribute(); ?>"><?php the_title(); ?></a>
    <?php
    echo '</li>';
  endwhile;
  echo '</ul>';
// Limpiamos los datos del post
wp_reset_postdata();
}
?>

Así, si los usuarios se encuentran perdidos, pueden encontrar otros posts relacionados que también pueden ayudarle en lo que estaba buscando. Una gran idea que no es muy complicada de implementar.

Personalizar la página de error 404 en WordPress con plugins

Como siempre, existen plugins para WordPress que nos facilitan la tarea de personalizar la página 404. Te mostramos unos cuantos para que los pruebes tú mismo:

Custom 404 Error Page

Custom 404 Error Page es un plugin para WordPress el cual te da a elegir entre un multitud de diseños para páginas 404. Además, es 100% personalizable. Podemos cambiar la fuente, el tamaño de la letra, la disposición de los elementos, subir imágenes… Muy completo.

Custom Error Pages

Custom 404 Pro es otro plugin para WordPress que te permite editar el texto y algo de diseño de todas las páginas de error de tu sitio web. Desde la 401, a la 403 y, cómo no, la 404 también. Para ello se ayudará del editor wysiwig de WordPress con el que podremos modificar el contenido de dichas páginas.

Esperamos que estos consejos te hayan ayudado a crear una página 404 amigable y sobre todo con estilo para que no asuste a nadie más. En WPDirecto seguiremos ayudándote en todo lo que necesites siempre y cuando esté relacionado con WordPress.

¿Cómo consideras que debería ser la página de error 404 perfecta? ¿Cómo es tu página de error 404? ¿Es simpática?

Tags: errorerror 404personalizarplantillawordpress
ShareTweetSendSharePin
Jorge López

Jorge López

Soy programador web y me gusta mucho el diseño gráfico, la fotografía y todo lo relacionado con las nuevas tecnologías. En mis ratos libres me encanta dibujar y escuchar música. ¡No podría vivir sin ella! Aparte soy un friki de las series...las devoro

Te puede interesar...

Optimización

Cómo activar Gzip en .htaccess y solucionar errores

5 mayo 2025

¿Buscas acelerar tu sitio WordPress? Activar la compresión Gzip mediante el archivo .htaccess es...

Plugins

Cómo optimizar WordPress con plugins de caché: guía avanzada para acelerar tu sitio web

4 mayo 2025

Los plugins de caché son una de las herramientas más eficaces para mejorar la...

Optimización

FlyingPress: el plugin de caché para WordPress que optimiza la velocidad real del usuario

1 mayo 2025

En un ecosistema web cada vez más competitivo, la velocidad de carga se ha...

Optimización

La Revolución de la Optimización de Imágenes: WebP vs AVIF en la Web

30 abril 2025

En la actualidad, la velocidad de carga de un sitio web se ha convertido...

Comments 1

  1. Alberto says:
    8 años ago

    Muy interesante, Jorge, me ha venido muy bien.
    Mi problema llega cuando el formulario de búsqueda me da las respuestas en una página tipo blog (entradas con fotos muy grandes) en vez de en una rejilla de artículos (es tienda Woocommerce), como en el formulario «normal» (con un «&post_type=product» al final de la URL. ¿En vez de ese hay que poner otra cosa?
    Gracias en cualquier caso.

    Responder

Deja una respuesta Cancelar la respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

No Result
View All Result
Plugin Imagify, optimizar imágenes
wordpress hosting NVME
Elegant Themes WordPress
elementor editor plugin




Últimos artículos

Cómo traer la navidad a WordPress mediante un widget

30 noviembre 2015

Descubren nueva vulnerabilidad crítica en el popular complemento LiteSpeed Cache para WordPress

18 diciembre 2024

Cómo bloquear el abuso de XMLRPC y WP-LOGIN en WordPress utilizando Cloudflare

18 marzo 2025

Cómo solucionar el error Internal Server Error en WordPress

6 abril 2019

BBQ Firewall: Protección Ligera y Rápida para WordPress

16 abril 2025
WordPress Directo

WPDirecto.com es una revista especializada en WordPress y WooCommerce que ofrece una amplia gama de recursos, incluyendo tutoriales, análisis de plugins y plantillas, consejos de optimización y estrategias de SEO, para ayudar a los usuarios a mejorar y personalizar sus sitios web, manteniéndolos informados sobre las últimas novedades y tendencias en el mundo de WordPress.

Menu

  • Tutoriales
  • Plugins
  • Plantillas
  • Optimización
  • SEO
  • WordPress Hosting

Información

WPDirecto es un medio de Medios y Redes:
  • Artículos patrocinados
  • Servicio de diseño web
  • Contacto
  • Acerca de MyR
  • Política de privacidad y cookies
  • Aviso Legal

© 1995-2025 Color Vivo Internet, SLU (Medios y Redes Online).. Otros contenidos se cita fuente. Infraestructura cloud servidores dedicados de Stackscale.

No Result
View All Result
  • Tutoriales
  • Plugins
  • Plantillas
  • Optimización
  • SEO
  • WordPress Hosting

© 1995-2025 Color Vivo Internet, SLU (Medios y Redes Online).. Otros contenidos se cita fuente. Infraestructura cloud servidores dedicados de Stackscale.