Elementor Page Builder

Elementor Page Builder: review + tutorial y comparativa con Thrive Content Builder

Hace tan sólo unos pocos meses te hablaba de Thrive Content Builder, un constructor web (o editor visual, llámalo como quieras) que durante el último año había revolucionado la forma de maquetar contenido de páginas y entradas en WordPress con su estilo drag&drop (arrastrar y soltar).

En aquel momento, te hablaba de él como el editor visual web más completo. Y si te lo decía era porque realmente así lo consideraba cuando escribí la entrada.

Pero… ahora algo ha sucedido. Algo que ha hecho que mi opinión como diseñador web haya dado un giro de 180º.

Durante los últimos días he conocido una nueva herramienta del mismo tipo llamada Elementor Page Builder, la cual apenas tiene 5 meses de vida y parece que claramente va encaminada a desbancar a Thrive Content Builder de su actual trono.

Esto me atrevo a decirlo tras haberla probado tan sólo durante un par de días haciendo pruebas con ella.

Te preguntarás… ¿tan pronto te ha convencido y tan maravillosa te parece que sólo te ha hecho falta probarla durante un par de días para “ponerle los cuernos” a Thrive Content Builder?

Mi respuesta rotunda, a riesgo de que me digas que soy de infidelidad fácil, es un SÍ tan grande como la catedral de Toledo.

Fíjate como será esto que hasta me he saltado mi calendario editorial a la torera y me he puesto a escribir como un loco entusiasmado sobre él.

¿Quieres saber por qué con argumentos y ejemplos?

Pues no te pierdas esta review sobre Elementor Page Builder que he preparado para ti en la que, no sólo te muestro todo lo que puedes hacer con este nuevo editor visual, si no que también voy a realizar una comparativa con Thrive Content Builder para que veas todos los puntos donde considero que lo aventaja considerablemente.

 

Índice de contenidos

Características principales de Elementor Page Builder

Lo primero que voy a enseñarte son una serie de señas de identidad muy generales de Elementor que ya hablan muy bien de él a primer golpe de vista y que denotan que, probablemente, estamos ante el mejor plugin de este 2016 que se ha desarrollado para WordPress.

Review y tutorial sobre Elementor Page Builder

 

Elementor Page Builder es más rápido

Nada más instalarlo, este es el primer punto en el que me he percatado que Elementor destaca notablemente sobre otros editores visuales que he probado.

Verdaderamente, el plugin carga muy rápido cuando lo ponemos en acción. Pero no sólo es rápido al cargarse, si no también al utilizarlo.

Mientras lo estás utilizando, su funcionamiento es sumamente fluido. No se queda “pillado” y realmente no da fallos o problemas de ningún tipo. Realmente es un editor visual en tiempo real. Yo diría que en tiempo récord real. 😉

 

Elementor es de código abierto

Por si no sabes lo que es, algo que es de código abierto significa que su código fuente está a disposición de todo el mundo para que cualquier desarrollador pueda crear e implementar sus propias mejoras si lo consideran necesario.

Por ejemplo, WordPress es un CMS de código abierto y, gracias a ello, existen tantos plugins y temas creados para él por una gran cantidad de desarrolladores.

A raíz de este ejemplo que te pongo, seguramente entiendes por qué me parece un punto tan destacable el hecho de que Elementor Page Builder sea un editor visual de código abierto.

Que lo hayan hecho así implica directamente que es más probable que vayan saliendo cada vez más y mejores actualizaciones en el futuro (aparte de más frecuentes) ya que cualquier desarrollador que se ponga a estudiar cómo está hecho el editor podrá programar sus propios aportes a la herramienta y dar solución a una lista de problemas concretos más variados.

 

Posibilidad de diseñar tocando el menor código posible

Otra de las características principales que destacan los propios creadores de Elementor es que han creado este constructor web teniendo siempre al diseñador en mente.

Esto es que, a diferencia de otros editores de este estilo, su objetivo es que se puedan crear grandes diseños de la manera más rápida, profesional y efectiva posible sin que haya que tocar código o CSS.

Con este fin, han implementado elementos para diseñar que no estaban incluidos en ningún otro constructor web hasta la fecha.

Ya te aviso por adelantado que lo han logrado con nota. Pero no quiero anticipar demasiado sobre este tema, ya que quiero contártelo un poco más adelante de manera más detallada cuando te hable de todo lo que puedes crear e incluir en tus diseños con Elementor Page Builder.

En cualquier caso, si no me crees o piensas que estoy exagerando, fíjate como uno de sus desarrolladores crea una Landing Page en poco más de 10 minutos totalmente desde cero.

Por cierto, esto no significa que Elementor se cargue de un plumazo el hecho de que puedas hacer personalizaciones con tu propio código CSS o HTML. En esto también han pensado sus desarrolladores y, por tanto, tampoco se queda atrás de otros editores visuales en este aspecto. 😉

 

Facilidad de uso

Nada de esto que te he dicho antes tendría sentido si luego la herramienta fuese muy complicada de utilizar.

Pero no es el caso. De hecho, me atrevería a decir que es la más sencilla de este tipo que he utilizado hasta ahora.

Con Elementor podrás controlar una enorme cantidad de parámetros CSS para dar estilos a cualquier elemento que introduzcas en tu blog o tu web únicamente utilizando campos para rellenar, deslizadores o elementos seleccionables con un click de ratón.

Vamos, nada que cualquier usuario con un nivel básico de informática no sepa hacer.

Se puede decir que, en este sentido, también han mejorado lo que ya había y se han puesto a la cabeza del ranking. 😀

 

Diseñar una web para dispositivos móviles nunca fue tan fácil

Esta característica, sin duda, es de las que más han llamado mi atención y una de las grandes diferencias respecto a Thrive Content Builder u otros editores visuales.

Con Elementor Page Builder por fin puedes controlar los media queries (es decir, el código CSS que hace que el diseño vaya cambiando en función del tamaño de pantalla del dispositivo) de manera totalmente visual.

Como verás más adelante cuando te enseñe uno por uno los elementos del editor, al pulsar sobre cada uno de los iconos responsive (escritorio, tablet o móvil), puedes establecer desde el frontend mediante sus opciones de personalización estilos CSS para cada una de las visualizaciones simplemente utilizando deslizadores o rellenando datos en los campos preparados para ello.

Diseño Responsive en Elementor Page Builder

De verdad, una pasada. Cuando lo he visto, ojiplático me he quedado. 😯

 

Elementor Page Builder es gratis… y lo va a seguir siendo

Ah, ¿que aún no te he comentado este pequeño detalle?

Pues sí, Elementor Page Builder no te va a costar un duro. Es totalmente gratuito.

Te preguntarás… ¿cómo algo tan bueno puede ser gratuito? ¿Lo va a seguir siendo en el futuro o es sólo una estrategia de marketing para captar clientes?

Pues ya te digo que no, no es una estrategia de marketing.

En su web, los desarrolladores de Elementor dejan bien claro que no han sacado Elementor de manera gratuita como un gancho o truco alguno, si no para crear un digno competidor entre los editores visuales DIY cuyo uso sea el más extendido posible.

De hecho, también aseguran que, a pesar de que piensan sacar el próximo 12 de diciembre una versión premium llamada Elementor Pro (cuyas funcionalidades van a ir más enfocadas al engagement, a la promoción o a las conversiones de los sitios web), no piensan quitar con ello ni una sóla funcionalidad a la versión gratuita.

Es más, no sólo no piensa hacer esto si no que su intención es la de seguir aportando funcionalidades nuevas en la versión gratuita que ahora no están implementadas.

Por ejemplo, ya tienen en mente un par de nuevos elementos que van a incluir próximamente llamados “Person” y “Countdown” así como un historial de revisiones para que puedas volver a un estado anterior mientras estás diseñando tus páginas por si te equivocas.

 

Elementor está traducido a muchos idiomas. Incluido el español

Pues sí, como lo oyes.

Por defecto, nada más instalar Elementor, toda la herramienta esta traducida en perfecto castellano sin que tengas que instalar ningún archivo de traducción o similares.

Seguramente no es la característica más importante (o puede que para algunos sí que lo sea), pero que quieres que te diga… a nadie le amarga un dulce. Y si también me facilitan la vida poniendo el constructor web en mi idioma pues lo agradezco un montón, sinceramente.

 

Es perfectamente compatible con GeneratePress

Si sigues el blog, ya sabes que desde hace algún tiempo todos mis diseños los realizo bajo el theme / framework GeneratePress.

Pues bien, otra noticia genial relacionada con Elementor es que… ¡es 100% compatible con esta plantilla!

Y no lo digo yo. Lo dice Tom Usborne, el propio creador de GeneratePress, el cual en el propio foro de su tema WordPress recomienda Elementor como el editor visual a utilizar junto a su creación.

Es más, también los desarrolladores de Elementor recomiendan GeneratePress como una de las mejores plantillas que puedes utilizar con su constructor web.

Bajo mi punto de vista, esto es un auténtico puntazo en favor de Elementor Page Builder con respecto a Thrive Content Builder, ya que con el constructor de la empresa Thrive Themes si es cierto que había ciertas cosas que no eran del todo compatibles y te veías obligado a utilizar una herramienta u otra para hacer tus páginas (trucos como el de utilizar Thrive Leads en las secciones a ancho completo aparte).

 

Cuenta con la aprobación de prácticamente todos los que lo han probado

Como te he comentado antes, Elementor Page Builder es muy joven aún. Salió al mercado el pasado 2 de junio de 2016. Eso significa que apenas tiene 5 meses de vida en el momento en el que estoy escribiendo estas líneas.

Sin embargo, en tan poco tiempo, los datos de uso y valoración que han conseguido por parte de todos los usuarios que usan WordPress son sencillamente espectaculares.

Actualmente, y con este poquito tiempo de vida que te comentaba, Elementor ya está siendo utilizado en más de 20.000 instalaciones de WordPress y la valoración media de todos los que lo usan es de 4.9 sobre una puntuación total de 5 (puedes ver estos datos en el repositorio de plugins de WordPress).

No me he puesto a mirar cuantos plugins que cuentan con este número de usuarios tienen esa valoración. Pero me atrevería a decir que muy, muy, muy pocos. Y si alguno más lo tiene, no creo que lleve tan poco tiempo en el mercado como Elementor.

El hecho de que los propios usuarios lo valoren tan alto y estén confiando en él tan pronto ya es un síntoma claro de que probablemente estamos ante el rey de los editores visuales de WordPress durante los próximos meses o años.

 

Código de alta calidad optimizado para SEO

