Cómo crear 404 páginas con el constructor de temas de Div ‘

El constructor de temas de Divin y las opciones de diseño construidas han abierto muchas puertas nuevas. Más que nunca, ahora puede personalizar cada página en la que lleguen sus clientes incluyen la configuración de una página 404. En este tutorial, le mostraremos cómo crear una hermosa 404 páginas y aplicarla inmediatamente a su sitio. Web. Solo usaremos las opciones de división Built -IN y podrá descargar el archivo de plantilla JSON de forma gratuita. Esperamos que este tutorial te inspire a ser creativo con el próximo diseño de 404 páginas. ¡Vamos a eso! Vista previa antes de arrojar nuestras cabezas en el tutorial, para echar un vistazo rápido al resultado en diferentes tamaños de pantalla.
Escritorio

Móvil

Descargue la plantilla de página 404 de forma gratuita para poner su mano en la plantilla de página 404 gratuita, primero debe descargarla con el botón a continuación. Para tener acceso a la descarga, deberá suscribirse a nuestra lista diaria de correo electrónico utilizando el formulario a continuación. ¡Como nuevo suscriptor, recibirá más buenas divisiones y un paquete Divaut gratuito todos los lunes! Si ya está en la lista, simplemente ingrese la dirección de correo electrónico a continuación y haga clic en Descargar. No será “reubicado” y no recibirá correos electrónicos adicionales.
Descargar archivos

Descargue el registro gratuito para el Boletín Informativo Divic y le enviaremos una copia de la página de la página de la página final, además de muchos otros recursos, consejos y consejos para Div gratis. Sigue a ti mismo y serás una división maestra en el menor tiempo. Si ya está suscrito, simplemente ingrese el correo electrónico a continuación y haga clic en Descargar para acceder al paquete de apariencia. Se ha suscrito correctamente. ¡Consulte su correo electrónico para confirmar su suscripción y obtener acceso a paquetes de diseño semanales gratuitos!
Suscríbase a nuestro canal de YouTube 1. Vaya al Temo Builder Divin y cree una nueva plantilla Access Div Theme Builder para comenzar a crear una plantilla de 404 páginas, vaya al Builder Divic en el Div.
Cree una nueva plantilla Haga clic en “Agregar una nueva plantilla” y configure una nueva plantilla para su página 404.

Usar en: 404 Pag
Oculte el área antet y sótano continúe ocultando el encabezado y el sótano personalizado de su página 404 haciendo clic en el icono de los ojos.


Construya un cuerpo global después de haber realizado todos los pasos anteriores, puede comenzar a construir las 404 páginas seleccionando “Crear cuerpo personalizado”.

2. Comience a crear el cuerpo 404 páginas Agregue un nuevo color de fondo una vez que esté en el editor de plantillas, verá una sección en su página. Abra esta sección y agregue un fondo blanco.

Color de fondo: #ffffff
Interruptor de separador inferior a la pestaña de diseño de sección y agregue un separador inferior:

Estilo divisor: encontrar en la lista
Color divisor: # FFEE00
Altura del divisor: 25VW (escritorio), 77VW (tableta), 90VW (teléfono)
Divisor Flip: Divisor de Anranyección Vertical: Contenido bajo la sección
Espaciado Agregue algunos valores de llenado personalizados en diferentes tamaños de pantalla.
Revelaje superior: 4.6VW (escritorio), 23VW (tableta), 25VW (teléfono)

Bajo revestimiento: 4.6VW (escritorio), 13VW (tableta), 11VW (teléfono)
Agregue la estructura de la columna de la fila # 1 Después de haber completado la configuración de la sección, puede agregar primero. Elija la siguiente estructura de columnas:
Dimensión sin agregar módulos, abra la configuración de la fila y permita que la fila ocupe todo el ancho de la pantalla.

Use el ancho personalizado de la canaleta: sí

El ancho de la canaleta: 1
Ancho: 100%
Ancho máximo: 100%
Extienda el cambio de los valores de llenado hacia arriba e inferior de la fila a continuación.
Revestimiento superior: 2VW

Revestimiento inferior: 2VW
¡Agregue el módulo de texto 1 al contenido de la columna, el contenido es hora de comenzar a agregar módulos! El primer módulo que necesitamos es un módulo de texto. Ingrese un contenido de párrafo de su elección.
Configuración de texto Vaya a la pestaña Diseño del módulo y cambie la configuración de texto de la siguiente manera:

