Elementor-review-editor-visual-wordpress

Review Elementor: el mejor editor visual gratuito

Por fin me he librado de Visual Composer y lo he sustituido por Elementor. Y estoy encantado con el resultado. Por eso te quiero hablar sobre Elementor que para mí es el mejor editor visual gratuito.

Elementor es un editor visual “Drag & Drop” gratuito. Por si no sabes lo que son te lo explico.

Los editores visuales te permiten maquetar tus páginas sin tener que tocar código en la mayoría de los casos. Porque esto al final depende de lo que quieres hacer y de lo que te deja hacer el editor visual que estés usando. Aunque la idea de todos que que no tengas que tocar código o hacerlo lo mínimo posible.

Bueno, pues hasta ahora en mi web usaba Visual Composer (en adelante VC) junto con Massive Addons. Y la verdad es que me han funcionado bastante bien, pero había cosas que no me gustaban. Cuando editaba una página con un contenido extenso le costaba cargar los modulos, tenia que estar continuamente previsualizando el contenido para ver cómo queda realmente.

Y por otro lado VC no permite adaptar bien el contenido a los dispositivos móviles. Me refiero a que no podía ocultar ciertos elementos o adaptar su aspecto en dispositivos móviles. Aunque tiene algunas opciones para eso, son insuficientes.

Total, que tenia bastantes ganas de quitármelo de encima y por casualidad en un artículo de Quora.com alguien mencionó este editor. Le eche un vistazo por encima y como tenia buena pinta y era GRATIS pues lo probe en local para ver qué tal.

Y en un momento había replicado una página de Beaver Builder.

Element Builder ejemplo

Después de eso me decidí a rehacer las páginas de mi web con Elementor y de paso dar un toque más parecido a “material design”. Los diseños limpios y minimalistas (sin pasarse) me encantan.

Entonces, vamos a ver qué tiene de bueno Elementor.


Principales características de Elementor

Es gratis y de código abierto

Lo de que es gratis ya lo he mencionado varias veces. Y por lo que he leído en su web va seguir siendo así. Pero van a sacar una versión o algún plan premium.

Yo lo que me pregunto es en qué va consistir, porque lo típico es que solo te dejen usar algunos módulos y para tener acceso al resto (que son los buenos ) tienes que pagar, cosa que tiene sentido.

Pero como te los dan todos gratis, incluso van a incorporar más módulos de forma gratuita. Entonces a ver qué ofrece la versión premium cuando salga.

Por otro lado, al ser de código abierto cualquier desarrollador puede trastear el código del pugin y crear nuevas funcionalidades, corregir errores o lo que sea. Esto ayuda a que evolucione mucho más rápido porque cualquier usuario, con los conocimientos necesarios obviamente, puede colaborar en su desarrollo.

Es  intuitivo y muy fácil de usar

Se nota que se lo han currado para que todo sea muy intuitivo. Tienes a un lado un panel con todos los elementos que puedes usar y en ese mismo panel editas las opciones de cada uno de ellos. Y por otro lado tienes tu página. De esta forma se aprovecha mejor el espacio. Solo tienes que arrastrar esos módulos y colocarlos en filas y columnas.

Más rápido que otros

Si has usando algún otro editor visual, normalmente al querer editar cualquier elemento se te abre una ventana tipo “pop-up” o algún panel y tienes que esperar a que se cargue, guardar, cerrar y así todo el rato.  Y algunos encima tardan en cargar (como el VC…).

Con Elementor eso no pasa, al pinchar sobre un elemento todas las opciones de configuración aparecen en el panel de la izquierda inmediatamente sin tiempos de carga. Y todo los cambios que hagas se ven reflejados inmediatamente sin guardar.

Además, puedes ocultar el panel de módulos con un clic y ver como queda la web a ancho completo. Todo esto sin recargar ni salir de la página que estés editando.

Esto permite trabajar con Elementor de forma muy fluida sin esperas innecesarias.

No necesitas usar código

Con Elementor se puede crear todo tipo de páginas, sus módulos tienen muchas opciones de personalización para adaptarlos a tus necesidades. Y si con eso no es suficiente puedes CSS personalizad añadiendo una clase CSS al módulo.

