Seamos sinceros, incluso con Gutenberg, el editor de WordPress deja mucho que desear. Es torpe y muy limitado. ¡Es basura! Intenta crear una landing page semi decente con él y luego dime en los comentarios cuales fueron tus resultados. Afortunadamente, existen soluciones como Elementor Pro.
Sí, los constructores de páginas webs visuales han cambiado las reglas del juego, sobre todo para personas que como yo, no sabemos nada de códigos. Tal vez sea también tu caso.
Así que si deseas agregar estilos avanzados de diseño y elementos a tu sitio web, quédate hasta el final. Te estaré hablando de uno de los mejores plugins que hay actualmente para lograrlo. Y como dije antes, no requiere que sepas absolutamente nada de código.
De eso se trata Elementor Pro.
Elementor Pro
Pero, ¿qué es Elementor? Elementor Pro es un plugin constructor visual de páginas webs, del tipo arrastrar y soltar.
Como acabas de leer, hay dos elementos fundamentales en esta definición, por lo cual vamos a ampliar aún más para que entiendas del todo y no te queda ninguna duda de lo poderoso que es Elementor.
- Visual: significa que cuando diseñas tu contenido, ves exactamente lo que verán tus visitantes. Nunca hay confusión sobre cómo se verá tu página una vez que la publiques.
- Arrastrar y soltar: significa que puedes mover varios elementos de diseño, como botones, formularios o imágenes, simplemente arrastrándolos y soltándolos. ¡No requiere código!
El resultado final es una herramienta que te permite hacer que tu sitio de WordPress tenga el aspecto que deseas sin la necesidad de aprender código (o contratar a un desarrollador). Ahora que ya sabes qué es Elementor Pro sigue leyendo.
Elementor Pro vs Thrive Architect
Aunque en este post no pretendo hacer una comparativa, es imposible que no mencione Thrive Architect, ya que es el plugin constructor visual que utilizo en este mismo blog.
Es con Thrive Architect que creo mi página de inicio, las landing page que puedes ver en mi sitio y mis páginas de ventas online. Si haces clic aquí podrás ver las cartas de ventas creadas con Thrive Architect.
Pero siendo honesto, Elementor Pro es superior. Incluso, en algunos blogs anglosajones, he leído que Thrive Architect fue creado inspirado en Elementor. No me consta, pero sí lo he leído.
Hecha esta aclaración, sigamos con esta review de Elementor Pro.
Cómo funciona Elementor Pro
Para comenzar, lo primero que debes hacer es instalar y activar el Plugin de Elementor Pro. Aquí debo decirte que tiene una versión gratuita, pero con limitaciones.
Si vas en serio con tu proyecto online, yo te recomiendo la versión Pro, definitivamente. Tu sitio web es un negocio y debes invertir en herramientas profesionales para poder vivir del Internet. No te andes por las ramas y no escatimes, si deseas hacer de tu emprendimiento online un verdadero negocio.
Hablaremos del precio en un minuto.
Una vez que lo has instalado, podrás diseñar tus posts y tus páginas como todo un profesional del diseño web. Esto es lo que verás al comenzar:
- Área de contenido: aquí es donde vas a construir tu página, simplemente arrastrando y soltando elementos disponibles en la sección de widgets.
- Elementos o widgets: estos son los bloques que usarás para ir armando tu página, arrastrándolos al área de contenidos. Tienes a tu disposición columnas, encabezados, imágenes, texto, video, botones, etc.
- Sección de ajustes: en esta sección puedes ir guardando los cambios que vayas haciendo en tu página, o deshacerlos si no te convence lo que has hecho. Incluso, te permite previsualizar como va a verse tu página en diferentes dispositivos como smartphone, tablets, PC, etc.
Cómo construir tu página con Elementor Pro
Si bien puedes usar alguna de las tantas plantillas premium que tiene Elementor Pro, voy a comenzar con una página en blanco. De esta forma te llevas la idea de como funciona Elementor. Una vez que hayas entendido esto, editar sus plantillas será como coser y cantar.
Para comenzar, es necesario que sepas que Elementor Pro te brinda dos elementos estructurales, los cuales te permiten ir dándole forma a tu diseño. Estos elementos estructurales son básicamente:
- Secciones
- Columnas
- Sección: es el cuadro que puedes ver marcado en color azul. Dentro de las secciones puedes colocar cualquier tipo de elementos de los que hablamos arriba, incluso, puedes colocar otro de sus elemtos estructurales, las columnas.
- Columnas: son los cuadros que observas de color gris. Dentro de ellas puedes colocar también todo tipo de elementos, como imágenes, botones, videos, etc. En la captura de arriba, tenemos dos columnas como puedes ver, pero puedes configurarlo para que sean tres columnas, cuatro, etc.
Cómo añadir elementos con Elementor Pro
Añadir elementos a tu diseño es tan fácil como arrastrar y soltar desde la izquierda, o sea, desde el área de widgets.
Seleccionas el que deseas y lo arrastras hacia una sección o columna. En la siguiente captura podrás verlo en acción.
En el ejemplo te he puesto un encabezado, al cual le puedes aplicar una tonelada de diseños, colores, fuentes…
Pero de esta misma forma puedes añadir todo tipo de elementos para ir construyendo tu página. Y como te había comentado antes, podrás ir viendo en vivo como se verá una vez que hayas guardado los cambios.
Cada elemento que añadas, al seleccionarlo, desplegará a la izquierda, en la sección de widgets, una serie de opciones de personalización. En un post es imposible que pueda cubrirlos todos, pero ya verás que no es difícil para nada poder obtener los estilos que deseas. Todo es cuestión de trastear un poco y estarás de acuerdo conmigo que es más fácil de lo que ahora imaginas.
Cómo editar elementos de estilo y estructurales
De esto es precisamente de lo que hablaba en el párrafo anterior. Mira la siguiente captura de pantalla:
Como puedes ver, es un elemento de estilo. En este caso, un encabezado. Al marcarlo, haciendo clic en él, a la izquierda se abre una submenú de opciones de personalización.
Desde este submenú puedes editar estilos, colores, fuentes, decoraciones a tu encabezado, etc.
Cada elemento tiene su propio submenú con sus diferentes opciones de personalización.
Es difícil trabajar con Elementor Pro
De todos los constructores visuales de páginas webs, o page builders, como también se les conoce, Elementor Pro cuenta con una interfaz de las más simples de comprender. Todo es muy intuitivo y fácil de entender, incluso para quienes nunca han construido una página web.
En mi caso, que trabajo con Thrive Architect, se me hace sumamente sencillo porque su funcionamiento es muy parecido. Sin embargo, como todo en la vida, Elementor tiene su curva de aprendizaje también.
No te voy a mentir diciendo que de una vez crearás las páginas más hermosas que jamás hayas visto. Lo que sí te puedo asegurar es que la curva de aprendizaje es corta, y que «trasteando» irás agarrando habilidades y creando landings, páginas de ventas y páginas de inicio como nunca te hubieras imaginado, sin necesidad de tocar nada de códigos.
Y aquí me gustaría darte un consejo: antes de comenzar, selecciona una plantilla de las tantas que tiene Elementor Pro y comienza a deshacerla, eliminando elementos. Esto te permitirá ir viendo como fue creada por su desarrollador, lo cual te permitirá ir creando habilidades para crear verdaderas joyas de diseño.
Elementor extras
Los creadores de Elementor Pro ponen a nuestra disposición algunos extras, como veremos a continuación.
1. Elementor templates o plantillas
Ya había mencionado que Elementor Pro tiene numerosas plantillas o «templates». Si bien puedes crear tus páginas completamente desde cero, no siempre tiene que ser así.
En la biblioteca de Elementor Pro tienes un montón de plantillas que puedes insertar en tu página con un solo clic.
Una vez insertada la plantilla que hayas elegido, solo debes editarla modificando, agregando, o eliminando elementos hasta que cumpla con tus expectativas.
Esto es lo más recomendable para comenzar a trabajar con Elementor Pro. Editando sus plantillas o «templates», como dije antes, irás adquiriendo habilidades.
2. Diseños responsivos
Este es otro «Elementor extra«. Con el aumento cada día del tráfico móvil, ya sabes que es muy importante que tus páginas sean responsivas. Si no sabes que significa «responsiva» esto se refiere a que las páginas debes verse bien tanto en escritorios como en dispositivos móviles.
La buena noticia es que todas las páginas que crees con Elementor Pro son totalmente responsivas y se adaptan perfectamente a todos los dispositivos.
Para chequear como se verá tu página en un dispositivo móvil, basta con que te dirijas a la sección de ajustes, en la parte inferior, como te muestro a continuación:
Pero los extras de Elementor Pro van más allá. Si quieres que un elemento sea visible en tu página desde la versión de escritorio, pero ocultarlo en la versión móvil, simplemente puedes hacerlo con un solo clic.
Esta función es sumamente importante, sobre todo cuando se trata de imágenes grandes que ocupan mucho espacio en la pantalla de un smartphone, por ejemplo.
3. Controles para un diseño detallado
¿Recuerdas que te mencioné que con Elementor Pro puedes construir tus páginas sin necesidad de aprender nada de códigos? Pues, eso obviamente, los creadores de Elementor lo logran «sacrificando» un poco de flexibilidad a la hora de ubicar esos elementos para lograr esa simplicidad.
Sin embargo, los chicos de Elementor Pro lo han pensado todo, y ponen a nuestra disposición, una tonelada de controles muy intuitivos para que puedas colocar los elementos justo donde tú lo deseas.
Con dichos controles tú puedes:
- Configurar manualmente el relleno y el margen para secciones, columnas y widgets.
- Ajustar el ancho de las columnas simplemente arrastrando el divisor entre columnas.
- Colocar los widgets verticalmente dentro de una columna (o columnas dentro de una sección).
- Crear un espacio en blanco entre columnas con espacio de columna ajustable.
4. Edición de texto con Elementor Pro
Algunos constructores de páginas usan ventanas emergentes para poder editar el texto en tu sitio web. Eso no ocurre con Elementor Pro. Aquí solo necesitas hacer clic en el texto que deseas y comenzar a editar.
Lo que ves en la captura de arriba, lo puedes hacer con todos los textos de tu página web.
5. Deshacer y rehacer tu diseño
Como dice Goethe, seguramente vas a cometer algún error. (de acuerdo, puede que sean varios :)).
Cuando algo no salga como esperabas, no te desesperes. Elementor Pro tiene dos formas de corregir estos errores.
En primer lugar, cada acción que realizas en tu diseño, puede revertirse fácilmente.
En segundo lugar, cada vez que guardes un diseño, obtendrás una revisión a la que puedes volver si lo necesitas.
Pero ten en cuenta que estas revisiones para poder acceder a ellas luego de salir de la interfaz debes haberlas guardado anteriormente.
Las acciones individuales sí se borran al salir de la interfaz de Elementor Pro.
Elementor Themes
Cuando salió al mercado Elementor, no era posible contruir un theme para WordPress. Necesitabas comprar una plantilla para obtener un sitio de calidad.
Con el lanzamiento de Elementor Pro, ya esto no es necesario, ya que con este puedes crear tú mismo tu theme completamente desde cero y obtener un sitio completamente único.
Por ejemplo, puedes crear una plantilla para tus posts, incluido la caja de autor. Con esto te estarás ahorrando instalar un plugin de autor box. Y ya sabes, que mientras menos plugins instales en tu blog más rápido va a cargar y mejora por consiguiente su posicionamiento.
Contenidos únicos con Elementor Pro
Elementor Pro te permite crear contenidos únicos, posts épicos que deleitarán a tus lectores. Con una gran cantidad de widgets para agregar, puedes tener un blog con posts que no se parezcan a los de nadie.
Eso sin mencionar, la cantidad de plugins que te ahorrarás, pues Elementor Pro tiene widgets entre otros para:
- Formularios (incluidos los formularios de contacto)
- Botones para compartir en redes sociales
- Temporizadores de cuenta regresiva
- Tablas de precios
- Etc
En la siguiente captura te muestro la lista completa de widgets de Elementor Pro:
Pop Ups con Elementor Pro
Es un hecho, o amas los pop ups o los odias. Así de sencillo.
Yo personalmente, los amo, porque aunque algunas personas los critican, consiguen conversiones, que al final es su objetivo. Pienso que un pop ups, configurado para mostrarse en la intención de salida de una web, no es para nada perjudicial. Total, si ya el lector se iba a marchar de tu página.
Como te comentaba arriba, yo uso Thrive Architect, pero para poder crear pop ups y captar suscriptores, tuve que comprar Thrive Leads, otro plugin de la misma empresa. En mi opinión, el mejor plugin para hacer crecer una lista.
Sin embargo, con Elementor Pro, ya esta función viene incluida.
La mejor parte es que te permite crear un pop up dentro de Elementor Pro tal como crearías una página web. Las opciones de diseño, estilo y personalización avanzada de Elementor ya están en su lugar, junto con widgets y herramientas de edición para dispositivos móviles que te permiten ajustar tu pop up hasta el más mínimo detalle.
Incluso si dejas que tu imaginación vuele, con la debida atención a los detalles, tu pop up puede dar la apariencia de ser una parte integral de tu sitio web, en lugar de ser un intruso menos que bienvenido.
¡Y puedes hacerlo sin escribir una línea de código!
Mira las imágenes a continuación para más detalles.
Precio de Elementor Pro
Aquí es donde Elementor aplasta a la competencia. Para empezar, tiene una versión gratuita que puedes descargar desde el repositorio de plugins para WordPress, haciendo clic en este enlace.
Yo lo he usado y te puedo asegurar que es muy bueno.
En este punto, seguramente te estarás preguntando, ¿si tiene una versión gratis y es muy bueno, por qué adquirir Elementor Pro?
Muy sencillo, porque en la versión gratuita vienen muchas funciones bloquedas, a las que solo podrás acceder con la versión Premium.
Con Elementor Pro, o sea, la versión premium, te aseguro que podrás llevar el diseño de tu web a otro nivel.
Además, con la versión gratuita vienen muchas plantillas bloqueadas, que para poder usarlas necesitas como te dije antes, la versión Pro. En la siguiente captura te muestro para que te lleves una idea:
No se a ti, pero a mí me molestaría muchísimo querer usar alguna de estas funciones y no poder usarlas por tener la versión gratis. Yo prefiero pagar y tener acceso a todo, incluido a sus foros de soporte que son excelentes y puedes acudir cuando tengas cualquier problema con Elementor Pro.
Ahora sí veamos el precio de elementor pro.
Como puedes ver, para un sitio el precio es de 49 dólares. Pero para usar en sitios ilimitados, solo 199. O sea, mientras más sitios planees usarlo, más barato te sale Elementor Pro. Ya es cuestión tuya decidir qué opción te conviene más. Pero comprar Elementor Pro es la mejor inversión que puedes hacer.
Pros de Elementor Pro
- Interfaz de usuario limpia y muy intuitiva, amigable con los novatos
- Altísimo nivel de flexibilidad para diseños de páginas
- Amplia colección de widgets, listos para usar
- Bloques de contenido bien diseñados y plantillas de página (Elementor templates)
- Los usuarios Premium tienen acceso a un excelente creador de temas
Contras de Elementor Pro
- Aunque es económico para todo lo que te brinda, es posible que para algunos usuarios de latinoamérica todavía parezca caro (aunque esto yo lo veo más bien dependiendo del compromiso que se tenga a vivir de una página web)
- Combinar ciertos elementos puede ser complicado al principio para personas con poca experiencia usando constructores visuales de páginas webs
Concluyendo:
Si has leído el artículo completo, probablemente no necesite decirte que Elementor Pro, es uno de los constructores visuales o page builders mejores que existen actualmente en el mercado.
Ofrece una interfaz intuitiva, diseños flexibles de secciones y columnas, personalización profunda, una amplia biblioteca de widgets y una gran cantidad de plantillas.
Te permite dotar a tu sitio web de una belleza inigualable, y tendrás un blog del que te sientas orgulloso firmar al final de cada post.
Combina todo eso con una estructura de precios que se ajusta a cualquier presupuesto, y verás rápidamente por qué todos se enamoran de Elementor Pro.
Puedes buscar de Elementor opiniones y todo lo que encontrarás son comentarios positivos.
