Contenidos por asunto

Cuáles asuntos te interesan recibir:

La confirmación de tu inscripción ha sido enviada a tu correo electrónico

¡Gracias por suscribirte, esperamos que disfrutes nuestros contenidos!

Elementor: ¡aprende cómo crear tu sitio web con este plugin!

Compartir:

¿Quieres tener un sitio web con un diseño intuitivo y fácil de navegar? Entonces necesitas saber cómo usar Elementor en WordPress

Elementor es uno de los complementos (Plugins) más utilizados e intuitivos para crear sitios web. Así que si quieres ahorrar tiempo en operaciones de layout complicadas, pero sin perder la idea de sitio web que quieres lograr, ¡ven a conocer cómo usar esta herramienta en tu proyecto web!  

Si te dijéramos que hay un creador de páginas con más de 5 millones de instalaciones activas y que además promete tener un diseño “ilimitado”, ¿lo creerías? Bueno, eso es lo que promete Elementor.  

Lanzado en 2016, este plugin está experimentando un rápido crecimiento y, como tal, está destacándose entre los principales de WordPress en la actualidad. Sus usuarios están locos por él y casi es considerado un gran desperdicio no usarlo.  

Sin embargo, ¿merece tantos elogios? ¿Es realmente una herramienta imprescindible o toda esta fama está sobrevalorada? Para averiguarlo, te invitamos a estudiar qué es Elementor y qué tiene de especial ¡Quédate con nosotros! 

¿Qué es Elementor WordPress? 

Elementor es un creador de páginas web para WordPress que es utilizado como un Plugin o complemento. Este recurso te permite crear páginas complejas de WordPress sin realizar ni una sola línea de código, gracias al uso de plantillas de página listas para usar, con los modelos más modernos, con la facilidad de agregar, arrastrar y soltar a tu contenido en pocos clics. Todos los cambios son visibles en tiempo real.  

elementor

Elementor WordPress no es solo un creador de páginas como otros. Forma parte de un círculo muy particular: es de las extensiones con más de 5 millones de instalaciones activas. 

Solo hay ocho complementos en esta categoría de éxito: Yoast SEO, Jetpack, Akismet, Contact Form 7, WooCommerce, Classic Editor y Really Simple SSL.  

¿Por qué usar Elementor en tu sitio web?  

Si deseas tener un control total sobre la apariencia de tu página web en WordPress sin la necesidad de sumergirte en códigos de programación, entonces tu mejor aliado será Elementor. Inclusive, si ya tienes el conocimiento técnico para codificar todo tu portal web de forma independiente, Elementor hace que el diseño de tu sitio web sea mucho más fácil e intuitivo.   

El uso de Elementor para crear páginas web puede ahorrarte tiempo y ayudarte en la configuración de sitios web más rápido. Además, ayuda a reducir la complejidad de las páginas web, elimina errores y permite un proceso de mantenimiento mucho más fácil cuando se trata de actualizaciones.  

Mira más ventajas de Elementor:  

  • Además de ser gratuito, no será necesario actualizar a la versión Pro para la mayoría de los sitios web  
  • Una gama de características muy ricas y fáciles de usar 
  • No requiere ningún conocimiento de HTML, CSS o PHP y te permite crear diseños personalizados  
  • Ofrece una interfaz de edición en tiempo real 
  • Te permite ajustar por separado las versiones de escritorio, mobile y tablet. 
  • Permite utilizar parámetros precisos para la gestión de alineaciones y márgenes.   

¿Cómo usar Elementor en WordPress?  

Primero debes instalarlo y activarlo; así estarás listo para que el Plugin Elementor funcione en tu WordPress. La instalación es estándar, como cualquier otro complemento de WordPress.  

Luego aparecerá en un panel de control que puedes visitar si lo deseas.   

La opción “Editar con Elementor” debería aparecer cuando se instala el Plugin. Por lo tanto, ingresa a la interfaz de usuario directamente desde la parte frontal de su sitio web.  

A continuación enumeramos los diferentes elementos que aparecen:  

  1. El lienzo principal, donde tienes tus bloques de contenido para ajustar. 
  2. Todos los elementos de contenido disponibles 
  3. Ajustes de color, fuentes, etc   
  4. El editor de bloques 
  5. La configuración general de la página en la que está trabajando  
  6. El historial de revisiones de la página 
  7. Modo responsivo para optimizar tu sitio web en tabletas y teléfonos móviles.  
  8. Resumen de los cambios. 
elementor

¿Cómo crear un sitio web con Elementor?  

Primero; es esencial comprender las intenciones de la estructura de la página web y, con ello, crear una página básica con Elementor:  

  • una página puede tener cualquier cantidad de secciones 
  • cada sección puede tener una o más columnas  
  • una columna puede albergar uno o más elementos de contenido  
  • cada contenido se podrá diseñar individualmente  

