Crear web profesional con WordPress y Divi

A continuación veremos como crear desde cero un sitio web usando para un despacho de arquitectos usando WordPress y Divi, el sitio tendrá las secciones típicas de una web corporativa: una página de inicio con la información principal, la página de nosotros donde se habla de la información corporativa del despacho, una página de equipo donde mostraremos a los principales miembros del equipo de trabajo, una página de servicios donde se enlistan todos los servicios que ofrece la empresa, una página de proyectos donde se muestran todos los proyectos hechos por el despacho, una página de blog donde aparecerán las entradas que tendrán como fin obtener nuevos prospectos, la página de contacto con todo la información para que nuestros proyectos puedan contactar a la empresa y finalmente una página de cotización que tiene como fin que el visitante a la web pueda conocer el costo aproximado dé su proyecto.

Todo lo haremos con Divi y en el caso del cotizador usaremos Gravity Forms.

¿Qué es Divi?

Divi es una de las plantillas más utilizadas para WordPress. Este tema multipropósito incluye su propio maquetador visual, muy fácil de utilizar, permitiéndote tener una página lista con un diseño de aspecto profesional en pocos minutos.

¿Ventajas de Divi?

  • Opciones generales, como paleta de color, logo, contenidos destacados, y muchas más.
  • Navegación, que te permite añadir o quitar enlaces, configurar los menús desplegables, cambiar el orden de los enlaces de navegación…
  • Layout, para ajustar la estructura de tu web, quitar o cambiar ciertos elementos del diseño.
  • Gestión de anuncios, que te permitirá gestionar en qué lugares de la web quieres mostrar banners, anuncios, etcétera.
  • El panel de colores te permite ajustar los colores de varias partes de la plantilla, como las fuentes o los fondos.
  • Con las opciones de integración podrás añadir código en varias partes de la plantilla, útil para añadir por ejemplo el código de Analytics o las integraciones con las redes sociales.

¿Cuánto cuesta Divi?

Divi cuenta con varios planes su principal ventaja es que al comprar una licencia no solo se tiene acceso a Divi con actualizaciones automáticas y soporte, también se tiene acceso a todos los productos de Elegant Themes

¿Qué es Gravity Forms?

Gravity Forms es el mejor plugin de formularios para WordPress que permite diseñar y realizar formularios, tanto simples como avanzados, de forma muy sencilla e intuitiva.

¿Ventajas de Gravity Forms?

  • Fácil de usar, formularios potentes. Diseña y construye tus formularios de forma rápida y fácil gracias a su intuitivo editor visual de formularios. Selecciona los campos que quieres, configura las opciones e inserta los formularios fácilmente en tus contenidos de WordPress usando los botones.
  • Más de 30 campos para formularios listos para usar. Gravity Forms dispone de una amplia variedad de campos predefinidos, de forma que sólo tengas que arrastrar y soltar en tu editor de formularios los campos que quieras utilizar.
  • Lógica condicional. La lógica condicional te permite mostrar u ocultar campos, secciones, páginas enteras del formulario o incluso el botón de enviar en función de las selecciones del usuario. Esto te permite seleccionar qué información le pides al usuario según sus respuestas y crear formularios a la medida de sus (y tus) necesidades.
  • Notificaciones por correo electrónico. Gravity Forms te permite configurar notificaciones por email, de forma que puedas estar al tanto cada vez que un usuario completa uno de los formularios.
  • Subida de archivos. ¿Necesitas que tus usuarios suban archivos? ¿Fotos? Es muy fácil, sólo tienes que añadir un campo de subida de archivos a tu formulario y guardar los archivos en tu servidor o adjuntarlos a la notificación por email.
  • Guardar y continuar. Si necesitas formularios muy elaborados y largos, con Gravity Forms puedes permitir a tus usuarios guardar los formularios completados parcialmente para continuarlo más tarde.
  • Cálculos. Gravity Forms te permite realizar cálculos avanzados en función de las respuestas de los usuarios en el formulario y aplicar fórmulas cuyo resultado se aplicará a otros campos.
  • Limita y programa formularios. Puedes limitar el número de entradas que recibirá un formulario o programar cuándo estará disponible, de forma que tú controlas cuándo recibes datos y con qué límites.
  • Creación de entradas a través de formularios. ¿Necesitas que tus usuarios creen contenido en tu web? Los campos de contenido de Gravity Forms te permiten crear entradas (posts) de WordPress fácilmente desde el frontend mediante un formulario, y hacer que se publiquen o queden como borrador o en otro estado.
  • Anti spam. Con las integraciones para reCAPTCHA, Really Simple Captcha y Akismet, Gravity Forms previene y evita el spam en tus formularios.
  • Diseño responsive. Gravity Forms incluye diseño amigable para dispositivos móviles. Los formularios están diseñados para mostrarse (y funcionar) correctamente en una amplia variedad de dispositivos.