La última de las características principales con las que cuenta Elementor no es precisamente la menos relevante.

Los chicos de Elementor Page Builder también han desarrollado este plugin pensando en el tema del posicionamiento web y el SEO, creando un código limpio que cumple con los principales estándares recomendados por los principales buscadores como Google.

Por ejemplo, con Elementor se evita el uso de  los estilos “inline”, algo bastante perjudicial para los tiempos de carga a lo que sí recurren otros editores visuales.

Evidentemente, esto no significa que por instalar Elementor vas a ser el primero en las búsquedas que te interesen (para eso debes trabajar tanto tu SEO on page como tu SEO off page), pero sí que su código ayuda a no incumplir reglas básicas que te penalicen.

 

Review y tutorial sobre Elementor Page Builder

Bien, ya te he hablado de las características a nivel general con las que cuenta Elementor Page Builder y seguro que, como mínimo, habrán llamado poderosamente tu atención, ¿me equivoco?

Pues ahora voy a meterme contigo hasta las entrañas de este constructor web para que veas absolutamente todo lo que puedes hacer con él.

Prepárate para recibir un flechazo directo del Cupido tecnológico (vale, este termino me lo acabo de inventar. Pero seguro que lo hay por algún sítio… 😛 ) como el que he sufrido yo.

Como hice con GeneratePress o Thrive Content Builder, voy a dejarte todas mis impresiones tanto en formato texto como en el siguiente vídeo en el que voy a hablarte de todo lo que se puede hacer con Elementor Page Builder. Elige la opción que te sea más cómoda. 😉

Para empezar, vamos a echar un vistazo a la interfaz inicial que nos aparece nada más abrir el editor.

Por defecto, lo primero que aparece son todas las herramientas de diseño que Elementor Page Builder pone a nuestra disposición, las cuáles vamos a repasar una por una a continuación.

Antes de eso, únicamente aclararte que siempre podrás acceder a este panel de herramientas haciendo click en el icono de la parte superior derecha del panel de control de Elementor (te lo marco en la siguiente imagen con un cuadrado azul para que quede más claro).

Icono de herramientas en Elementor Page Builder

 

Herramientas de diseño incluidas en Elementor

Herramientas incluidas en Elementor Page Builder

Secciones

La primera de las herramientas que encontramos precisamente no se encuentra dentro del panel de la barra lateral de Elementor, si no que es uno de los dos botones que aparecen en la página del diseño.

Estoy hablando de la opción “Agregar nueva sección”.

Con ella, Elementor ya está cubriendo una de las grandes carencias que Thrive Content Builder no ha arreglado durante todo este tiempo en su editor, que es la de poder crear secciones a ancho completo. 🙂

Esto puede hacerse seleccionando la estructura “limpia” para la sección (con una sola columna) marcando la opción “Stretch Section” o seleccionando “Ancho completo”  en la opción “Ancho de contenido” que se encuentra dentro de la sección “Disposición” que configura dicha sección.

Secciones en Elementor Page Builder

Además, no sólo puedes incluir como fondo de tu sección una imagen estática normal y corriente… ¡si no que también tienes la posibilidad de utilizar un vídeo!

No sólo eso, también podemos crear secciones con hasta 12 estructuras predefinidas que son la mar de variadas como puedes ver en esta imagen.

Estructuras para secciones en Elementor Page Builder

Esto empieza muy bien, ¿verdad? Pues seguimos…

 

Columnas

El generador de columnas es una de las herramientas más básicas y útiles a la hora de realizar cualquier diseño.

Nada más incluir un elemento de columna en nuestro diseño, aquí ya se ve una novedad importante respecto a Thrive Content Builder: podemos incluir cualquier número de columnas que queramos en una misma fila con cualquier proporción de ancho para cada una de ellas.

No sólo eso, podemos adaptar el tamaño de las columnas únicamente posicionándonos entre dos de ellas y reduciéndolas o ampliándolas haciendo click y arrastrando el ratón de nuestro PC.

Columnas en Elementor Page Builder

Esto sencillamente te da un abánico de posibilidades en cuanto a diseño prácticamente total.

Es cierto que en Thrive Content Builder también se pueden hacer columnas. Pero sólo se pueden hacer en función de los ajustes prestablecidos por la herramienta.Por ejemplo, lo máximo por fila son 4 columnas de ¼ de proporción cada uno respecto al ancho.

Pero esto con Elementor no sucede.

Yo puedo tener el número de columnas que quiera y no tienen que respetar unas proporciones determinadas. Puedo hacer si me place una columna de un 10% de la pantalla, otra del 20% y otra del 70% (por poner un ejemplo).

Te puedes imaginar ya que esto sencillamente lo que provoca es que la herramienta no limita para nada tu creatividad a la hora de diseñar.

 

Encabezado

El título creo que es bastante descriptivo, ¿no?

Esta herramienta será la encargada de incluir en tus diseños los encabezados de página pertinentes, pudiendo modificar en ella tanto su etiqueta html correspondiente (h1, h2, h3, etc.) como las características de su diseño.

También podrás enlazar los títulos a cualquier página que te interese, indicar los márgenes y relleno (padding) que te plazca, establecer imágenes o colores de fondo, dar clases  CSS determinadas, poner bordes alrededor del título con la anchura o forma (radio del borde) que tú quieras para el mismo, establecer sus opciones responsive por si quieres esconderlos en escritorio, móviles o tablets…

Decir que la mayoría de estas opciones también las encuentras en cualquiera de los elementos que vamos a ver, con lo que una vez más los límites de lo que vayas a crear sólo los va a poner tu creatividad e imaginación.

¿No es una gozada poder hacer todo esto desde una herramienta visual? No me digas que no, que ya estás babeando con Elementor Page Builder igual que yo… 😛

 

Imagen

Con ella podrás incluir imágenes en los lugares que te plazca, pudiendo establecer también multitud de opciones como su tamaño, alineación, opacidad, animaciones al pasar el ratón, borde, leyenda, márgenes, fondos etc.

Control total y absoluto también en la parte multimedia. 😀

 

Editor de texto

Permite introducir textos simples en cualquier parte de tu diseño, pudiendo controlar todas sus opciones de edición y visualización desde un mini editor similar al de WordPress que aparece en la parte lateral.

Esto me parece otro punto a destacar, ya que los que estén acostumbrados al editor nativo de WordPress podrán seguir utilizándolo fácilmente dentro de la herramienta para crear sus textos, con lo que en este sentido les facilita la vida al no tener que aprender nada nuevo.

Con Thrive Content Builder también podía hacerse, pero había que incluir un elemento específico del tipo “Wordpress Content” para utilizarlo.

Además de todo esto, puedes elegir la posición del contenido a tu voluntad dentro de las columnas o secciones donde lo hayas creado, otorgando una flexibilidad total a la hora de maquetar de tus textos que te permite ponerlos prácticamente donde quieras a voluntad.

Posición de contenido en Elementor

 

Vídeo

Te facilita la inclusión de vídeos responsive dentro del diseño de tu blog o tu web que se encuentre subido en Youtube o Vimeo.

Esta opción si que es bastante similar a Thrive Content Builder, ya que incluye la posiblidad de autoreproducir el vídeo, mostrar u ocultar el control de reproducción, los vídeos sugeridos o el título y acción del reproductor.

Sin embargo, Elementor incluye además la posibilidad de que puedas elegir la proporción de tu vídeo (16:9, 4:3 o 3:2), establecer una imagen de cubierta personalizada que a ti te interese mostrar antes de que el usuario pulse el botón “Play” para reproducir el vídeo, animaciones de entrada, establecer fondos o controlar en que dispositivos quieres que se cargue la visualización de dicho vídeo.

Otra vez han “rizado el rizo” en este aspecto, sacándose de la manga varias nuevas funcionalidades de donde no la había. ¡Bravo!

 

Botón

Por supuesto, no podía faltar el hecho de poder crear botones con Elementor Page Builder.

Aquí dispones de hasta 5 tipos de botones predeterminados para implementar. Pero en realidad… estos tipos son lo de menos.

Y es que Elementor te da tantas posibilidades también en este sentido que se puede decir que puedes crear el tipo de botón que te plazca gracias a sus personalizaciones.

Han mejorado también a Thrive Content Buider en este aspecto, ofreciendo una amplia variedad de iconos para botones que pueden posicionarse antes o después del texto y también a la distancia que tu desees.

Sin contar que, como ocurre con otros elementos, puedes elegir también fondos de color o imagen y bordes de diferentes estilos para darle la mayor personalización posible. Lo mismo ocurre si deseas implementar animaciones súper chulas para tus botones.

Otro 20 sobre 10 en este sentido para Elementor Page Builder. Sigamos…

 

Separador

El elemento separador incluye líneas que pueden separar diferentes secciones o, por ejemplo, los títulos del contenido.

Una vez más, los chicos de Elementor mejoran algo que yo echaba mucho en falta en Thrive Content Builder: la posibilidad de poder controlar todos los aspectos de diseño de estos separadores.

Estoy hablando sobre todo de su ancho y su color, algo que desde que usaba Thrive Content Builder no entendía como no habían podido incluir como opciones de configuración de este tipo de elemento web.  

Obi, obá, cada cosa que veo de ti me gusta más Elementor. 😀 ¡Continuamos!

 

Espaciador

Este es un elemento que puede parecer una chorrada a simple vista… pero que te quitará muchos quebraderos de cabeza.

Al incluirlo, lo que podrás generar es espacios en blanco del tamaño que tú decidas para separar otros elementos del diseño.

Sí, esto se puede hacer estableciendo márgenes, lo sé. Pero con esta herramienta tienes otra opción bajo mi punto de vista mucho más sencilla e intuitiva para usuarios menos expertos. 😉

 

Google Maps

Otra novedad importante de Elementor con respecto a Thrive Content Builder es que puedes incluir directamente mapas de Google Maps en tus diseños estableciendo fácilmente su dirección o coordenadas, su tamaño, el nivel de zoom de dicho mapa o impedir que se pueda ampliar dicho zoom a voluntad del visitante de tu blog o tu web.

Sí, ya sé que Thrive Content Builder incluía ya esta posibilidad en su editor visual… pero únicamente lo hacía permitiéndote pegar el código. Elementor, una vez más, ha mejorado esto haciéndolo mucho más intuitivo y fácil de hacer. Ya no es necesario que sepas que “numeritos” cambiar en el código que te da Google Maps para dejar tu mapa tal y como deseas.

Como sabes, ver estos mapas en las secciones de “Contacto” de empresas o negocios suele ser muy habitual para que los visitantes encuentren su sede física, con lo que el hecho de que te faciliten la vida para incluir algo tan común se agradece y mucho. 🙂

 