Puedes agregar nuevas columnas en una nueva sección y luego llenar esas columnas con contenido arrastrando y soltando bloques específicos desde la barra lateral.  

Después de configurar un bloque de contenido, puede hacer clic en él para ajustar su contenido y los detalles de la presentación. Hay tres pestañas principales disponibles: Estilo, Diseño y Avanzado.  

Entonces, uno por uno, puede trabajar con bloques de contenido individuales hasta que la página completa esté lista.  

Si tu pregunta es cómo editar con Elementor, es importante recordar que, en general, Elementor es muy fácil de usar e intuitivo. Por lo tanto, trabajar con sus páginas se vuelve muy divertido una vez que ingresas a la estructura de la página que deseas crear y conoces todos los elementos del contenido. 

Selecciona un tema de Elementor   

Elementor ofrece muchas posibilidades de diseño, pero puede ser difícil comenzar si no tienes un proyecto de diseño en mente. Luego puedes usar una de las muchas plantillas predefinidas de Elementor. Hay más de 150 plantillas disponibles en la versión gratuita y más de 300 en la versión Pro.  

Si eso no es suficiente, también puedes obtener algo llamado Elementor Kits. Es decir, colecciones de modelos que siguen un mismo marco. Esto te permite crear un sitio web completo y cohesivo.

En la biblioteca puedes encontrar todo tipo de páginas web dependiendo de tus objetivos. De esa forma, encontrarás una buena selección de páginas de información, páginas de contacto, páginas de inicio, páginas de aterrizaje (también para varios nichos como hoteles, restaurantes, etc.), portafolios, páginas de equipo y mucho más.  

No solo puedes importar una plantilla de elementos a tu página en construcción, sino que también puedes modificarlos libremente hasta obtener el resultado que mejor se adapte a tu idea.  

¿Qué tipos de sitios web puedes crear con Elementor?  

Con Elementor, partiendo de una hoja de papel en blanco, podemos hacer casi cualquier cosa, gracias a una amplia gama de herramientas. Así que solo tienes que pensar en las ideas y el resto vendrá.   

Una vez que llegues a la interfaz de Elementor por primera vez, verás que su pantalla está dividida en dos secciones.  

A la izquierda, tiene una columna de configuración que te brinda la posibilidad de personalizar la apariencia de su página agregando elementos (Widgets), es decir, bloques de contenido listo para usar (por ejemplo, título, imagen, video, botón, etc.)  

A la derecha, tiene una vista previa de la representación visual de su página. 

Como muchos de sus competidores, Elementor adopta una jerarquía en cuanto a los elementos que estructuran su página:   

  • Agregas una sección 
  • Le agrega múltiples columnas (1 a 10) 
  • Insertas los elementos en tus columnas para comenzar a trabajar en ellos.  

Las características del complemento, como la columna que contiene los elementos, se pueden ocultar o reducir fácilmente. Por lo tanto, es posible ver realmente el resultado, sin ser contaminado por la interfaz de trabajo. 

En Elementor, como en muchos constructores de páginas, trabajamos con arrastrar y soltar. Tú eliges el elemento de tu preferencia haciendo clic en él con el mouse y luego arrastrándolo donde lo desees en tu página en construcción.  

Variedad de widgets   

En la versión gratuita de Elementor, encontrarás una amplia variedad de widgets a tu disposición:  

  • Widgets básicos: título, editor de texto, imagen, botón 
  • Widgets generales: se pueden clasificar de la siguiente manera 
  • Contenido: Galería, Carrusel, Guías, Acordeones 
  • Widgets de persuasión: testimonio, calificación, barra de progreso 
  • Los widgets más técnicos: shortcode, HTML personalizado 
  • Widgets de WordPress: los que ya conoces y están disponibles en la herramienta de personalización.  

Es decir, esta versión es suficiente para satisfacer las diversas y variadas necesidades de cualquier tipo de sitio web. Ya en la versión Pro del complemento, tenemos widgets adicionales, algunos de los cuales incluso se han vuelto esenciales para un buen número de creadores de sitios web.  

Por ejemplo, puedes insertar tablas de valores para mostrar los precios de tus ofertas, llamados a la acción, cuentas regresivas o incluso formularios. Hablando de formularios también ofrece funciones bastante amplias. Esto inclusive incluye un reCAPTCHA, que protege el sitio web del spam.   

Además, el widget de formulario de Elementor ofrece una selección de 20 tipos diferentes de campos, incluidos algunos avanzados (contraseña, descarga de archivos, etc.). 

Además, por supuesto, tienes control sobre el diseño y la apariencia visual: elección de colores, espaciado, tipografía, fondo, etc ¡Totalmente personalizable, haz que tenga la personalidad de tu marca y garantiza una mayor conversión! 

Diferencias entre Elementor Free y Elementor Pro 