Personalización de columnas y filas

Las estructura de una página web al final siempre se divide en filas y columnas. Y uno de los puntos fuertes de Elementor son las opciones que ofrece para configurar las filas(secciones) y columnas.

Filas: Ancho y Alto

Tienes el total control sobre el ancho y el alto de cada fila.

Layout

Puedes crear filas de ancho completo, hacer que ocupen toda la pantalla o ajustar su tamaño mediante el padding y margin.

Redimensionar columnas

Con Elementor puedes redimensionar las columnas simplemente arrastrando uno de los lados de la columna. Tienes el control sobre el ancho y el alto de las columnas.

Redimesionar Columnas

No estas limitado a los tamaños estándar sino que puede ajustarlas a tu gusto.

Posición del contenido

Esta es una opción que me gusta bastante y es que puedes alinear el contenido de las columnas arriba , en medio y abajo.

Posición del contenido

Espaciado entre columnas

También puedes ajustar el espacio entre las columnas y usar el que mejor se adapte a tu contenido.

Espaciado entre columnas Elementor

Además de eso, puedes ajustar el espaciado y el margen de cada columna en px , em y %.

Widgets customizables

Elementor incluye diferentes módulos bastante útiles con muchas opciones de personalización.

Hay de todo tipo: botón, barra de progreso, contador, testimonio, alertas, mapa, carousel, galería y muchos más. Además de los que incluye Elementor puedes usar los widgets básicos de WordPres o de terceros.

Widgets customizables Elementor

Cada módulo / widget  tien amplias opciones de configuración, según que módulo sea tiene unas opciones u otras pero en generar todos disponen de una buena cantidad de ajustes para dejarlos como quieras. Además, todos tienen la posibilidad de insertar una clase CSS para añadir estilo propio.

Guarda tus diseños o importa plantillas prediseñadas

Otra de las funcionalidades que me gusta es que puedes exportar tus diseños y reutilizarlos en otras páginas. O puedes insertar directamente en la página que estés editando una plantilla prediseñada por los desarolladores con un par de clics.

Elementor Template Library

Una vez que importes una plantilla lo único que tendrás que hacer es adaptarla a tus necesidades. O también las puedes usar como ejemplo para aprender a usar Elementor.

Resumen

Como opinión final te puedo decir que es un plugin que me ha sorprendido por todo lo que ofrecer siendo gratuito 100%. Se nota que lo hicieron con cabeza y que se lo están tomando enserio. Porque ya han metido bastantes mejoras desde que salió hace 5 meses.

La única desventaja es que para crear páginas a ancho completo necesitas que tu plantilla  lo permita. Yo lo he probado con la plantilla GeneratePress, que tiene esa opción y va genial.

Me parece el mejor editor visual gratuito para WordPress con diferencia. Es intuitivo, rápido, incluye diferentes módulos, con muchas opciones de personalización… muy completo en general.

Si no tienes mucho presupuesto o no te quieres gastar dinero en un editor visual, no lo dudes usa Elementor.

Déjame en los comentarios tu opinión sobre el plugin o coméntame las dudas que tengas.  Estaré encantado de ayudarte.