Icono

También puedes incluir iconos de Font Awesome en cualquier parte del diseño que se te antoje.

Sí, esto es algo que también podías hacer con Thrive Content Builder. Peeeero….

Una vez más, Elementor da muchas más posibilidades en cuanto a diseño se refiere, pudiendo establecer un fondo cuadrado o en círculo para el icono, determinar lo grande que quieres que sea el relleno del mismo, establecer colores primarios y secundarios para esta combinación, o si quieres con un click intercambiar dichos colores establecidos.

Hasta los puedes girar para que no se muestren siempre totalmente en posición vertical. Una pasada. Detalles como estos denotan mucho interés por hacer el mejor constructor web del mercado. 🙂

Vamos, que Elementor Page Builder no para de dejarnos tanto a ti como a mi con la boca abierta a cada cosita que vemos de él, ¿a que sí? 😀

 

Cuadro de imagen

Esta herramienta es una manera cómoda y sencilla de incluir una imagen que cuente directamente debajo con un título y una descripción de la misma.

Naturalmente, como ocurre con todo en Elementor, puedes controlar todos los parametros referentes a tamaños, colores, fondos, etiquetas de título, márgenes etc.tanto de la imagen en sí como del encabezado o el texto.

 

Caja de icono

Similar a la herramienta anterior de “Cuadro de imagen”, pero en esta ocasión se cambia la imagen por un icono de Font Awesome en la parte superior.

Es una funcionalidad muy útil, por ejemplo, para crear esas cajas de destacados que tan habitualmente se encuentran en las páginas de inicio de los sitios web.

Cajas de icono en Elementor Page Builder

 

Galería de imágenes

Para mi, otro destacado en las novedades que incluye Elementor con respecto a otros constructores web.

De una forma súper sencilla, puedes incluir en tu diseño galerías de imágenes seleccionando las que quieres que aparezcan en ella, tamaño, número de columnas de la galería, bordes, fondos etc.

Lo único que echo en falta aquí es el hecho de que pudieses crear la galería de imágenes con diferentes formatos (más ordenados o más desordenados de tipo grid, por ejemplo) o clasificar la galería de imágenes en diferentes subcategorías.

Hacer esto último sería un puntazo para crear, por ejemplo, portfolios que al pulsar en un enlace pudieras ver únicamente las imágenes de una determinada categoría de dicho portfolio.

Pero vamos, viendo todo lo que ha hecho Elementor en tan poco tiempo… no descarto que lo acaben implementando. 😉

 

Carrousel de imágenes

Parecido a la galería de imágenes, pero esta herramienta va más enfocada a crear los famosos sliders que tanto vemos en muchos sitios web (y que a mi tan poco me gustan, dicho sea de paso 😛 ).

Tengo que decir que aquí sí que parecen haberse esmerado más los chicos de Elementor, ya que puedes decidir no sólo las diapositivas a mostrar, si no también establecer o configurar los elementos de navegación de las mismas prácticamente a voluntad.

Del mismo modo, tienes la posibilidad de indicar cómo quieres que funcionen las automatizaciones de tu slider: si se pausará su reproducción al poner el ratón sobre él, si se auto-reproducirá, cuantos segundos estará cada imagen en pantalla, cuanto durará cada efecto de transición de imagen a imagen, en qué dirección se irán desplazando las imágenes etc.

No me quito el sombrero porque ya hace tiempo que lo tiré por la ventana. Si no me lo quitaría una y mil veces ante los cracks que han desarrollado este editor visual. 🙂

En fin, prosigamos que aún nos queda un rato…

 

Listado de iconos

O lo que es lo mismo: listas cuyas viñetas son iconos.

Aquí también las opciones de personalización son mucho mayores que en Thrive Content Builder, ya que en él apenas encontrabamos 6 estilos diferentes de lista configurables desde el editor y con sólo 8 colores predeterminados a establecer en ellas.

En cambio, en Elementor dispones de todos los iconos de Font Awesome para diseñar tus listas personalizadas, pudiendo establecer cualquier color que se encuentre dentro del código hexadecimal.

Por si esto fuese poco, el grado de personalización es aún mayor si tenemos en cuenta que puedes establecer un icono para cada elemento de la lista, no teniendo que ser necesariamente todos los iconos de una misma lista iguales.

Vuelvo a hablar desde el punto de vista de los diseñadores cuando os digo de corazón que os quiero mucho, chicos de Elementor. 😀

 

Contador

Otra novedad incluida por Elementor respecto a otros constructores web es esta herramienta de contador con la que podemos crear esas animaciones con las que en muchos blogs o webs se representan datos.

Las opciones de configuración de este elemento una vez más son sensacionales, pudiendo establecer el texto que aparecerá debajo del contador, el número de inicio y fin del mismo, prefijo o sufijo del número y duración de la animación en su proceso de llegar hasta el número máximo a contar.

 

Barra de progreso

Otro elemento muy interesante añadido por este editor visual es este de las barras de progreso.

Seguro que las has visto en más de una ocasión: son esas barras que se van llenando con un porcentaje, muy utilizadas, por ejemplo, para mostrar gráficamente el grado de habilidades o conocimientos de un freelance o una empresa en una materia determinada.

Elementor te permite configurar también desde su editor todo lo referente a estas barras: porcentaje a establecer, colores, texto que aparecerá en el interior o si quieres establecer un título para dicha barra en el exterior de la misma.

 

Recomendación

El nombre de este elemento no es demasiado descriptivo en realidad, ya que hace referencia a implementar testimonios de personas y clientes acerca de tu marca o servicios.

Personalmente, aquí si que pienso que Elementor ha dado menos opciones predeterminadas que Thrive Content Builder para que cueste menos esfuerzo diseñar unos testimonios de clientes chulos.

Pero también hay que decir que combinando esto con otros elementos o con las propias opciones de diseño de esta herramienta (fondos, bordes, márgenes etc.)  se puede hacer prácticamente cualquier cosa que se te ocurra en este sentido. Así que tampoco lo veo algo tan grave. 😉

 

Pestañas

En esta ocasión sí que creo que no hace falta explicar mucho más: esta herramienta te facilita la posibilidad de que puedas crear contenido dividido en diferentes pestañas de una manera cómoda y fácil.

Puedes añadir tantas como gustes y, al igual que sucede con la mayoría de elementos, tienes la posiblidad de configurar el diseño de las mismas a voluntad en cuanto a colores, tipografías, espaciados etc.

 

Acordeón

Un elemento muy similar a las pestañas, pero con la diferencia de que en esta ocasión todos los textos incluidos en cada una de las partes están ocultos y la estructura de todos ellos se forma de manera vertical.

Para que lo visualices mejor, es exactamente como yo tengo hecha la sección “Preguntas Frecuentes” en la página de mi servicio de diseño web en WordPress Plan Blog Brazos Cruzados.

Cuenta con ajustes de diseño y configuración similares a las pestañas para dejar todo a tu gusto, con lo que no me voy a repetir más en este sentido que bastantes palabras llevo ya a estas alturas como para meterte “relleno”. 😛

 

Alternar

Otro tipo diferente de elemento “Acordeón”.

La única diferencia que veo al respecto de este es que el icono que aparece a la izquierda de cada uno de los cuadros que lo conforman es una flechita en vez de un simbolo de suma (+).

 

Iconos sociales

Permite la inclusión de iconos de redes sociales en cualquier parte de tu diseño, pudiendo ser utilizados para enlazar los mismos desde tu sitio web.

Hay que decir que incluye hasta 27 iconos de redes sociales diferentes, con lo que es muy raro que no puedas enlazar las que tú usas, incluso si son algunas menos habituales como SoundCloud o GitHub. 😀

Para cada uno de ellos, puedes establecer si quieres que el icono aparezca de forma cuadrada, con los bordes redondeados o circular, así como elegir entre el color oficial de cada una de las redes sociales en cuestión o personalizar los colores de estos iconos a tu gusto (o, mejor dicho, en línea con tu diseño).

También puedes escoger el espaciado entre cada icono o el relleno de los mismos decidiendo su tamaño.

Vamos… lo que quieras y se te ocurra como quien dice. Si no creas unos iconos a redes sociales únicos y exclusivos con Elementor, será porque no quieres. 😉

 

Alerta

Sirve para crear textos destacados inmersos en una caja de color que el usuario puede cerrar en un momento determinado cuando le plazca (o no, si decides desactivar esta opción).

En ella, además de las opciones de diseño comunes a otros elementos, puedes también determinar si quieres que aparezca un borde en la parte izquierda de la misma (concretando tu también su ancho, color, etc. que más te interese).

 

SoundCloud

A mi, personalmente, el hecho de que hayan incluido este elemento ya sencillamente me parece la caña. Demuestra el grado de perfección en cuanto a número de posibliidades que desean ofrecer los desarrolladores de Elementor Page Builder.

Con esta herramienta puedes incluir un archivo de audio de SoundCloud, algo muy útil si tu web está relacionado con la música, la radio o si tienes un podcast y subes tus ficheros de audio a esta plataforma.

Pero esto no se queda aquí…

Podrás controlar si autoreproducir el audio, mostrar (o no) botones de compra, descarga, me gusta, compartir, comentarios, número de reproducciones, colores de los controles… ¿sigo?

Voy a ir buscando el núemro de un escultor para que les haga un monumento a estos chicos de Elementor. 😀

 

Shortcode

Por si los elementos anteriores te saben a poco, ahora vamos a ver ya las opciones de integración total con cualquier otra cosa (plugin, widget o lo que sea) que se te ocurra.

El primero de ellos es la posibilidad de incluir shortcodes (esos fragmentos de código que te dan plugins tan utilizados como el Contact Form 7 o el Thrive Leads para crear formularios de suscripción).

Evidentemente, como ya te habrás dado cuenta, esta posibilidad te abre la puerta a colocar multitud de funcionalidades directamente en tu diseño creado con Elementor Page Builder, ya que es una muy buena vía para poder utilizar dentro de él plugins externos que nada tienen que ver con él.

 

HTML

Lo mismo sucede si, por cualquier otra razón, necesitas incluir código HTML creado por ti mismo.

Elementor no pone trabas en este aspecto y para ello te facilita esta herramienta llamada “HTML” con la que podrás incluir tus propias personalizaciones si es que eres diseñador o desarrollador web (o, simplemente, si tienes unos conocimientos mínimos de código).

 

Ancla de menú

Otra de las herramientas que me ha dejado con la boca abierta es precisamente esta llamada “Ancla de menú”.

