WordPress
¿Qué es Elementor y por qué usarlo?
Elementor es un constructor visual que te permite diseñar páginas arrastrando elementos. Lo que ves es lo que obtienes.
Ventajas:
- No necesitas código
- Diseño en tiempo real
- Muy flexible
- Compatible con casi cualquier tema
Antes de empezar (configuración básica):
Necesitas:
- WordPress instalado
- Plugin Elementor activo
- Un tema ligero como:
- Hello Elementor
- Astra
- GeneratePress
👉 Cuanto más limpio el tema, mejor funciona Elementor.
Jerarquía en Elementor
Antes de arrastrar elementos, debes entender cómo se estructura una página en Elementor. Imagina que es un juego de cajas una dentro de otra:
Secciones (El contenedor azul): Es el espacio más grande. Define franjas horizontales en tu web (ej. el encabezado, los servicios, el contacto).
Columnas (El recuadro gris): Dividen la sección verticalmente. Puedes tener una sección con dos columnas: una para texto y otra para una imagen.
Widgets (El contenido): Son los elementos finales: botones, títulos, vídeos o imágenes.
Primero creas la sección, luego ajustas las columnas y al final arrastras el widget.
Paso a paso: crear tu primera página
1. Crea una nueva página
En WordPress:
- Ve a Páginas → Añadir nueva
- Ponle un nombre (ej: “Inicio”)
- Haz clic en Editar con Elementor
2. Elige estructura básica
Al entrar en Elementor verás:
- Botón “+” → crear secciones
- Botón carpeta → usar plantillas
Empieza simple:
- Selecciona una estructura de 1 columna
3. Añade secciones
Cada página se construye así:
👉 Sección → Columnas → Widgets
4. Añade widgets (elementos)
Arrastra desde el panel izquierdo:
- Encabezado
- Texto
- Imagen
- Botón
5. Edita el contenido
Haz clic en cualquier elemento y cambia:
- Texto
- Colores
- Tipografía
- Tamaños
6. Ajusta el diseño (clave)
Cada elemento de Elementor tiene tres pestañas en el panel izquierdo:
- Contenido: ¿Qué dice el texto? ¿A dónde lleva el enlace?
- Estilo: ¿De qué color es? ¿Qué tipografía usa? (Aquí es donde aplicas las fuentes personalizadas que aprendimos a instalar).
- Avanzado: Aquí controlas los márgenes (espacio fuera del elemento) y el relleno (espacio dentro del elemento).
Aquí puedes controlar:
- Márgenes
- Espaciados
- Fondos
El error número uno de los principiantes es dejar todo el contenido pegado a los bordes.
Para que tu web «respire»:
- Haz clic en los seis puntos de la Sección (azul).
- Ve a Avanzado.
- Añade un relleno (padding) superior e inferior de al menos 80px. Verás cómo el diseño pasa de verse apretado a verse profesional instantáneamente.
7. Hazla responsive (muy importante)
Cambia a vista:
- Tablet
- Móvil
Ajusta:
- Tamaños de texto
- Espaciado
- Orden de elementos
8. Publica la página
Haz clic en Publicar y listo.
Ya tienes tu primera página.
Preguntas frecuentes (FAQs)
¿Elementor es gratis?
Sí, tiene versión gratuita. También existe versión Pro con más funciones.
¿Necesito Elementor Pro?
No para empezar. Con la versión gratis puedes hacer páginas muy buenas.
¿Es mejor Elementor que el editor normal?
Para diseño visual, sí. Es mucho más flexible.
¿Elementor ralentiza la web?
Puede hacerlo si abusas. Por eso:
- Usa un buen hosting
- No sobrecargues la página
¿Puedo crear toda mi web con Elementor?
Sí, pero no es obligatorio. Puedes combinarlo con otras herramientas.
