Cómo crear una página de error personalizado de WordPress 404

Hay grandes posibilidades de haber aterrizado en una página de 404 y dejar el sitio de inmediato, porque era menos que útil. Una página 404 es lo que muestra WordPress cuando alguien entra o hace clic en una URL que no existe en su sitio web. Esta página es un error genérico que informa al visitante que la página no se ha encontrado. En este artículo, exploraremos cómo crear una página personalizada 404 para WordPress. Durante el curso, veremos modelos buenos y malos. ¿Por qué crear una página personalizada 404 para WordPress? Es tentador omitir el diseño de la página 404 porque esperas que nadie lo vea. Sin embargo, debe ser útil para sus visitantes puede ser tan importante como cualquier otra página. Un mensaje general es una mala experiencia de usuario. No se ve bien y no les da ninguna razón para permanecer en su sitio web.
En primer lugar, veamos la página genérica que estamos tratando de evitar. Página genérica 404

La página estándar 404 que se muestra por WordPress es solo un mensaje de error. Se coloca en el área de contenido del cuerpo y muestra su encabezado, sótano y barras laterales si las tiene. Desafortunadamente, no es útil. Es como preguntarle a un trabajador en la tienda si algo que está buscando está en el pasillo en el que se encuentra y simplemente dicen que no. Desea dirigirse al pasillo correcto. Quieres más información. Una página de 404 debería brindarle más información. Debería ser útil. Debe proporcionar herramientas, enlaces, consejos o una forma de ayuda. No querrás quedarte solo en el pasillo sin saber a dónde ir más allá.
Ejemplos de páginas personalizadas 404 Hay miles de 404 páginas increíbles en la web. Algunos son divertidos, otros serios. Algunos son más útiles que otros. Algunos son simples, mientras que otros son hermosos. Aquí hay un vistazo a unas pocas 404 páginas para tener una idea de cómo están diseñados. Algunos son simples y aburridos, mientras que otros son útiles y se ven geniales. 1. Google 404 de Google (no WordPress) es simple. Es una pequeña zona de contenido en el centro de la pantalla. El mensaje solo le dice que hay un error y da una imagen de un robot en pedazos. No proporciona otra información, pero es Google, por lo que todo lo que tiene que hacer es escribir algo más en la barra de búsqueda.

2. WordPress.org
Página 404 de WordPress.org Muestra encabezado y sótano estándar. El cuerpo incluye un título para mostrar que la página no se ha encontrado, una breve explicación con una pizca de humor y luego una lista de enlaces para ayudarlo. Los enlaces se centran en ser útiles. 3. WordPress.com

Página 404 de WordPress.com elimina el encabezado y el sótano. Muestra un gráfico, un título, un enlace con enlaces a los que se puede hacer clic, un cuadro de búsqueda y el logotipo de WordPress.com. Los enlaces son útiles. 4. Temas elegantes

Página 404 Un temas elegantes (porque sé que se mostrará de todos modos) presenta el encabezado ET, un gran título con una pequeña explicación y un botón como CTA. Tienes acceso a casi todo desde aquí.

5. Veinte -Twenty -One
El tema de WordPress Twenty Veintiún tiene una página 404 que usa menús primarios y sótanos. Tiene un gran título. El cuerpo tiene una breve descripción y un cuadro de búsqueda. Las líneas se usan para peluquería. El fondo coincide con el sitio. 6. Veinte veinte

El tema de los veinte veinte veinte de WordPress muestra el encabezado y el sótano. El cuerpo presenta un gran título en el centro, una explicación y un cuadro de búsqueda. Todos usan los colores del tema. 7. Slabiasis Papagina 404 Slack (no WordPress) presenta un cuadro en el centro con información sobre error con un enlace al centro de ayuda. Todos los menús están aquí. La parte interesante es el fondo. Es un fondo de dibujos animados que corre hacia la derecha o la izquierda para rastrear el mouse. Los animales animados se mueven en la pantalla.

8. Amazon

Página 404 Amazon (y no WordPress) incluye el logotipo de Amazon con un cuadro de búsqueda, un mensaje grande, un mensaje más pequeño para un enlace a la página inicial y una foto de un animal con un enlace para obtener más información. Incluye muchas fotos diferentes que se pueden mostrar. Son elegidos por casualidad. Contenido de 404 páginas
Entonces, ¿por qué necesita una página de 404? Vemos algunos elementos comunes en los ejemplos anteriores. En primer lugar, tiene que ser útil. No debe solo decirle al visitante que hay un error. Debería decir lo que significa el error. Imagine una luz de error que se ilumina en el automóvil. La primera pregunta sería “¿Qué significa eso?” La información útil no específica sobre el error es frustrante.