De hecho, me ha hecho caer en la cuenta de esta “deficiencia”, provocando mi reflexión sobre cómo algo tan sumamente sencillo no pudiese estar implementado en Thrive Content Builder en todo este tiempo que lleva en el mercado.

Gracias a ellas puedes establecer un nombre a una determinada sección dentro de tu página.

Y tu pensarás… ¿y eso para que narices sirve? ¿Qué tiene de especial?

Bien, pues tiene de maravilloso que estas anclas son la base para poder crear diseños de una sola página (One Page Design), de tal forma que puedas indicar en tu menú principal hacia que sección de dicha página se debe dirigir al pulsar el enlace haciendo ese efecto de “scroll” hacia abajo o hacia arriba que es tan molón.

Vaya por delante que no soy amigo de estos diseños One Page porque creo que perjudican al SEO de tu página, pero está bien que incluyan esta posibilidad a la hora de diseñar porque es cierto que este tipo de webs son muy atractivas visualmente hablando (y perfectas para dispositivos móviles).

No sé cuantos puntazos a su favor lleva Elementor a estas alturas, pero este es uno más sin duda.

 

Barra lateral

Otra vuelta de tuerca de Elementor Page Builder de cara a la personalización de tu diseño es el hecho de poder incluir una barra lateral en el lugar que te plazca de tu diseño sin necesidad de que esta ocupe todo el alto de la pantalla.

De esta forma, puedes seleccionar cualquier posición de widgets que se antoje y mostrarla donde te de la real gana.

Por ejemplo, en el caso de GeneratePress puedes incluir donde quieras y como quieras los widgets que incluyas en la barra lateral derecha, la barra lateral izquierda, cabecera o en cualquiera de las 5 posiciones que tienes disponibles en el pie de página a modo de bloque.

¿Cómo dices? ¿Que qué pasa si quieres incluir un único widget sólamente?

Sin problema, amigo mío. En esto también ha pensado Elementor. Échale un ojo a la siguiente herramienta. 😉

 

WordPress

En esta zona cuya cabecera ocupa el nombre de nuestro querido gestor de contenidos, podrás encontrar de manera individual todos los widgets que puedes colocar y que los plugins que tengas instalados te permitan implementar.

Sí, sí… lo has entendido bien.

Puedes usar tus widgets en cualquier parte de tus páginas o entradas.

Llegados a este punto, no sé tú pero yo ya estoy haciendo la ola a estos fueras de serie que han creado el plugin Elementor.

Pero espera… que aquí no ha terminado esto.

 

Opciones generales de Elementor Page Builder

¿Recuerdas que te dije que todo lo mencionado anteriormente era accesible desde el icono de la parte superior derecha de Elementor?

Si, ¿verdad?

Pero… ¿te has percatado que en la parte izquierda hay otro icono?

Opciones generales en Elementor Page Builder

Si lo pulsas, verás que a través de él podrás establecer opciones generales para tu diseño sin tener que repetirte como si fueses una sopa de ajo.

Esto es, puedes establecer los parámetros por defecto que se te antojen para tu diseño:

Colores globales, definiendo tu propia paleta de colores o seleccionando una de las predeterminadas que Elementor pone a tu disposición.

Fuentes globales, escogiendo tus tipografías por defecto para texto normal, diferentes encabezados o títulos (h1, h2,h3) y peso de las mismas.

Selector de color, para que puedas elegir previamente tu paleta de colores y sean estos los colores que te aparezcan en las opciones de Elementor a la hora de estar diseñando cualquier elemento de la web. Más personalizado imposible. 😀

Configuración de Elementor, el cual es un enlace hacia la página de configuración del plugin dentro de tu WordPress.

Dentro de ellas, puedes seleccionar los tipos de entradas donde vas a querer o poder utilizar Elementor Page Builder, qué tipo de usuarios tendrán permitido utilizarlo, decidir si quieres heredar las paletas de color o tipografías establecidas por defecto en tu plantilla o elegir el ancho de la caja del contenido que mostrará los contenidos que no selecciones como visibles a ancho completo de la pantalla.

Tutorial sobre Elementor Page Builder

Historial de revisiones, una función para poder volver atrás si te equivocas en algún momento al hacer algo. A día de hoy, en el momento que escribo este artículo, no está todavía implementada aunque aparezca en el menú.

Eliminar todo el contenido, para resetear el diseño de una página o entrada por completo si así lo deseas y comenzar de nuevo a crearla desde cero.

Sobre Elementor, que lo único que hace es la función de enlazar el editor visual hacia la web de los desarrolladores.

¿Cómo vas? ¿Estás cansado?

Yo te reconozco que un poco de tanto escribir. 😛

Pero me he propuesto crear la mayor review / tutorial sobre Elementor Page Builder y aún me quedan algunas cosillas en el tintero que comentar.

Por cierto, son muy interesantes. Más aún si como yo eres diseñador o desarrollador web. 😉

 

Opciones responsive y de plantillas

Vamos a irnos a la última sección del Elementor Page Builder, que es la que se encuentra justamente en la parte inferior del mismo en una barra pequeña gris que contiene 4 iconos.

Opciones de diseño web responsive en Elementor Page Builder

El primero de esos iconos es un aspa en forma de X que simplemente sirve para cerrar el editor y volver a tu panel de administración de WordPress.

Hasta aquí, no hay ningún misterio ni nada destacable, de acuerdo.

Pero a partir del siguiente icono la cosa ya se pone más interesante…

En el segundo de los iconos, al pulsarlo, puedes seleccionar la vista que prefieras para establecer como se verá el diseño de las páginas o entradas de tu blog o web en versiones de escritorio, tablets o móviles.

Pero no es un simple visualizador.

La magia de esto es que para cada una de estas vistas… ¡puedes establecer unas opciones determinadas que cambiarán el CSS de tu diseño dependiendo del tamaño de la pantalla elegida!

Es decir, no te hará falta saber sobre media queries para adaptar fácilmente el diseño de tu blog o tu web a dispositivos móviles.

Por ejemplo, puedes establecer para cualquier elemento de tu diseño que en la versión de escritorio tenga un margen y un padding determinado, mientras que en la versión de tablet tenga otro distinto y otra variante más en tu versión móvil.

De esta manera puedes adaptar a voluntad desde el editor absolutamente todo, independiemente del dispositivo en el que se vaya a mostrar tu página web.

De verdad, esto para mi ha sido ya la guinda del pastel.

Ningún otro plugin o herramienta de este tipo que yo conozca te permite controlar a través de ellos el diseño de las versiones de tablets y smartphones, con lo que esto me parece un adelantamiento a la velocidad de la luz en toda regla por parte de Elementor Page Builder con respecto a otros constructores web o editores visuales.

El tercer icono de este mini-menú corresponde al acceso directo a toda la documentación oficial publicada sobre Elementor.

No está de más que le eches un ojo detenidamente, ya que en este sentido los creadores del plugin también se han esmerado y poseen una cantidad importante de información que responde a muchas dudas que puedas tener al respecto de su funcionamiento el de las herramientas contenidas en él.

Por último, el cuarto icono te permitirá diseñar tus páginas o entradas a partir de plantillas prediseñadas con Elementor Page Builder (a día de hoy un total de 26 ya están disponibles para ser utilizadas), así como a guardar tus propias plantillas y poder importarlas en otros proyectos que te interese hacerlo.

Plantillas incluidas en Elementor Page Builder

 

Comparativa y ventajas frente a Thrive Content Builder

Si has llegado hasta aquí, te habrás dado cuenta que ya sobre la marcha he ido comparando Elementor con Thrive Content Builder en algunos de sus aspectos o herramientas que los diferencian.

Sin embargo, en este último punto quiero destacar de una forma más generalizada los aspectos en los que este editor aventaja, bajo mi punto de vista, al editor visual de Thrive Themes, así como también reseñar en los que creo que aún supera el segundo al primero.

Comparativa entre Elementor Page Builder y Thrive Content Builder

 

Secciones a ancho completo de pantalla

Aquí creo que Elementor ha pegado una “barrida” importante a Thrive Content Builder, ya que en este la única manera de crear secciones a ancho completo era o bien utilizando una plantilla de landing page que ya las tuviera, o bien adquiriendo algún tema de Thrive Themes.

Con Elementor este problema desaparece por completo. Puedes crear tus secciones sin problemas en unos pocos clics sin tener que adquirir nada en especial (salvo una plantilla que sea compatible con esta funcionalidad como, por ejemplo, lo es GeneratePress).

Incluso si tu plantilla no permite este tipo de secciones, también tienes una solución a tu problema: utilizar el plugin Elementor Page Templater , el cual añadirá un par de plantillas más a Elementor que te permitirán crear estas secciones a ancho completo sin problema alguno.

El único “pero” (por poner uno) que le pongo es que no han creado una opción para que estas secciones a ancho completo puedan diseñarse bajo el efecto conocido como parallax.

Pero tranquilo, porque esto no es un problema demasiado grave, ya que si usas GeneratePress puedes usar sus secciones a ancho completo para realizar dicho efecto o, incluso, con un poquito de código CSS por tu parte se puede llevar a cabo esto sin problema dentro del propio Elementor.

 

No tienes que cargar a propósito tipografías específicas o iconos

A mi personalmente se me hacía un poco tedioso en Thrive Content Builder el hecho de que, para utilizar frecuentemente una tipografía concreta dentro del editor o unos determinados iconos, primero tuviera que cargarlos en la parte correspondiente de la herramienta que se encontraba fuera de la pantalla de maquetación.

Con Elementor Page Builder esta incomodidad también desaparece, ya que puedes utilizar directamente todas las tipografías de Google Fonts y los más de 400 iconos disponibles de Font Awesome sin previa carga o subida en un fichero .zip de estos últimos.

 

Muchas más opciones de CSS avanzadas sin tocar código desde el editor y animaciones

Para cualquier herramienta de las que te he enseñado antes en Elementor, las opciones de personalización y diseño son mucho mayores y más avanzadas en su editor que las que puedes encontrar en el de Thrive Content Builder.

Se puede decir que la versatibilidad es infinitamente superior en este sentido, que realmente han pensado en que prácticamente cualquier cosa se pueda hacer de manera visual. Sin grandes impedimentos o barreras independientemente de que sepas más o menos código.

Thrive Content Builder también conseguía esto, pero es cierto que es más limitado y que, para según que cosas, requiere de que conozcas un poco de CSS o HTML para dar una personalización máxima sin que parezca a simple vista que tus páginas están hechas bajo dicho plugin.

 

Posibilidad de bordes y fondos personalizados en cualquier elemento de tu diseño

