Preparación del tema de WordPress para Elementor
  • Ajustes principales de WordPress
  • Creación de una plantilla hija (o child theme)
  • Creación de una plantilla hija (o child theme) ACTUALIZACIÓN WORDPRESS 5
  • Creamos un Template para la página principal
  • Modificamos la cabecera, los sidebars y el pie de página del nuevo Template
  • Editamos con CSS el resto del Template
Comenzando con Elementor
  • Instalación del plugin Elementor Free
  • Integramos el título y menú principal de WordPress dentro de Elementor
Maquetando la portada del sitio web
  • Maquetando portada: Herramientas y módulos de elementor - Parte 1
  • Maquetando portada: Herramientas y módulos de elementor - Parte 2
  • Maquetando portada: Herramientas y módulos de elementor - Parte 3
  • Maquetando portada: Herramientas y módulos de elementor - Parte 4
  • Maquetando portada: Herramientas y módulos de elementor - Parte 5
Maquetando el resto de páginas
  • Maquetando la página de Servicios
  • Maquetando la página de Contacto
Integrando la sección de noticias (Entradas) en una sección de Elementor
  • Preparando la página para Noticias (listado de entradas)
  • Programamos el loop de entradas y lo añadimos a un shortcode
  • Editamos y regeneramos el tamaño de los thumbnails (imagen destacada de entrada)
  • Damos formato con estilos CSS al listado de entradas
  • Añadiendo un sistema de paginación para el listado de entradas
Creando una plantilla para cargar entradas en Elementor
  • Creamos el archivo Template para cargar entradas de WordPress en Elementor
  • Añadiendo sistema de comentarios al final de la entrada
  • Guardamos la plantilla en la biblioteca para reutilizarla en otras entradas
Maquetación de una página desde cero
  • Recreamos una plantilla de ejemplo para web de Restaurante
  • Primera sección: Cabecera, fondo y logotipo
  • Segunda sección: Columna de texto y galería de imágenes
  • Tercera sección: Módulo de recomendación
  • Cuarta sección: Grid variado de texto, imágenes, slider y vídeo.
  • Quinta sección: Carrusel de imágenes
  • Sexta sección: Lista de iconos y mapa de GoogleMaps
Ajustes en el menú responsive
  • CSS para el menú responsive de WordPress
Caso práctico 1: Maquetar una landing / page de tipo inmobiliaria
  • Barra superior: Logotipo e iconos sociales
  • Maquetar la sección de cabecera (fondo)
  • Insertar un bloque de contadores
  • Sección de mapa y vídeo
  • Maquetar sección de agentes inmobiliarios
  • Sección final: galería de imágenes
Caso práctico 2: Maquetar una landing / page de tipo aplicación móvil
  • Sección cabecera: Bloques de la cabecera
  • Sección cabecera: Estilos de icono y textos
  • Sección cabecera: Estilo botones
  • Sección cabecera: Divisor de la cabecera
  • Sección contenido: Bloque de iconos y textos
  • Sección contenido: Bloque de recomendación
  • Sección final: Carrusel de logotipos
Clase final: Crear un menú principal y responsive en una plantilla Elementor
  • Menú principal responsive: Introducción
  • Menú principal responsive: Diseñar el menú para el modo escritorio (desktop)
  • Menú principal responsive: Diseñar el menú para el modo responsive
  • Menú principal responsive: Cambiar entre modo desktop y responsive
Clase adicional: Crear un módulo de cuenta atrás
  • Crear módulo de cuenta atrás: Introducción
  • Crear módulo de cuenta atrás: Diseño de la sección y explicación de la función
  • Crear módulo de cuenta atrás: Dando estilo CSS a los números de la cuenta atrás
Clase adicional 2: Crear un módulo para inicio de sesión y registro
  • Módulo inicio de sesión / registro: Introducción
  • Módulo inicio de sesión / registro: Pestañas para los formularios
  • Módulo inicio de sesión / registro: El formulario de inicio de sesión
  • Módulo Inicio de sesión / registro: Formulario de registro