Crear web profesional con WordPress y Divi de un despacho de arquitectos

A continuación tienes todas las lecciones del curso

1.Introducción

En esta primera clase de nuestro curso explicaremos todas las funcionalidades del sitio web de una firma de arquitectos que crearemos a lo largo del curso.

2.Contratar hosting y dominio

En este video veremos como contratar hosting y dominio para nuestro sitio

3.Instalar WordPress

En esta clase veremos como instalar WordPress en nuestro hosting y como llevar a cabo su configuración básica.

4.Interfaz de usuario

En clase explicaremos la interfaz de usuario de WordPress

5.Configuración inicial

En esta clase veremos como configurar WordPress

6.Instalar tema Divi

En este video veremos como instalar el tema Divi, mismo que usaremos para construir y dar la apariencia a nuestro sitio web

7.Instalar Plugins

En esta clase veremos como instalar los plugins que usaremos para la construcción de nuestro sitio web.

8.Usuarios

En este video veremos como crear nuevos usuarios en WordPress.

9.Agregar paginas

En este video veremos como crear las paginas del sitio

10.Configurando Divi

En clase veremos como configurar el tema Divi

11.Navegación

En este video veremos como crear la navegación de nuestra web

12.Crear el header

En este video veremos como crear el header o cabecera de nuestro sitio web, mismo que que aparecerá en la parte superior de todas las paginas del sitio.

13.Crear el footer

En este video veremos como crear el footer de nuestro sitio web, mismo que aparecerá en la parte inferior de toda nuestra web.

14.Entradas

En este video veremos como crear entradas de ejemplo y la plantilla para entrada individual usando Divi.

15.Agregar Proyectos

En este video veremos como agregar proyectos a nuestra web y como crear la plantilla de proyecto individual usando Divi

16.Crear página de inicio

En esta video veremos como crear la pagina de inicio completa

17.Crear pagina de nosotros

En esta clase veremos como crear la pagina de nosotros

18.Crear pagina de Portafolio

En esta primera clase veremos como crear la página de portafolio de nuestro sitio web.

19.Crear pagina de servicios

En este video veremos como crear la pagina de servicios de nuestra web

20.Crear pagina de blog o entradas

En este video veremos como crear la pagina de blog, incluyendo la sidebar.

21.Crear pagina de Equipo

En esta video veremos como crear la pagina de equipo de nuestro sitio web.

22.Crear pagina de contacto

En este video veremos como crear la pagina de contacto de nuestro sitio web

23.Crear pagina de Cotización

En este video veremos como crear la pagina de cotización del sitio donde crearemos un cotizador de los servicios de la firma de arquitectos con Gravity Forms.

24.Divi pixel

En este video veremos como agregar Divi Pixel a nuestro sitio para agregar algunas funcionalidades extras como: un cargador, personalizar la pagina de login, etc.

25.Plantilla de error 404

En este video veremos como crear la plantilla de la pagina de error 404 para cuando se acceda a un recurso no disponible.

26.Agregar chat con Whatsapp

En este video veremos como agregar un chat a nuestro sitio para nuestros usuarios nos contacten vía WhatsApp.

27.Agregar RGPD

En este video veremos como agregar algunos plugins para cumplir con el reglamento RGPD

28.Curso completo

En este video veremos como crear desde cero un sitio web para una firma de arquitectos que incluye un cotizador usando Divi, Divi Pixel y Divi Carousel.

¡Hasta la próxima!

David 🙂