Los visitantes deben saber si han estado equivocados o si el contenido no existe. Si no lo sé, continuarán buscando el contenido hasta que abandonen el sitio web con ira, jurando nunca regresar. Esto se hace mejor con un mensaje simple y posiblemente con una imagen que atrae la atención. Algo que sale de su contenido normal que atraería a su audiencia. Entonces tienes que dar una dirección sobre qué hacer a continuación. Esto podría ser una lista de artículos, un cuadro de búsqueda, una lista de categorías, las publicaciones más populares, las últimas publicaciones, una forma de contactarlo, etc. Es muy simple. 404 páginas no necesitan mucho contenido. Suficiente para ser útil. El ejemplo anterior incluye:

Colores de fondo y patrones que se adaptarían al sitio web /
Un título con un breve mensaje sobre el error.
Texto grande que muestra que es una página 404.
Algunos botones que le dan al visitante algunas direcciones.
Es simple, pero elegante y útil. Eso es todo lo que necesitas.
Veamos cómo crear una página personalizada 404 para WordPress usando las ideas de contenido que acabamos de discutir. Cómo crear una página 404 personalizada en WordPress con el creador de temas
Div Div Theme Builder facilita la creación y asignación de una página 404. Los temas elegantes tienen varias 404 páginas premayas que puede descargar gratis. Puede personalizarlos de la manera que desee. Estas son una excelente manera de comenzar con un diseño de 404 páginas. Si lo prefiere, puede construir uno desde cero.
El ejemplo anterior es del paquete de constructor de temas de diseño del cuarto diseño. Hay muchas 404 páginas disponibles en el blog ET. Para encontrarlos, busque el “Paquete de apariencia para el constructor de tareas” o consulte aquí: descargue el primer paquete de constructor gratuito para Div

Descargue el segundo paquete gratuito para el constructor para div Div

Descargue el tercer paquete de tareas gratuito para div Div
Descargue el cuarto paquete gratuito para el constructor para Div
Descargue el quinto paquete de paquete gratuito para la división
Descargue el sexto paquete gratuito para Temi Builder para Div
Importación de una página personalizada 404 en Divic Them Theme Builder
Encontrará el creador de temas Div en el tablero de WordPress accediendo a Div> temas Builder. Esto abre la página donde puede crear o importar plantillas y asignarlas. En la esquina superior derecha, verá el icono de importación. Haga clic en este icono para importar la plantilla de 404 páginas. Nota: para tutoriales sobre el uso del creador de temas Div, busque “Temo Builder” aquí en el blog de temas elegantes.
Se abre un modal en el que puede importar la plantilla. Seleccione importar y navegar por su archivo de su archivo. Las opciones para sobrescribir los valores y deberes predeterminados son de forma predeterminada. Te recomiendo que los dejes seleccionados. Haga clic para importar la plantilla en la parte inferior del modo. Importar página 404 para el paquete de diseño de crowdfunding.
Importando una página 404, se asigna automáticamente. Luego haga clic en el icono de edición para abrir el constructor.
Ahora, realice los cambios dentro de cada módulo agregando enlaces, imágenes, colores, texto, etc.Guarde el aspecto y haga clic en X en la esquina superior derecha para cerrar el constructor. Finalmente, guarde los cambios para aplicar la plantilla.Ahora tiene una página personalizada 404. Creación de una página personalizada 404 con el constructor de temas div Div

En el generador de tareas, seleccione para agregar una nueva plantilla.

Esto abre la configuración de la plantilla.Desplácese en la parte inferior y seleccione 404 página debajo de otros.Luego haga clic en Crear plantilla.La configuración de la plantilla se cerrará.

Ahora, puede crear la página 404. La mayoría no usa encabezado o sótano.Seleccione Agregar cuerpo personalizado.

Esto muestra dos selecciones que le permiten crear un cuerpo personalizado o agregar desde la biblioteca.Seleccione Construir cuerpo personalizado.

Construya la página 404 con Divi Builder normalmente.Salva y sale.