Producto destacado de Divi: DiviCity
Publicado: 2023-05-08DiviCity es un diseño Divi de una página disponible en Divi Marketplace. Tiene un diseño versátil que se puede usar para muchos tipos diferentes de sitios web y es completamente receptivo y personalizable. En este producto destacado, echaremos un vistazo al diseño de DiviCity y te ayudaremos a decidir si es el diseño adecuado para ti.
¡Empecemos!
- 1 Instalación de DiviCity
- 2 ciudad dividida
- 2.1 Sección de encabezado de DiviCity
- 2.2 Sección Acerca de DiviCity
- 2.3 Sección del blog de DiviCity
- 2.4 Sección de Números de DiviCity
- 2.5 Sección Qué hacer de DiviCity
- 2.6 DiviCity Sección Dónde hacerlo
- 2.7 Sección Visítanos de DiviCity
- 2.8 Sección de contacto de DiviCity
- 2.9 Diseño móvil de DiviCity
- 3 Compra DiviCity
- 4 pensamientos finales
Instalando DiviCity
DiviCity viene como un archivo ZIP que contiene archivos Divi Visual Builder .json. Para instalar el diseño, comience por descomprimir el archivo. A continuación, abra su página en Divi Builder.
Haga clic en la opción de portabilidad en la parte inferior de la página y seleccione la pestaña de importación. Luego seleccione el archivo .json para el diseño de DiviCity y comience a importar el diseño. Una vez que se haya importado el diseño, todo lo que necesita hacer es reemplazar el contenido con el suyo propio, ¡y su sitio web estará completo!
DiviCity
DiviCity consiste en un diseño Divi Builder de una página. Viene sin ninguna de las imágenes de demostración, por lo que agregué las mías para este artículo. ¡Echemos un vistazo a las secciones que vienen con este diseño!
Sección de encabezado de DiviCity
El encabezado consta de una imagen grande con un divisor en ángulo en la parte inferior. El encabezado tiene características de subtítulo y texto de encabezado, así como un botón. El texto presenta un efecto de animación de carga. Dos cuadros superponen la parte inferior de la sección del encabezado. Cada cuadro contiene texto de encabezado, una línea divisoria, cuerpo de texto y un botón. Estos cuadros también tienen una animación de carga y se expanden al pasar el mouse. Finalmente, hay cuatro módulos publicitarios a continuación con un ícono, texto de encabezado y texto del cuerpo. Los módulos publicitarios se revelan uno a la vez a medida que se carga la página. Este diseño de encabezado se puede personalizar fácilmente con sus propias fotos y contenido para crear una sección de encabezado atractiva y atractiva que brinde a sus visitantes información clave sobre su negocio de un vistazo.
Sección Acerca de DiviCity
La sección Acerca de tiene un texto de introducción, un encabezado a la izquierda y una imagen a la derecha. Ambos elementos tienen una animación de aparición gradual y se mueven hacia el centro. A continuación se muestran tres secciones de ancho completo que presentan una imagen y un bloque de texto con un encabezado y parte del texto del cuerpo. Cada una de estas secciones también tiene un efecto de animación de carga.
Sección del blog de DiviCity
De forma predeterminada, la sección del blog presenta un módulo simple de publicaciones recientes que enumera tres publicaciones recientes con la imagen destacada y la información de la publicación. También hay algo de texto de encabezado y texto de cuerpo en esta sección. Esta sección presenta una animación de aparición gradual.
Alternativamente, puede lograr el diseño que se muestra en la demostración de diseño instalando el complemento gratuito Divi Article Cards. Una vez que el complemento esté instalado y activado en su sitio, abra la configuración de Divi 100 desde el menú del panel de WordPress. Active la ficha del artículo y luego haga clic en guardar.
Ahora los módulos del blog en la página de DiviCity deberían verse como el diseño de arriba.
Sección de números de DiviCity
La sección de números presenta cuatro contadores de barras sobre un fondo de imagen: los contadores de números se cargan a medida que se carga la página.
Sección Qué hacer de DiviCity
Esta sección presenta un encabezado y parte del texto del cuerpo. Hay dos subsecciones debajo de esto, cada una con una imagen, un encabezado y un cuerpo de texto. Esta sección es un diseño muy versátil que se puede usar para demostrar características, servicios u otros aspectos de su negocio.
DiviCity Sección Dónde hacerlo
Esta sección también es versátil y presenta un encabezado, cuerpo de texto y tres anuncios publicitarios con una imagen, algo de texto, un breve texto de descripción y un borde que aparece al pasar el mouse por encima. La imagen también se acerca al pasar el mouse por encima. Puede usar estos anuncios publicitarios para vincular a otra página o sección de su sitio web, o simplemente para mostrar algunas características o información.
DiviCity Visítanos Sección
A continuación, la sección Visítenos presenta seis módulos publicitarios, cada uno con un icono, un encabezado y un cuerpo de texto. Puede personalizar esta sección para resaltar más funciones o aspectos de sus servicios o para dividir el texto denso con encabezados e íconos separados. Todos los módulos publicitarios cuentan con una animación de acercamiento.
Sección de contacto de DiviCity
Finalmente, la sección de contacto comienza con una franja naranja que tiene tres íconos de redes sociales. A continuación se muestra la sección del formulario de contacto con un encabezado de texto grande a la izquierda y el formulario a la derecha. La sección de contacto tiene un fondo de imagen grande con una superposición oscura. Esta sección también presenta un efecto de animación de volteo y los íconos de las redes sociales se desvanecen.
Diseño móvil de DiviCity
DiviCity es completamente compatible con tabletas y dispositivos móviles. Echemos un vistazo a la versión móvil de algunas secciones.
Primero está la sección del encabezado, con un fondo de imagen grande, texto de encabezado y botón. El primer cuadro de texto se superpone al encabezado y el resto del contenido de la sección del encabezado sigue a continuación.
Esto es parte de la sección acerca de móvil con imágenes separadas por algunas secciones con texto.
Esta es la versión móvil de la sección “Dónde hacerlo”. Tiene una imagen grande en la parte superior, texto de encabezado, texto de cuerpo, luego tres imágenes con una etiqueta en cada una.
Y finalmente, este es el pie de página móvil. Al igual que la versión de escritorio, presenta una barra naranja con íconos de redes sociales, seguida de la sección de pie de página con una imagen de fondo, texto y el formulario de contacto.
Compra DiviCity
DiviCity está disponible en Divi Marketplace. Cuesta $ 19 por uso ilimitado del sitio web y actualizaciones de por vida. El precio también incluye una garantía de devolución de dinero de 30 días.
Pensamientos finales
DiviCity es un diseño de sitio web simple y atractivo que es increíblemente versátil. Debido a que está construido con Divi, el diseño es fácil e intuitivo de personalizar para su propio uso. Las animaciones de carga y los efectos de desplazamiento en todo el diseño se ven agradables y coherentes y no distraen demasiado el contenido o la usabilidad de la página. También me gusta el uso de imágenes grandes en todo el diseño, así como la tipografía utilizada en el diseño. Si está buscando un diseño de sitio web simple de una página para su próximo proyecto Divi, este podría ser el producto adecuado para usted.
¡Nos encantaría saber de usted! ¿Has probado DiviCity? ¡Háganos saber lo que piensa al respecto en los comentarios!