En este punto también pienso que Elementor Page Builder ha dado una buena vuelta de tuerca con una pequeña pero muy útil modificación como es la de poder aplicar bordes y fondos a cualquier elemento de diseño que construyas con el editor.

Es una manera muy simple y sencilla de crear títulos más llamativos o diferentes, ampliando bastante el horizonte de posibilidades que Thrive Content Builder ofrecía en este sentido.

 

Más facilidad para controlar tu diseño web responsive

Creo que es la tercera vez que recalco esto y, por ello, no voy a ahondar más de lo que ya lo he hecho en el tema.

Pero si que quería volver a destacarlo porque el hecho de que puedas controlar tan al milímetro los estilos y el diseño de tu blog o web en tablets y teléfonos móviles me parece una bestialidad por parte de Elementor y un claro aspecto diferenciador respecto a su competencia directa.

 

Más herramientas o elementos individuales tremendamente útiles y mejora de lo que ya había

Espaciadores, secciones, galerías y sliders de imágenes, contadores, barras de progreso, iconos sociales, incursión de ficheros de audio y podcast, anclas de menú…

Realmente Elementor se ha esmerado en incluir muchas cositas que, aunque pueden parecer insignificantes, realmente la suma de todas ellas te facilitarán mucho la vida a la hora de dejar tu blog o tu web tal y como tú deseas.

No sólo eso: todos los elementos que ya incluía Thrive Content Builder los ha mejorado en cuanto a facilidad de implementación, opciones de estilo u opciones de diseño.

Es lo que he dicho anteriormente: han pensado en diseñadores o desarrolladores pero sin dejar de lado a la gente que no tiene tantos conocimientos técnicos. Y ambos perfiles agradecerán todas estas incursiones.

Lo único que más he echado en falta en este sentido con respecto a Thrive Content Builder ha sido la posibilidad de incluir un “grid” con los últimos artículos del blog o los artículos más destacados, una herramienta muy útil y que yo he usado mucho en mis diseños con el editor de Thrive Themes.

Pero esto también se puede solucionar facilmente con el plugin WP Show Posts (también creado por Tom Usborne, el padre de GeneratePress), el cual es 100% compatible con Elementor Page Builder. Con lo cual, tampoco es un obstáculo insalvable ni una situación para dramatizar con ella. 😉

Del mismo modo, Thrive Content Builder tiene la opción de incluir en tus diseños botones para compartir directamente en redes sociales tus páginas o artículos, algo que he echado en falta en Elementor (aunque supongo que esto lo incluirán en la versión de Elementor Pro).

 

Mejor rendimiento y rapidez

Es cierto que no lo he utilizado tanto como Thrive Content Builder, pero la sensación que me ha dejado Elementor en las primeras pruebas es que está bastante mejor optimizado en cuestiones de rendimiento y velocidad.

Carga rápido, no se queda pillado, no desaparecen opciones misteriosamente sin motivo aparente… ni siquiera me ha dado fallo alguno hasta ahora.

Mi sensación es que los desarrolladores de Elementor Page Builder han trabajado en esto a conciencia para mejorar la experiencia de todo el que utilice su editor. Y mi opinión es que lo han logrado al 100%.

 

El precio

En este punto la goleada por parte de Elementor Page Builder es de escándalo, ya que como te he dicho antes es gratuito.

Aunque, sinceramente, aunque fuese de pago, también diría que ganaría a Thrive Content Builder si valiese lo mismo o un poco más (para mi, solo perdería si el precio que estableciesen se subiese muchísimo a la parra, obviamente).

Dicho esto, estoy esperando con ganas la versión premium que van a sacar a partir del próximo diciembre (de hecho, ya la he adquirido en pre-venta) para ver con qué nos sorprenden, porque pienso que si ofrecen todo esto gratis… ¡imaginate lo que llegarán a darnos a cambio de unos cuantos euros!

 

Conclusión

Creo que Elementor Page Builder ha llegado para quedarse. Y ha entrado pisando fuerte quitándole el trono a Thrive Content Builder en estos momentos (a noviembre de 2016).

En cualquier caso, hay rumores que los chicos de Thrive están preparando una mega actualización con la que piensan seguir siendo, como lo son (o eran) hasta ahora, el número 1 de los editores visuales para WordPress.

También habrá que ver que ofrecen entonces, pero la verdad es que Elementor ha puesto el listón muy alto.

La batalla entre estos dos gigantes está servida. ¡Hagan sus apuestas!

Ahora te toca a ti. Déjame en los comentarios lo que piensas sobre todo lo que te he contado aquí de este nuevo constructor web llamado Elementor Page Builder.

Si lo pruebas, mejor aún. Déjame tus impresiones: lo que más te ha gustado, lo que menos, lo que crees que le falta y tu incluirías… ¡lo que sea! Cualquier cosa para seguir compartiendo opiniones sobre esta pedazo de herramienta un poco más abajo. 😉

Elementor Page Builder: review + tutorial y comparativa con Thrive Content Builder
5 votos | Media: 4.2
José Antonio Carreño
Diseñador web freelance especializado en el CMS Wordpress. Ayudo a bloggers, negocios unipersonales y emprendedores digitales a crear un blog profesional atractivo cuyo diseño esté orientado a conseguir conversiones. También te echo una mano a través de mi blog escribiendo artículos, consejos, reviews o tutoriales en los que te hablo sobre temas referentes a Wordpress, diseño web y blogging
José Antonio Carreño
- 1 hora ago
José Antonio Carreño
José Antonio Carreño

