Seguro que si usas WordPress, has escuchado hablar alguna vez de Elementor Page Builder y oye, no me extraña. Es uno de los plugin mejor valorados por los usuarios de WordPress y que hoy vamos a analizar y ver cómo funciona.
¿Qué es Elementor Page Builder?
Elementor Page Builder es un plugin maquetador de temas con el que puedes diseñar tu web en WordPress. Es muy fácil de usar e intuitivo. Puedes ir añadiendo formas de diseño y hacer tu página lo más creativa y moderna posible.
Elementor consta de una versión gratuita y una versión PRO. Con él, puedes ir creando en tiempo real tu página web y ver cómo va quedando tu diseño. ¿Por qué es uno de los plugins mejor valorados? Porque te permite diseñar tu web incluso sin saber apenas de código y en muy poco tiempo.
Esto es perfecto para las empresas o negocios que quieren comenzar su andadura online y que no saben cómo crear una página web. Así, pueden editar su diseño en un momento, y el resto del tiempo, dedicarlo a crear contenido de valor.
¿Para qué sirve Elementor?
Como ya te he comentado antes, Elementor Page Builder sirve para crear el diseño web de tu sitio. Aunque existen otras muchas alternativas como Visual Composer, Blocksy o Divi, existen ciertas características que hacen que quieras usar Elementor.
- Puedes ir viendo lo que añades/quitas a tu diseño en tiempo real. Lo vas viendo todo en una misma pantalla, sin necesidad de ir guardando y viéndolo.
- Es compatible con muchas plantillas de temas. Aunque dispone de plantillas propias, no es necesario que las uses. Puedes instalar el tema que más te guste y adaptarlo a tu estilo con Elementor.
- 100% Personalizable con widgets que puedes configurar como quieras y añadirlos a las páginas.
- Puedes crear tus plantillas, guardarlas y usarlas en todas las páginas que quieras.
- Es de código libre. Puedes modificar su código fuente y adaptarlo a lo que necesites (esto ya si eres más pro del diseño web).
¿Cómo usar Elementor?: Tutorial Elementor para Principiantes
1. Instala Elementor Page Builder
Pues como era de esperar, lo primero que tienes que hacer es instalar Elementor en tu WordPress. Aunque ya hemos dicho que Elementor consta de versión gratuita y versión de pago, en este tutorial vamos a explicar el funcionamiento de la versión gratuita.
2. Usa un tema compatible con Elementor
Sí, Elementor es compatible con una gran cantidad de temas, por lo que no vas a tener problemas a la hora de elegir el correcto. Lo único que debes tener en cuenta es que traiga por defecto algunas plantillas de ancho completo.
3. Toca añadirle extras
Como te hemos dicho, la versión gratuita tiene sus pros y sus contras. Aquí entran en valor sus contras y es que tienes menos widgets entre los que elegir para diseñar. Pero tranqui, podemos añadir plugins extras que sustituyan a esos widgets de la versión premium.
Puedes usar algunos de estos:
- Void Contat Form 7 Widget: Si quieres añadir formularios de contacto a tus páginas diseñadas con Elementor.
- Elementor Addon Elements: para añadir textos animados, cajas que giran, listas de artículos, separadores, etc.
4. Crea una nueva página y ¡a diseñar!
Ahora, ve a la sección de Páginas y haz clic en Añadir Nueva.
Justo arriba, te aparecerá un nuevo botón: Editar con Elementor. Pero, ¡cuidado! antes de irte a la edición con Elementor, ve al menú lateral de la nueva página y busca en los atributos de página el tipo de plantilla. Cámbiala a «Fullwidth» o «Ancho Completo».
5. Diseña por secciones y columnas
Una cosa que tienes que tener clara es que, Elementor se basa en diseños de bloques y dentro de cada bloque, puedes elegir diferentes estructuras en Columnas.
Una vez definido el bloque y su estructura, puedes ir añadiendo alguno de los elementos que te ofrece. En estas imágenes te muestro como hacerlo:
Para añadir los elementos, solo tienes que arrastrar y soltar encima de cada estructura.
Una vez tengas abierto el menú de edición del elemento que hayas añadido, tendrás diferentes apartados: Contenido, Estilo y Avanzado.
En el apartado de Contenidos podrás definir qué es lo que quieres que vaya en ese elemento. En el apartado Estilo, puedes definir los colores, la tipografía, si quieres sombreado y muchas más que irán variando según el elemento que elijas.
Y ya por ultimo, en el apartado Avanzado, puedes añadir o quitar márgenes, rellenos, darle un CSS personalizado, movimiento, borde, fondos, etc.
Además, en el menú lateral en la sección inferior, puedes ver diferentes iconos que serían los ajustes generales de la página (rueda dentada), un navegador para ver qué estructura tiene la página (icono laminado), las revisiones y el historial de cambios, la posibilidad de ver tu diseño en formato PC, Tablet o móvil y la opción de verlo en vista previa.
Como puedes ver, se trata de un maquetador de temas de lo más completo y que nada tiene que envidiarle a otros maquetadores como Visual Composer o Divi. Ya es cuestión de gustos y precio el elegir uno u otros. Si necesitas ayuda con el diseño de tu página web, solo tienes que ponerte en contacto conmigo y te ayudo a crear tu diseño desde 0 en WordPress.