Texto de fuente: monótono

Color de texto: # 000000
Tamaño de texto: 24VW (escritorio), 35VW (tableta y teléfono)
La altura de la línea de texto: 1em
Alineación de texto: Centro
Agregue el módulo de texto no. 2 En la columna, agregue el contenido, moverse al siguiente módulo, que es otro módulo de texto. Agregue un contenido a su elección.
Configuración de texto Cambie la configuración de texto del módulo en consecuencia:


Texto de fuente: Montserrat

Color de texto: # 000000
Tamaño de texto: 1.2VW (escritorio), 2.6VW (tableta), 3VW (teléfono)
La altura de la línea de texto: 1.8em
Alineación de texto: Centro
Espacio Complete la configuración del módulo agregando algunos bordes personalizados en la parte superior e inferior. Uppermark: 2VW
Margen inferior: 6VW

Agregue la estructura de la columna de la fila # 2 Continuar agregando una nueva fila utilizando la siguiente estructura de columnas:
Dimensión Abra la configuración de la fila y ajuste la configuración del tamaño de la siguiente manera:
Ancho: 32VW (escritorio), 50VW (tableta y teléfono)

Ancho máximo: 100%

La espartación modifica y se establece la espacios.
Margen superior: 7VW (escritorio), 22VW (tableta), 59VW (teléfono)
SUS Lingo: 0VW

Revestimiento inferior: 0 VW
Columnas 1 y 2 Color de fondo predeterminado Después de haber completado la configuración promedio general, puede abrir cada columna individualmente y puede hacer algunos cambios, comenzando con el color de fondo.
Color de fondo: #ffffff
Coloque el cursor en el color de fondo Cambiar el color de fondo al cursor.

Color de fondo: # fffa00
Border agregue algunas esquinas redondeadas.

Esquinas redondeadas: 20 px (todas las esquinas)
Swink Sombriz de cuadro predeterminado a la configuración de la sombra del cuadro y aplique los siguientes cambios:

Poder de poco claro de la sombra de la caja: 50 px
Color de la sombra: RGBA (0.0,0,0)

Hover Box Shadow Cambia el color de la sombra al cursor.
Shadow Color: RGBA (0.0,0,0.12)
La escala de transformación predeterminada luego accede a la configuración de la escala de transformación y asegúrese de que los valores predeterminados sigan siendo “100%”.

Derecha: 100%
El fondo: 100%

Cursor de transformación de la escala de transformación Los valores de la escala de transformación al cursor:
Derecha: 110%
ABAJO: 110%

Agregue un módulo de texto a la columna 1 Agregar contenido Después de haber completado la configuración de fila y columna, agregue un módulo de texto a la columna 1 con un contenido de párrafo. Agregue un enlace Agregar un enlace al siguiente módulo.
Dirección de URL del módulo: #
Módulo de enlace de destino: en la misma ventana

Configuración de texto Vaya a la pestaña Diseño del módulo y cambie la configuración de texto de la siguiente manera:

Texto de fuente: Montserrat
El peso de la fuente de texto: en negrita
Text -Text estilo: mayúscula

Color de texto: # 000000
Tamaño de texto: 0.8VW (escritorio), 2VW (tableta), 3VW (teléfono)
Texto de la carta de espacio: 1 PX
La altura de la línea de texto: 1.8em
Alineación de texto: Centro
Espacio entonces, acceda a la configuración de espaciado y aplique algunos valores de llenado personalizados hacia arriba y hacia abajo en diferentes tamaños de pantalla.
Revelaje superior: 2VW (escritorio), 3VW (tableta), 4VW (teléfono)
Bajo forro: 2VW (escritorio), 3VW (tableta), 4VW (teléfono)
Clone el módulo de texto y coloque el duplicado en la columna 2 Después de haber completado el módulo de texto y toda su configuración, puede clonar todo el módulo y colocar el duplicado en la columna 2.

Cambie el contenido para asegurarse de cambiar el contenido del módulo duplicado.
Cambiar el cambio de conexión y el enlace.
3. Guarde los cambios del fabricante en el tema Después de completar el diseño, puede guardar todas las configuraciones de plantilla. ¡Eso es todo!

Vista previa ahora que hemos dado todos los pasos, para echar un vistazo final al resultado en diferentes tamaños de pantalla. Escritorio

Móvil