93 comentarios en “Elementor Page Builder: review + tutorial y comparativa con Thrive Content Builder

  1. Hola José Antonio.

    La verdad es que por todos lados se está hablando de elementor y no es para menos. Me parece un bombazo y mucha más siendo gratuito.

    Muchas gracias por la reseña que has hecho, es muy útil (bueno en general todo lo que escribes). Te has convertido por derecho propio en una referencia para mi.

    En breve me pondré con elementor page builder estoy seguro que me va a dar muchas alegrías.

    Un saludo ;9

    • Hola Israel,

      Pues sí, Elementor es un auténtico bombazo en toda regla. Tanto es así que yo me he lanzado enseguida a comprar la versión Pro que sale el 12 de diciembre y estoy esperando con ansia todo lo que puede ofrecer (que estoy convencido que será mucho. Y eso que ya lo que ofrecen gratis es una barbaridad).

      Gracias a ti por pasarte a leer el artículo y dejarme tu opinión al respecto. Yo también estoy convencido que Elementor nos va a dar muchas alegrías de aquí en adelante. 🙂

      Un abrazo!

  2. bueno, es genial, solo he podido leerlo a la mitad, ya que estoy priorizando, pero me lo he instalado y lo voy a empezar a utilizar, esta en mi lista de proximas tareas, para no dejar cosas a medias, una vez mas gracias por esta info que nos das de manera tan detallada , lo compartire en mis redes

    • Hola Mario,

      Si te ha parecido genial sólo leyendo la mitad de lo que puedes hacer… ¡verás cuando lo pruebes! De verdad que yo desde que lo he descubierto estoy como un niño con zapatos nuevos. 🙂

      Muchas gracias por pasarte a comentar y mil gracias más por compartirlo en tus perfiles de redes sociales. 😀 ¡Un abrazo!

    • Hola Adela,

      Sí, Elementor también puede ser utilizado en las entradas tal y como digo tanto en el vídeo como en el artículo.

      Sin embargo, también es cierto que nunca recomiendo utilizar para las entradas del blog un maquetador visual. ¿El motivo? Precisamente esto que ha pasado entre Thrive Content Builder y Elementor.

      Ponte en situación: si sale otra herramienta dentro de un año o dos (o el tiempo que sea), quieres cambiar a ella y has estado maquetando los artículos de tu blog con el maquetador visual que quieres dejar de utilizar… recuperar ese trabajo va a ser tarea de chinos (por no decir prácticamente imposible).

      Un abrazo!

  3. Hola José

    Simplemente pasaba a comentarte que gracias a tu recomendación comencé con GeneratPress, y la verdad muy contenta con este theme.

    Con respecto a este pluguin, al igual que tú lo recomiendo , es muy intuitivo. La verdad es excelente, si así lo es en su versión gratuita, no quiero imaginar cómo será en su versión premium.

    Me queda una duda.

    ¿ Sabes si es incompatible con algún pluguin?

    Mil gracias.

    • Hola Lina,

      Como ya he dicho antes, la verdad es que estoy muy expectante ante esa versión Premium que sale el 12 de diciembre. Seguramente cuando salga, ya contaré por aquí mis impresiones acerca de ella para que cualquiera pueda ver en que mejora la versión gratuita.

      En principio, no conozco de ningún plugin en concreto con el que sea incompatible. Hasta el momento no me he topado con ningun conflicto de este tipo aunque, por supuesto, ante la cantidad de plugins existentes tanto en el repositorio de WordPress como Premiums, no puedo asegurar al 100% que no haya ni una sola incompatibilidad como estas que tú mencionas.

      En cualquier caso, si detecto alguna, actualizaré la review y la pondré sin problema. Y lo mismo os pido a vosotros, los lectores del blog: si detectáis alguna incompatibilidad dejarlo por aquí en un comentario para que todos estemos al corriente. 😉

      Gracias a ti! Un abrazo!

  4. Hola Jose Antonio,

    Gracias por hacer un post tan completo y sencillo de entender. ¡Eres muy generoso!

    Me parece una herramienta brutal por todo lo que comentas. Yo utilizo Thrive Content Builder desde hace tiempo y estoy contenta pero probaré Elementor 😉 Ya te contaré mis impresiones. ¡Feliz Día!

    • Hola María Jose,

      Eso que dices de contar tus impresiones cuando lo hayas probado estaría genial. Me encanta que lo hagáis para que también se muestre el punto de vista de personas que no son diseñadores ni tienen un perfil técnico como tal. ¡Ya nos contarás! 😉

      Un abrazo!

  5. Muy bueno este tutorial, siendo una potente herramienta de trabajo. Me ha encantado y me la he instalado, pero tengo un problema:
    Al añadir un nuevo plugin y siguiendo tus instrucciones, a mi se me descarga una version de Elementor Page Builder con el menu de inicio en Ingles.
    Luego al pinchar en cualquiera de ellos, el contenido me sale los encabezados en Español y el Texto en Ingles.
    Por favor, podrías indicarme donde me he equivocado o si hay algún sistema para cambiar el idioma,
    Muchas gracias por tu atencion

    • Hola Daniel,

      En principio, yo no tuve que hacer nada especial para que el plugin me apareciese en español. ¿Tienes configurado el idioma de tu sistema WordPress como español o instalaste la versión en inglés? Es probable que si hiciste lo segundo, el plugin te esté cogiendo el idioma por defecto de tu WordPress y por eso te aparezcan los textos en inglés. 😉

      Gracias a ti! Saludos!

  6. Hola José Antonio.

    Una duda respecto a Elementor. Una vez maquetado todo a tu gusto, si eliminas el plugin, pierdes todo? Me refiero a si tiene locking.

    Un saludo y muchas gracias!!

    • Hola Óscar,

      Sí, supongo que al igual que ocurre con Thrive Content Builder, si creas páginas o entradas con Elementor y luego lo desinstalas, lo único que te aparecerá en dichas páginas y entradas serán unos bonitos códigos..jeje!

      Ten en cuenta que cada maquetador visual tiene sus propias estructuras HTML y clases CSS predefinidas que van implícitas en los ficheros del plugin, por lo que es normal perder todo si lo desinstalas.

      Saludos!

  7. Hola, José Antonio.

    En primer lugar, darte las gracias por habernos dado a conocer esta gran herramienta (en mi caso estaba pensando comprar Thrive Content Builder y de momento parece que me voy a ahorrar ese dinero).

    Estoy elaborando una landing page en la que quiero recabar algunos datos de los visitantes (nombre, e-mail, y dos o tres datos más) para poder enviarles después un presupuesto, pero no se como hacer para incluir el formulario directamente desde el editor; si lo hago editando desde WordPress no me sale.

    ¿Me puedes ayudar?

    Gracias.

  8. Hola !

    Es un artículo épico….felicidades !!!

    Yo estoy aprendiendo mucho sobre wordpress y ahora genesis…estaba por comprar el famoso Thrieves Builder….pero he encontrado este maravilloso plugin Elementor…

    Lo he instalado pero me está pasando un pequeño problema….con las entradas me funciona pero con las páginas no.
    Me dice que debo llamar la funcion “the_content” en la plantilla actual….debo decir que estoy trabajando sobre la Flymag
    Me preguntó a que se refiere con llamar ? claramente sé que debo modificar el código de la plantilla pero qué parte exactamente,,,,, Sí pudieras guiarme sería genial !

    Saludos !!!

    • Hola Carolina,

      Puede que el problema que tienes se daba a alguna incompatibilidad con tu plantilla en concreto. Deberías buscar entre los ficheros del tema que estás utilizando y buscar uno que se llama page.php, a ver si hay localizas algo que pueda estar entorpeciendo el uso de Elementor con tu theme.

      Aunque, sinceramente, me resulta raro que con las entradas te funcione y con las páginas no. Pienso que si fuese incompatible, sería incompatible con todo y no sólo con las páginas. 😉

      ¡Saludos!

  9. Hola, hoy acabo de descubrir GeneratePress gracias al blog de Arturo García y he acabo aquí para ver tu review. Los dos me habéis convencido . Con Elementor acabo de ver la versión premium y no sé hasta que punto merece la pena. No es barata (199€ si la quieres para varias páginas, lo cual es mi intención) y solo entra soporte y actualizaciones durante un año, lo que quiere decir que si incorporan nuevas funcionalidades y ya ah expirado el tiempo tendrás que volver a comprarla, lo cual me parece absurdo. Imagino que tu ya la habrás trasteado, ¿merece la pena la inversión o con la versión gratuita es más que suficiente?

    Gracias!

    • Hola Cati,

      Pues precisamente tengo pendiente hacer una review sobre las características de Elementor Pro para ayudarte a tomar la elección que comentas. Esta versión si que incluye nuevas funcionalidades y mejoras interesantes. Para hacerte una idea, y hasta que escriba esta review que te comento, puedes pasarte por la página de Elementor Pro en la cual te dicen todo lo que incluye la misma. Por el blog del plugin o por su canal de Youtube también hay información adicional al respecto.

      No obstante, aclararte (aunque creo que ya lo sabes por lo que comentas) que esa licencia es para desarrolladores (es la que yo tengo). Cuesta 199$ al año, exacto. Pero se supone que si eres diseñador o desarrollador de sitios web, el ahorro de tiempo que te va a suponer utilizar esta herramienta y los ingresos que vas a generar a raíz de ella, compensan lo que vas a invertir en la misma.

      Por tanto, eso tienes que valorarlo tú misma si te compensa o no comprarla.

      Gracias por dejar tu comentario. ¡Un abrazo!

  10. Hola Jose! muy interesante tu completisimo articulo acerca de esta herramienta. Yo vengo usando LiveComposer para realizar este tipo e websites personalizados casi al 100%, con lagunas limitantes del plugin en sí… veo que este es much mas fácil de usar, pero no me queda claro una cosa (no sé si me lo perdí en tu explicación):
    Puedo tamien generar Templates/Plantillas para las secciones de contenido? es decir, diseñar un para seccion de contenido, otra para un home, etc etc… y de ser así, me permite la libertad de crear mis propios Header(incluyendo estilos de menus) y Footers?…
    Gracias de antemano!!!

    • Hola David,

      Con Elementor puedes crear cualquier tipo de páginas personalizadas y no sólo eso. También puedes guardarlas como plantillas y reutilizarlas en ese mismo blog o en otro. Es una herramienta pensada para ayudar tanto a personas con pocos conocimientos como a diseñadores y desarrolladores y ahí está su gran fortaleza. Ha pensado en todo tipo de usuarios.

      Resumiendo: puedes generar perfectamente tus propios templates. Del mismo modo, tienes varias plantillas predeterminadas que también puedes utilizar. Es más, este repositorio se va actualizando. Hace pocas fechas insertaron algunas plantillas predeterminadas más.

      En cuanto a la parte de headers y footers, esto es más bien misión de Generatepress. En cualquier caso, teniendo Generatepress con sus addons premium, puedes eliminar de una página concreta la cabecera por defecto que hayas establecido y crear tu propio menú con Elementor para una página determinada (creo que es esto lo que me preguntas).

      Gracias a ti por leer y comentar. ¡Saludos!

  11. Hola José Antonio:

    Muchas gracias por tu artículo. Es de gran ayuda. Me queda una duda, que no sé si puedes revolverme. ¿Elementor permite el uso al tributo Alt para describir imágenes? Te lo comento porque lo he instalado, he hecho una prueba, pero al pasar el ratón sobre la foto no muestra el texto alternativo.

    Salu2,

  12. Hola amigo Jose Antonio, grandioso articulo. Confieso que me he enamorado de esta herramienta quería hacerte algunas preguntas sobre ella. Quería saber si puedes añadir una librería de iconos adicional aparte de la que ya incluye para colocar iconos personalizados o es mejor usar para esta finalidad la caja de imagen.

    Mil gracias, por tan estupendo articulo.

    Saludos

    • Hola Isabel,

      Hasta donde yo sé, la función de implementar una librería adicional como tal no está disponible en Elementor. En cualquier caso, tienes una cantidad enorme de iconos para elegir dentro de él.

      Si necesitas o quieres poner diferentes iconos, siempre te queda la posibilidad de incluirlos directamente como imágenes en tus diseño. 😉

      ¡Saludos!

  13. Wow jose realmente este plugin es la caña, yo vengo de trabajar con puros themes de themeforest y como editor visual el visual composer, que venga hasta ahora he podido hacer todos los trabajos para la empresa que trabajo dentro de todo bien, pero si tenemos que tocar siempre mucho codigo para hacer realmente personalizaciones mas a fondo. Recientemente como te he comentado me he suscrito a tu blog y visto tus tutoriales etc, y he visto este que es mas reciente que el de thrive y venga acabo de instalar hace poco el generate press y hoy el elementor y lo poco que he ido probando va de maravillas, quiero renovar mi web totalmente, venia usando una plantilla de themeforest muy famosa, realmente la web quedo muy bonita a nivel visual pero no he recibido el feedback buscado, espero poco a poco ir conviritnedola en una web mas util gracias a tus aporte y experiencia.

    Saludos.

    • Hola Rosa,

      La combinación Generatepress + Elementor, incluso la de Generatepress + Thrive Content Builder, es infinitamente superior a la mayoría de temas que puedes encontrar en Themeforest. O, al menos, esa es mi humilde opinión y lo que me dice mi experiencia. La flexibilidad en cuanto a opciones y diseño y la facilidad de uso de cualquiera de estas combinaciones no es ni comparable.

      Estoy seguro que, en cuanto lleves un tiempo probando estas dos herramientas, te vas a enamorar perdidamente de ellas igual que yo u otros diseñadores. 😉

      ¡Saludos!

  14. Gracias Jose por esta fabulosa informacion, por tu sugerencia ya tengo Elementor y Generatepress, la informacion es perfecta pero creo que falle en algo, no me funciona nada, al clickear sobre agregar nueva seccion no me da la grafica que expones sino un texto “ELIGE TU ESTRUCTURA” pero no se donde. De todas formas es mi novatada. Saludos
    Al

    • Hola Al,

      En el minuto 28 del vídeo con mi tutorial se explica esta parte que comentas. Al pulsar en “Nueva sección”, efectivamente, te aparece un mensaje en el que te pide elegir la estructura que quieres para esa sección (ancho completo, en 2 columnas, en tres, etc.). Simplemente tendrías que seleccionar una de estas estructuras y empezar a trabajar con los elementos que quieras insertar en la sección. No tiene más.

      Si no te salen estas opciones para elegir estructura, puede que no se haya instalado bien el plugin (en cuyo caso, te aconsejo que lo desinstales por completo y lo vuelvas a instalar), que haya algún tipo de incompatibilidad con otro plugin que tengas instalado (compruébalo desactivando todos los plugins momentáneamente menos el de Elementor y mira si así funciona o no) o que la versión de PHP de tu hosting sea inferior a la recomendada por Elementor para que este funcione (debe ser como mínimo la 5.4).

      Saludos!

  15. Hola José Antonio…
    llego por aquí buscando en google info sobre Elementor y me encuentro con este megatutorial… gracias por compartir tu trabajo.

    Me queda la duda si… ¿es posible crear páginas de lanzamiento de productos con videos y webinars con Google Hangouts y chat en vivo o requerirá otro plugin para lograrlo?

    Saludos.

    • Hola Francisco,

      Claro que puedes crear landings de lanzamiento de productos con incursión de vídeos. Para eso tienes los elementos de incluir código HTML, por ejemplo. Con esa herramienta puedes incluir fragmentos de código HTML que te faciliten otras plataformas (como por ejemplo puede ser Youutube) e incluir vídeos si así lo deseas. También dispones de la herramienta “Vídeo” como se indica en la review. 😉

      Saludos!

  16. Gracias José Antonio…
    Voy a echarle un ojo. Aún me queda la duda si se puede tener un chat en vivo cuando se este impartiendo el webinar, por aquello de las preguntas en vivo durante la presentación.
    Genial tu blog…

  17. Hola.

    Antes que nada, muchas gracias por este tutorial tan completo.
    Tengo una duda. ¿Se puede utilizar solamente para crear una página y junto con otra plantilla? Por ejemplo, yo utilizo la plantilla Dante, que me ofrece muchas opciones. Tengo el tetxo de la página de ventas, y ahora toca montarla. ¿Puedo utilizar Elementor solo para esa página?

    Gracias.

    • Hola Toni,

      Elementor, teóricamente según sus desarrolladores, puede utilizarse con cualquier plantilla. De hecho, su slogan reza lo siguiente: “Any Theme. Any Page.” (Cualquier tema, cualquier página). 😉

      Sin embargo, sí que te digo que dependiendo de la plantilla que tengas, podrás desactivar por ejemplo en una página concreta la cabecera o el menú de navegación principal que uses normalmente para hacer un diseño tipo landing sin distracciones. Por ejemplo, con Generatepress, que es la plantilla que utilizo yo, esto es posible gracias a sus addons, con lo que hacer una landing page no tiene complicación alguna en este sentido.

      Saludos!

  18. Hola a tod@s!
    Uso desde hace poco Elementor en mis proyectos web y lo cierto es que estoy muy satisfecho por sus posibilidades en diseño. Ahora bien, estoy intentando usar algún plugin para que aparezcan Pop-ups y nada, me da errores y no funciona.
    He probado con unos cuantos y no hay manera ¿Alguien sabe de alguno (gratuito) que funcione bien con elementor?
    Muchas gracias!!!

    • Hola Alex,

      Gratuito no sabría decirte, porque yo hace tiempo que el que utilizo para todo el tema de formularios de suscripción y demás es Thrive Leads, que es de pago. Eso sí, para mi a día de hoy es el mejor del mercado para esta tarea y no me ha dado ni un solo problema de compatibilidad con Elementor como los que cuentas tú.

      Te dejo aquí una guía sobre el plugin que te comento por si no lo conoces y te interesa: https://www.joseantoniocarreno.com/thrive-leads/

      De todos modos, ten cuidado de no estar usando la herramienta incorrecta con Elementor. Por ejemplo, si vas a implementar un shortcode, utiliza la herramienta shortcode, no la de HTML ni el editor de textos.

      Gracias a ti por pasarte a leer el post y dejar tu comentario. ¡Un abrazo!

  19. Hola Jose Antonio,

    Había instalado Elementor porque había oído buenas referencias de este plugin, pero no me había atrevido a usarlo. No sabía por dónde empezar. Entonces encontré tu tutorial, y me ha ido genial. He ido probando uno a uno todos los widgets de Elementor mientras leía tu post, y ahora finalmente tengo una idea global de cómo funciona. 🙂

    La verdad es que me ha parecido IMPRESIONANTE. Las posibilidades creativas que ofrece son fantásticas, y además sin tener que tocar nada de código. El último contacto que había tenido con un editor parecido había sido el Visual Composer (en su versión de hace más de un año), que en su momento me pareció que era muy bueno… ¡pero Elementor es infinitamente mejor!

    ¡Muchas gracias por el tutorial!

    • Hola Leo,

      Efectivamente, como bien dices las posibilidades creativas con Elementor se multiplican al instante con respecto a otros maquetadores para WordPress. Y esto es fruto del gran trabajo de los desarrolladores, los cuales han pensado desde el principio en crear una herramienta sencilla de utilizar de cara precisamente a diseñadores con el fin de que estos puedan explotar al máximo sus ideas y creatividad. Y lo mejor de todo es que lo han hecho sin renunciar a que también sea sencillo de utilizar para usuarios con conocimientos normales en el manejo de WordPress. Es de matrícula de honor lo que han conseguido estos chicos. 🙂

      Gracias por dejar tu opinión. ¡Un abrazo!

  20. Antes que nada saludos cordiales, y gracias por tu tiempo al exponer tus conocimientos y guiarnos hacia nuestro proposito recien he estado viendo tu video sobres Elementor page builder y por sugerencias tuya (y porque me interesa) he comprado los addons por $ 39.95. Hace algun tiempo tome un curso de WordPress y ahora estoy tratando de montar un sitio. Encontre dos sitios que casi hablan de lo mismo, El de Arturo y el tuyo y me quede a leer el tuyo. tan es asi que he comprado Generatepress y he bajado Elementor, los he instalado pero a la hora de verlos funcionar no me trabaja. Pongo editar con Elementor y me da dos opciones agregar nueva seccion o añadir plantilla. pongo agregar nueva seccion y no me da NADA solo se queda buscando. Que puede ser? Compre los add-ons, he desintalado y vuelta a instalar, y me quede quieto porque no encontre el camino. Sera porque estoy trabajando en mi Pc como local host?. Ya hice lo que me sugeriste en tu respuesta del 20 de Febrero pero sigue igual al punto que lo habia dejado olvidado. En tu email enviado dices que no lo haga en privado y que sea a travez de tu blog. Bien hoy lo he retomado y te escribo de nuevo. Tengo tres graficas para enviarte pero esto lo puedo hacer a travez de un adjunto. Y aqui no se puede, seria a travez de tu correo.
    Si tu o alguien mas me puede ayudar les agradeceria, y si tiene algun costo hazmelo saber. Me ayudan!! Gracias de antemano.
    Al
    Mi correo alfredpctech@yahoo.com

    • Hola Al,

      Que estés trabajando en un entorno local no creo que sea el problema. Si ya has comprobado lo de la versión de PHP, revisa que ningún plugin de los que tengas instalados te esté generando algún tipo de incompatibilidad. Lo más sencillo es que desactives todos y compruebes si el problema persiste. Si se soluciona, es que algún plugin te está haciendo la vida imposible y deberías ir activándolos uno por uno para ver cual es exactamente.

      Saludos!

  21. Hola de nueva José Antonio,

    Te quería enviar un mensaje mediante tu formulario de contacto, en respuesta a la primera lección de tu curso, pero cuando clico ENVIAR me aparece este mensaje:

    “Sorry, there was an error. Please be sure JavaScript and Cookies are enabled in your browser and try again.”

    Estoy usando Chrome. ¿Cómo te podría enviar el mensaje?

    Perdona que te deje esta nota en la sección de comentarios de esta entrada, pero no se me ha ocurrido otra forma ponerme en contacto contigo. 😉

    • Hola Leo,

      Puedes responderme directamente al correo desde que se envía el curso, no es necesario que me escribas desde el formulario.

      En cualquier caso, si quieres escribir desde el formulario puedes probar a hacerlo desde otro navegador si Chrome te está dando problemas. Lo que te dice ese mensaje de error es que tienes que tener Javascript y las cookies habilitadas en tu navegador para poder enviar el mensaje, nada más.

      Saludos!

  22. Gracias por tu respuesta Jose Antonio; te comento PHP tengo version 5.6.25; y tengo 3 plugin instalados, Elementor, akismet y GP Premium. he desinstalado todo hasta WordPress, pero sigo igual. Algo mas que pueda hacer?
    Saludos
    Al

  23. Buen día José Antonio:

    He leído tu manual y el ebook que me has enviado, primero gracias por el esfuerzo
    segundo , no tengo ni idea de programación web y voy a intentar construir un sitio web
    con wordpress . Tengo que decirte que tu manual ha sido de lo más claro que he encontrado
    por la red. En un par de meses te contaré y si consigo sacar el proyecto adelante
    te invitaré a visitar mi sitio y a una copa si es posible

    Gracias

  24. Hola Jose Antonio, estoy empezando a utilizar elementor junto con thrive leads, estoy pez con ambos plugins. Veo que existe la posibilidad de insertar un shortcode en elementor con facilidad, pero como puedo insertarlo directamente en un boton? He creado un formulario de estos en dos pasos y me estoy volviendo loca para ponerlo en un boton de elementor. Gracias

    • Hola Natalia,

      Con Elementor no puedes enlazar con un botón a un shortcode (que creo que es lo que estás intentando hacer). Si quieres hacer un formulario en 2 pasos, la mejor manera de hacer es creando tanto el botón como la lightbox que lanzará ese botón desde Thrive Leads y luego insertar el shortcode que te da esta herramienta en Elementor.

      Recordarte también que tienes un tutorial de Thrive Leads en el blog por si quieres echarle un ojo ante cualquier duda: https://www.joseantoniocarreno.com/thrive-leads/

      Un fuerte abrazo!

  25. Ese día después de dormir ocho horas y tomarme dos cervezas descubrí que se puede directamente, poniendo en el texto del botón el shortcode

    • Hola Natalia,

      Pues mira, como se suele decir en estos casos: “Nunca te acostarás sin aprender una cosa más”. La verdad es que yo nunca había probado a hacer esto que tu comentas puesto que, como te decía en mi respuesta anterior, yo lo hacía todo desde Thrive Leads (botón y lightbox). Pero ahora tengo curiosidad por probarlo a ver si funciona como tú dices, ya que de ser así, el tiempo de carga ser vería ligeramente mejorado. ¡Gracias por tu aporte!

      Saludos!

  26. Hola y gracias por este super tuto, la verdad que me encanto y tambien yo lo que hize fue usar una plantilla de boostrap que tengo por ahi la modifique como yo queria y puedo utilizar elementor y boostrap y tener los diseños de boots a la mano y si, antes yo hacia los temas desde cero pero esto esta super genial para mi, ya para que reinventar.

    Lo estoy usando recientemente pero la verdad es que hay cosas que aun quedo corto, a ver si puedes ayudarme un poco, tengo una estructura de 50 x 25 x 25, entonces quiero que cuando este en la dimencion 1024 la columna derecha baje y quede al 100%, la segunda que agarre el 50% y luego el 100% para todas….

    Te voy agradecer mucho si me puedes decir donde esta esa opcion, no quiero meterle mano mucho al css ya que quiero saber primero si lo trae elementor y asi es menos pesada la web.

    Gracias!

    • Hola Henry,

      Elementor, como se ve en el vídeo, trae opciones en el maquetador para establecer diferentes propiedades Responsive desde su editor, pero no sé si esto será exactamente lo que andas buscando. Si no puedes hacer lo que quieres con esas opciones para ese tamaño concreto de ancho de pantalla (1024 pixeles), tendrás que hacer un media querie en CSS irremediablemente.

      Gracias a ti. Saludos!

  27. Hola José
    Me encanta Elementor, pero tengo una duda respecto a utilizarlo en un blog. Empleo el Blank Page Template y no me permite crear un blog; en cambio emplea la página del tema original que uses.
    ¿Algún consejo para remediar esto?
    Muy bueno tu informe. Saludos desde Argentina.

  28. Estoy trabajando con Elementor y no encuentro la posibilidad de establecer de forma manual y exacta el ancho de una columna. Cierto que puedo hacerlo arrastrando y soltando, pero de esa forma no consigo establecer un porcentaje exacto.
    Podrías indicarme si esta opción está disponible y dónde? Gracias de antemano.

    • Hola Adolfo,

      Para establecer el ancho de columna tienes que hacerlo con la opción de arrastrar y soltar que comentas. Actualmente, no existe ninguna opción dentro de la herramienta “Columnas” para dar el porcentaje exacto y no hay otra manera de hacerlo que como tú has dicho.

      Sí que tienes en “Disposición – Más estructuras” algunas estructuras predeterminadas (normalmente las más utilizadas en diseño web) con porcentajes concretos para poder utilizarlas directamente sin tener que andar cambiando el deslizador en cuestión.

      Saludos!

  29. Andaba encantada con Elementor, todo funcionaba excelente pero esta semana se actualizo (no se si eso tuvo que ver) y ahora cuando le doy editar con elementor se queda la pagina o la entrada en blanco, había leído que tal vez era problema de memoria, asi que le desistale varios plugins pero no, aun sigue sin funcionar, agradezco si me pueden colaborar con ese tema, o si saben donde puede estar la falla.
    Gracias!! Saludos

    • Hola Karen,

      ¿Que tema estás utilizando? Prueba a cambiar a uno de los temas por defecto y ver si el problema se mantiene. Si con un tema por defecto de los que trae WordPress te funciona, probablemente se deba a una incompatibilidad con la plantilla que estás utilizando.

      En cualquier caso, también tienes la posibilidad de escribir a los desarrolladores de Elementor a ver si pueden iluminarte el camino en tu caso concreto. 😉

      Gracias a ti. ¡Un fuerte abrazo!

  30. Hola Jose Antonio.
    Estoy empezando a usar elementor, y este post es super esclarecedor. Muchas felicidades.
    Quería hacerte una pregunta: En el ejemplo que pones de acordeón, tu página Plan Blog Brazos Cruzados, aparecen todos los elementos cerrados, ¿cómo lo haces?
    Gracias !!!

  31. Hola, Jose Antonio.

    Quiero darte las gracias en primer lugar por tu trabajo. Por estos mega tutoriales e interés por enseñar.

    Acabo de empezar con generatepress (con addons) y elementor, pero tengo una duda nada más comenzar. Cuando damos a editar con elementor la página que vamos a crear, me sale todo lo de elementor, pero encima de donde se empiezan a poner los widgets, me sale el nombre de la pagina (página prueba, página ejemplo…) Me he dado cuenta de que a ti no te sale nada de eso, todo lo tienes blanco y limpio. Lástima que no pueda enviarte una captura.

    ¡Gracias!

    • Hola David,

      Si estás utilizando los addons, puedes quitar los títulos por defecto marcando la opción correspondiente en la parte derecha, donde pone “Disable Elements – Page Title” de tu la pantalla de edición de página en WordPress.

      Otra opción es, dentro de Elementor, ir al menú de la parte izquierda superior (el de las tres barras horizontales) – Page Settings y marcar la opción “Hide Title”. De este modo tampoco se te mostrarán los títulos. 😉

      ¡Saludos!

  32. Hola Jose
    He adquirido GeneratePress e instalado Elementor en su version Libre. Por lo que entiendo en tu post, al instalar Elementor se instalan tambien algunas de las plantillas? en mi caso, en las librerias NO aparece Ninguna.
    Unicamente me aparece el mensaje: “Elije una plantilla Elementor del fichero JSON, y añádela a la lista de plantillas disponibles en tu biblioteca.”
    Sabrás porqué no aparece ninguna plantilla? o en dado caso, como agregar las plantillas ?

    Gracias de antemano.
    Saludos

  33. Me Respondo…
    Que ha aparecido la opcion de Añadir Plantilla una vez que he hecho la primera pagina con Elementor
    Aparecen dos botones
    1.- Agregar Nueva Secccion.
    2.- Añadir Plantilla.
    Se da click en Añadir Plantilla y wualaa! aparecen las plantillas. !!!
    aparecen tanto las plantillas gratuitas, como las Pro.
    Yo habia supuesto que podrian aparecer las plantillas en la biblioteca desde un inicio para cargarlas y maquetar sobre ellas.
    En fin. trabajare con una de ellas.

    Excelente Post.
    Gracias.

  34. Buenas tardes José Antonio.
    Excelente post te doy las gracias de antemano. Me pasan dos cosas he editado una pagina con elementor y todo perfecto me encanta pero hoy le doy a editar pagina con elementor y se queda cargando no me abre el editor. Y otra que he dado cuenta que cuando lo abro la pagina en el teléfono en el icono del menú me sale lo siguiente la http://www.lapagina.com/#sidr-main si voy a otra pagina de la Web que no esta editada con elementor me funciona perfectamente.

  35. Hola, Jose Antonio.

    Quiero darte las gracias de antemano por tu trabajo.
    Hace poco que he empezado con generatepress y elementor (en su versión gratuita) y tengo una duda. ¿Hay alguna manera de insertar un formulario pop-up de Mailchimp en Elementor? .
    Pues he probado copiar el código del formulario y pegarlo en una sección de HTML de Elementor, pero no hace nada y si lo pego utilizando el escritorio de wordpress me desconfigura todo el diseño realizado con Elementor.

    Mucha gracias!
    Un saludo!

    • Hola Antonio,

      ¿El código que has pegado en la sección HTML es código HTML o es un shortcode? Si se trata de un shortcode, debes utilizar su herramienta correspondiente, no la herramienta HTML.

      No utilizo Mailchimp, así que no sé exactamente como funciona el tema de los popups en él o como podrían insertarse directamente. Imagino que, al igual que Mailrelay que es el proveedor que yo utilizo, los formularios que allí generen podrás incluirlos con código HTML. En ese caso, tienes que hacerlo tal cual lo has hecho (utilizando la herramienta HTML de Elementor).

      Por si puede servirte, hoy mismo he escrito un nuevo post en el que hablo sobre este tema de insertar formularios de suscripción desde Thrive Leads con Elementor. Te recomiendo Thrive Leads para este tipo de tareas de insertar formularios o ventanas emergentes (popups) con formularios, ya que hoy en día es el mejor plugin que hay para realizar esta tarea y está perfectamente integrado con Mailchimp (y con muchas otras plataformas). Te dejo aquí debajo el enlace:

      https://www.joseantoniocarreno.com/thrive-leads-elementor/

      ¡Saludos!

  36. Hola Jose!
    He creado mi pagina web en wordpress y al comienzo edité mis paginas con page builder, pero de un momento a otro dejó de funcionar y buscando alternativas encontré elementor, el cual me pareció fabuloso. Ahora tengo un pequeño problema y es que necesito crear un par de paginas más y al agregar una plantilla no me aparece la pestaña roja que permite eliminar secciones, quisiera saber si este problema es común con las actualizaciones y si debo esperar que se arregle solo.

    Muchas gracias de ante mano.

    • Hola Luisa,

      Si te refieres a que al insertar un elemento de diseño de tipo Plantilla no te deja editar dicha plantilla, esto es normal. Esa herramienta se utiliza para duplicar elementos de diseño en diferentes páginas, de tal forma que si necesitas editarlos puedas hacer los cambios en todas estas páginas una sóla vez (en lugar de ir haciéndolo una por una).

      En cualquier caso, si esto no es lo que pretendes hacer, si pulsas en el botón de la izquierda que pone “Unlink” te dejará editar sin problema cualquier elemento de plantilla guardado que importes en otras páginas con esta herramienta de Elementor.

      Si quieres editar en una plantilla guardada las secciones, debes utilizar la opción “Biblioteca de plantillas” en el icono de carpeta que se encuentra en el menú de la parte inferior de Elementor (el que tiene fondo gris).

      Saludos!

  37. Hola!

    Me gustaría editar categorías de wordpress. Tanto de los post, como de woocommerce. ¿Sabes si hay forma de hacerlo con Elementor?

    Un saludo.

  38. Gracias José Antonio,

    ¿Las has probado? ¿Se pueden editar las categorías de woocommerce con Elementor Pro como si fueran una página de wordpress?. ¿Tienes algún código descuento para comprar la versión Pro? ¿Es pago anual?

    Un saludo.

    • Hola Juan Fco,

      En realidad, lo que puedes hacer es crear tus propias páginas de categorías de Woocommerce con Elementor Pro. Así podrás diseñarlas a tu gusto desde cero.

      No tengo ningún código de descuento en estos momentos para comprar la versión Pro de Elementor, lo siento. Sin embargo, si deseas adquirirla, puedes hacerlo a través de mi enlace de afiliado de la herramienta. Te lo dejo a continuación:

      https://elementor.com/pro/?ref=1188

      ¡Saludos!

  39. Hola amigo, mil gracias por el buen tutorial, he estado usando Elementor para el desarrollo de una pagina web te la dejo aca http://grupoprevenso.com/developer/ y he notado un problema en los fondos de las paginas no se ven, ni en ordenadores con grandes pixelajes ni en las versiones responsive de dispositivos móviles? Abra algún problema en wordpress con eso? Si se tenga que agregar código en el archivo functions.php o algo parecido? Te agradecería la ayuda…

    Saludos.

    • Hola Katherine,

      Lo primero que yo haría sería comprobar que no esté existiendo algún tipo de incompatibilidad entre alguno de tus plugins y Elementor. Después también comprobaría si hay incompatibilidad entre la plantilla y Elementor. Puede que alguna de ellas sea la que te esté causando el problema. En cualquier caso, si tienes la versión Pro, el equipo de soporte de la herramienta puede ayudarte con tu problema (en realidad, para eso están). 😉

      Saludos!

    • Buenas tardes Carla,

      Haz una prueba activando otro de los themes por defecto de WordPress (por ejemplo, Twenty Sixteen o uno similar). Si el problema se soluciona al cambiar de theme, entonces está claro que es una incompatibilidad con tu tema y con ese maquetador que incluye.

      Feliz tarde de martes. Un saludo.

Deja un comentario

Share This