Como mencionamos antes, Elementor free viene con un conjunto de widgets muy bien diseñados, pero si eres una agencia o profesional que desarrolla sitios web para tus clientes, necesitarás más, y ¡aquí es donde la versión viene Pro para ayudar!  

La versión Pro de Elementor agrega más de otros 30 widgets avanzados que incluyen, por ejemplo, elementos temáticos que te brindarán muchas más opciones de personalización y diseño.

La combinación de todo esto realmente le da la libertad de diseñar tu sitio web de la manera que desees y, además, si quieres llevar esta personalización un paso más allá, puedes consultar los complementos de PowerPack Elementor

CSS personalizado en vivo  

Es posible que no uses esta función debido a la amplia personalización del generador de Elementor, pero como desarrollador  o diseñador puede ser útil a veces. 

Esta característica de Elementor Pro te permite agregar CSS personalizado a cualquier widget o bloque y, por lo tanto, ver los cambios realizados en vivo en el editor.  

Si estás familiarizado con la codificación y, a menudo, te encuentras en situaciones en las que necesitas realizar ediciones que no están al alcance de los creadores mediante la función de arrastrar y soltar, te recomendamos que adquieras el Pro Pack.  

elementor

Insertar recursos en cualquier espacio que desees 

Elementor Pro tiene una opción que te permite incorporar widgets o líneas donde quieras usando códigos cortos.  

Esta opción puede ser útil porque puedes usar códigos abreviados para mostrar widgets en el pie de página, las barras laterales e incluso tu blog. Esta característica puede ser útil para diversas opciones dependiendo de la necesidad.  

También se puede usar para agregar formularios de suscripción, banners o, cualquier otro widget usando códigos cortos en las publicaciones del blog.  

Integración de WooCommerce  

Con la versión Pro, puedes personalizar fácilmente una tienda de comercio electrónico porque ya viene con múltiples recursos de WooCommerce. 

Además, puede arrastrar y soltar widgets para personalizar secciones de la tienda web.  

Guarda tus creaciones  

Con el complemento gratuito Elementor, puedes guardar fácilmente plantillas de línea con el botón Guardar, pero no tiene la opción de guardar Widgets.  

La opción de guardar widgets solo está disponible en Elementor Pro. Si bien no parece un requisito, en el caso de widgets más complejos como tablas de trabajo y cuadrículas, puedes llevar mucho tiempo personalizar lo mismo una y otra vez cuando puede cargarlo a través de una plantilla guardada. Por lo tanto, la tarea se vuelve muy fácil de realizar. 

La opción de guardar widgets solo está disponible en Elementor Pro.

Por lo tanto, la opción de guardar es más útil para los desarrolladores que para los usuarios finales, ya que se puede usar para crear plantillas y diseños de widgets predeterminados y se puede cambiar más adelante según sea necesario. 

Sin embargo, para los usuarios que ya saben algo de programación y quieren personalizar aún más su sitio web, pueden aprender todo de manera muy intuitiva en Elementor. 

¿Cuál es el precio de Elementor Pro?  

La versión Pro de Elementor es una herramienta poderosa y ofrece mucho, pero tiene un precio.  

Si no estás familiarizado con los creadores de páginas y desea probar el producto, la versión gratuita será más que suficiente, ya que puedes probarla y luego cambiar a la versión profesional.  

La versión PRO de Elementor está disponible en cinco versiones: ESENCIAL, AVANZADO, EXPERTO, STUDIO y AGENCIA.  

Cada versión ofrece la misma funcionalidad, por lo que la diferencia está en la cantidad de sitios web que puedes crear. 

Puedes consultar la información completa y precio del Elementor Pro en este video.  

Conclusión  

Entonces, para recapitular: ¿qué pensamos de este creador de páginas? A continuación, enumeramos algunos puntos clave a tener en cuenta.  

  • La interfaz es impecable, especialmente en cuanto a las animaciones, lo que te permite saber realmente cuál será el resultado final. Además, la vista dinámica proporciona un ambiente de trabajo agradable donde se vuelve casi relajante construir tu página web 
  • Las posibilidades en cuanto a personalización son muchas. Efectos, estilo, configuraciones avanzadas. Sin embargo, con Elementor, realmente tienes la sensación de que tienes control sobre casi todo y que puedes divertirte diseñando tu sitio web en WordPress 
  • Una versión gratuita que ya ofrece varios widgets potentes y una versión de pago –asequible- que añade otros, para ir aún más lejos 
  • Un gran catálogo de plantillas para no empezar siempre con una hoja en blanco 
  • Actualizaciones periódicas que aseguran un producto escalable y duradero en el tiempo 
  • Una comunidad activa para ayudarte a encontrar respuestas a tus preguntas.  

Pero, ¿cuál es tu opinión? ¡Esperamos haberte ayudado a entender este increíble recurso para hacer sitios web profesionales!