Me puedes hacer un gran favor compartiendo este post en tus redes sociales.

  • Julio Vergara

    Excelente alternativa, se ve muy bien el editor, gracias por la info

    • La verdad es que sí. Un saludo Julio!

      • Julio Vergara

        Explicas muy bien, me suscribo aquí y en youtube, gracias

  • Hola Sergio. Gracias por el artículo!! Yo soy muy fan de Page Builder de Site Origin por el tema de que no usa shortcodes ni tiene lock-in, pero este tiene muy buena pinta también. Tendré que probarlo.
    Un saludo!

    • De nada, para eso está. La verdad es que está muy bien. El de Site Origin no me gusta la verdad, lo probé varias veces pero me saca de mis casillas jeje
      Un saludo!

      • Es que la interfaz es muy poco colorida, se mimetiza demasiado bien con los colores propios de WordPress, tanto que me pierdo.

        Que lo use, no significa que me guste. Es el primero que conocí, y con el tiempo ha evolucionado para bien (antes sí usaba shortcodes, hará un año).

        Yo también quiero probar Elementor, pero ya lo dejaré para la remodelación de la web con un framework que me esta llamando mucho la atención y es gratuito.

        Por cierto, el amigo Joan Boluda me ha comentado (previa pregunta) que WordPress tiene previsto sacar su propio maquetador visual de serie (codex), aunque será algo básico de momento, por bloques.

        • Ya veremos a ver lo que sacan los de WordPress. De momento voy a usar Elementor y si sale algo mejor pues me cambio, que aquí no hay permanencia jeje.
          ¡Un saludo!

          • Vaya, han puesto en la versión Pro: formulario, lista de precios, slides. Algo que SiteOrigin tiene de forma gratuita, junto con las ‘Hero Images’ (que Elementor, ni tiene).
            El formulario de SiteOrigin, tiene muchas opciones, algo que también pensaba tenia el de Jetpack pero descubrí su límite.

            Elementor me llamaba la atención por sus diferentes sistemas para integrar las Faq: Tabs, Accordion, Toggle. De hecho, por eso lo quería probar.

            De momento me quedo con SiteOrigin, es más útil para mí.

  • Pier

    Soy nuevo en esto, no comprendo si se descarga y dónde está el link , ¿es online?, ¿Funciona en mac?

    • Hola,
      No es un programa de ordenador, se instala en tu instalación de WordPress por lo cual es “compatible” con Mac.

      Lo puedes descargar desde el repositorio de WordPress o desde su página web. Lo más fácil es que lo instales directamente desde tu panel de administración de WordPress. Tienes que ir a Plugins-> añadir nuevo y lo buscas con el buscador. Luego simplemente le das a instalar y activar. Hecho eso, lo podrías usar tal como lo muestro en el vídeo.

      ¡Un saludo!

      • Pier

        Ok, muchas gracias

      • Pier

        ok, gracias

  • Excelente artículo parece que vale solo en sitios nuevos ya que le probé en una página nuevita y todo anda bien, le quise poner en una página que usaba visual composer y me sale un error de falla de contenido, viendo foros en internet mucha gente también tiene ese problema

    • Hola, se me pasó tu comentario.Creo que te refieres a este error:
      https://docs.elementor.com/article/56-content-area-not-found
      A mí también me ha pasado, pero es algo raro porque ese error sale cuando le da la gana. Sobre todo me ha pasado al editar la página de home. He tenido casos con tanto con páginas nuevas como con antiguas.

      De todo modos aunque tenga ese fallo, que supongo que corregirán, sigue siendo la mejor opción gratuita.

  • alex torres

    Hola como haces para poner en tu pagina principal la sección de “lo ultimo del blog”? con el plugin elementor? así como lo tienes tu en forma “cuadrada”…lo he buscado y ni idea.. gracias!

  • javier

    hola buenas noches sergio excelente articulo y review de este editor
    tengo un detalle al subirlo a un servidor online, me toma las imaganes del localhost ya modifique las url de las base de datos wp-options como toda migracion basica pero aun asi no me toma las que he subido online.
    es mala idea trabajar con elementor en local ?

    • Hola javier,

      No te preocupes, todas las imágenes que están dentro de un maquetador visual, suele pasar esto. Hay que ir retocando la URL a mano, porque no se cambian de forma automática, salvo en ciertos casos.

      Por ejemplo en el maquetador visual de SiteOrigin (que es compatible con Elementor), si pones las imágenes desde un widget de texto, has de cambiar a mano la URL. Sin embargo, no pasa esto cuando pones la imagen desde un widget de imagen, la URL se cambiaría de forma automática.

      A ver que te dice Sergio que usa Elementor, pero una de las claves puede ser el widget que hayas usado para las imágenes. Si es propio de imagen debería cambiarte la URL, como pasa con el maquetador de SiteOrigin.

      Saludos.

  • Ana SEPÚLVEDA

    Hola, lo descubrí ayer y lo estoy probando. Pero tengo una gran duda, he creado una columna y por error me he equivocado y me gustaría restaurar lo anterior, es posible recuperar, es decir “deshacer” el movimiento anterior? Gracias. Estoy aprendiendo y estoy me salvaría mucho el trabajo. Un saludo

  • Óscar

    Hola!!!
    Tengo una duda…. Es bueno (o no es muy malo) usar Elementor y Page Builder Site Origin a la vez para complementarlos?

    • Desde el 31 de enero de 2017, SiteOrigin Widgets Bundle (el complemento de Page Builder de SiteOrigin) es compatible con Elementor y Beaver Builder.

      De hecho, en el foro de soporte de Elementor, uno de los autores del plugin, recomienda a un usuario su uso, dada la queja que da, relacionada con que Elementor, no posee de forma gratis: lista de precios ni slider (tampoco formulario de contacto), cosa que SiteOrigin sí, te lo da gratis.

      A Sergio, no le gusta mucho SiteOrigin, jeje.

      Saludos.

      • Óscar Toro García

        Muchas gracias Joan!!!

    • Pues no soy muy fan de SiteOrigin jejej, como ha comentado Joan. Pero vaya, que no es mala opción. Yo intentaría usar uno u otro, no los dos a la vez. Porque realmente ambos plugins están pensados para lo mismo. Y tener dos plugins que hacen “lo mismo” no es lo ideal.

      • Sergio, hacen lo mismo pero no tienen lo mismo. Al menos, no en 3 cosas, de las cuales 2 de ellas, destaca uno de los autores de Elementor, se encuentran en SiteOrigin Widgets Bundle de forma totalmente compatible. Vamos que lo destaca uno de los autores de Elementor, ni siquiera lo digo yo.

        De hecho, la suma de peso entre los 2, es lo que pesa por si sólo Beaver Builder, y encima viene capado casi totalmente en su versión gratuita.

        Con respecto a tener 3 plugins de diferente autor (es decir, un slider, lista de precios y formulario de contacto), te arriesgas a que entren en conflicto alguno de ellos.

        A favor del formulario de contacto de SiteOrigin diré que yo tengo puesto un correo de Gmail donde me llegan los mensajes, y todo lo recibo bien desde la bandeja principal. Tengo entendido que hay gente que está teniendo problemas con Contact Form 7, para recibir mensajes en la bandeja principal de Gmail, terminando la mayoría en spam.

        Saludos.

  • Para los que han tenido la suerte de conocer este page builder de entrada, comentarles que gracias a un miembro de la comunidad WordPress, existe un ‘Addon’ para Elementor gratis:

    – Elementor Addon Elements (By Webtechstreet)

    Un ‘Addon’, es una serie de elementos específicos que no contiene un plugin y permite enriquecer éste. Normalmente, son los propios autores del plugin oficial quienes lo sacan y cobran aparte (o no).

    ¿Qué trae de interesante este Addon?

    – Flip Box
    – Text Separator
    – Price Table
    – Post List
    – Shape Separator (Deprecated.. use shape separator available with Elementor)
    – Animated Text
    – Split Text

    Aún no está el formulario de contacto ni slider, pero prometen nuevos añadidos próximamente.

    Yo porque empecé con SiteOrigin, sino estaría usando Elementor. Próximamente para mi nueva web, jeje. Hoy ando probándolo de forma local, es por eso que investigando y tal, descubrí este addon gratis.

    Ya ves Sergio que no me molesta para nada Elementor, es sólo que tengo toda mi web ya con SiteOrigin, y tengo que optimizar lo que conozco, y por otra parte al llevar tantos años, pues es más compatible con varios plugins, entre ellos Elementor y Beaver Builder (el cual en su edición gratuita no es gran cosa).

    Pero el diseño visual de Elementor me recuerda a cuando trabajaba con Dreamweaver para construir mis webs en HTML & CSS. Lo que ves, es lo que es, aunque no siempre era así, esa forma de trabajar con Dreamweaver como en el caso de Elementor, animaba a hacer diseños más bonitos y espectaculares.

    Saludos, a pasar buen domingo.

  • Guillermo Martínez Palazon

    alguien sabe como poner enlaces externos en nofollow con elementor? gracias

  • Guillermo Martínez Palazon

    he probado con muchos plugin y tambien manualmente pero al volver a editar con elementor me pone los enlaces en dofollow.

Pin It on Pinterest

Shares
Share This