Si eres un aficionado o profesional del diseño web, te habrás percatado de todas las posibilidades de composición de los sitios web que existen. Personalmente pienso que el mercado ha ido evolucionando muy favorablemente, adaptándose a la demanda que ha ido cambiando. Esto, ha generado que no se necesiten conocimientos especiales de código y programación para trabajar en el mundo web, y por eso vengo a hablar de por qué Elementor Pro es la mejor opción para crear tu web en WordPress.
Nacimiento de Elementor
Si llevas algunos años moviéndote en este mundo de WordPress, el lanzamiento de Elementor Page Builder en junio de 2016, también habrá marcado un antes y un después en tu vida como diseñador web. Elementor revolucionó completamente el mercado de la maquetación web, llegando en 10 meses a lograr más de 100000 descargas.
Para empezar, es increíble que cualquier producto nuevo que salga al mercado, sea como sea, logre esa cantidad de uso en tan poco tiempo. Y debido a esto, en diciembre de 2016, Elementor saca su versión para profesionales, una versión de pago llamada Elementor Pro.
Cómo funciona Elementor
Elementor nace como uno de los mejores editores visuales, incorporando la característica de “drag and drop”, arrastrar y soltar los elementos para verlos en acción en la vista previa. Esto cambió por completo la manera de diseñar una web en WordPress, ya que se agilizó muchísimo el proceso, y sin necesidad de añadir código de ningún tipo. La principal ventaja que implementó este maquetador, es la de visualizar en directo los elementos que se van añadiendo, ya que ofrece una vista previa de la página o el elemento en edición, donde al colocar los widgets del menú, se pueden ver tal cual los vería un usuario al entrar en la web.
Elementor Page Builder en su versión gratuita
La versión gratuita de Elementor, ya aporta más de 30 widgets para implementar en tu sitio web, dejando una libertad de personalización y funcionalidad increíble. Además de esto, cualquiera de los widgets escogidos, se puede cambiar por completo de arriba abajo, lo que hace dejar de tener dependencia del theme escogido para visualizar de una forma u otra, ciertos elementos.
El menú de widgets que ofrece este maquetador, es completamente intuitivo y la interfaz de uso es una de las más sencillas de utilizar. No hay en el mercado, otro maquetador visual gratuito que ofrezca características similares, con la completa personalización que ofrece Elementor. También permite guardar los diseños creados para poder utilizarlos en otras ocasiones, con la paleta de colores que hayas agregado. Los elementos que ofrece son, además de los básicos: columnas, encabezados, cuadros de texto, imágenes, botones… widgets que permiten incrustar otros elementos más especiales, como carruseles de imágenes, iconos, mapas de Google Maps, listas y conmutadores de información, barras de progreso…
Ahora, la pregunta es, si merece la pena escoger la versión Pro de Elementor.
Elementor Pro es la mejor opción para crear tu web en WordPress
Si todo lo que he expuesto anteriormente te ha parecido increíble, en este punto hay que tomar nota por que son tantas las cosas que ofrece Elementor Pro, que en ocasiones es imposible utilizarlas todas.
Widgets que añade Elementor Pro
Los widgets que añade la versión pro de Elementor, son 29 funciones básicas completamente personalizables. A las que se le añaden widgets específicos del theme, y widgets específicos para WooCommerce.
Vamos a hacer un repaso por los más útiles que tienen funciones resolutivas para todo tipo de cuestiones web.
Posts
Este widget permite colocar la vista previa de los posts de nuestro blog de la manera que queramos. Se puede personalizar la visualización tanto de la imagen destacada, título, contenido, datos de la entrada… Teniendo en cuenta que esta visualización se puede incrustar en cualquier sitio de la web, no hace falta que sea una página específica. Nos da la opción también de mostrar un orden determinado en las entradas, o mostrar solo las que tengan una categoría o sean de un autor específico. También nos deja personalizar el número de posts que queremos mostrar en la vista previa y si queremos meter una paginación para que el usuario pueda navegar y ver todas las entradas sin necesidad de meterse en ninguna.
Formularios
Con este widget podrás crear formularios de contacto directamente con Elementor. Además, te da todas las opciones posibles de visualización, dando alternativas de añadir y quitar tantos campos como sean necesarios, y ajustar el tamaño, la forma, la etiqueta y la letra de cada apartado. La configuración de estos formularios es tan intuitiva como su maquetación.
Login
El login permite crear páginas de inicio de sesión completamente personalizadas, adaptadas al diseño general de tu web y con todos los elementos necesarios para que cualquier persona pueda registrarse, recuperar su contraseña en caso de haberla perdido, acceder al apartado personal iniciando sesión y por supuesto todo esto con un abanico infinito de opciones de personalización de diseño. Combinado con otras herramientas que explicaré más adelante, este widget permite hacer cosas muy chulas que además captarán la atención del usuario y generarán más audiencia.
Nav menú
El lugar del menú ya no va a ser un quebradero de cabeza, con este widget podemos incrustar en cualquier sitio que queramos, un menú que hayamos creado desde el panel de administración. Por supuesto puede configurarse también en versión móvil y como siempre, con infinitas posibilidades de personalización. Además podemos añadir animaciones predeterminadas para cuando el usuario pase el ratón por encima de los elementos del menú, como cambio del color del fondo, del tamaño de la letra o un subrayado.
Animated headline
Permite crear un título animado en el texto vaya apareciendo de diferentes formas para llamar la atención del usuario, esto puede generar muchas ventajas cuando queremos resaltar una información importante y nos interesa que el usuario fije su atención en ella.
Price list y Price table
Para mostrar servicios o productos, con sus precios y prestaciones, estos widgets son la mejor herramienta que podemos utilizar. Nos dejan crear una lista de precios de cada servicio que queramos mostrar, y en formato de tabla, mostrar diferentes precios para un mismo servicio, y las prestaciones que incluye cada uno de ellos. Completamente personalizable en cuanto a colores, tamaño, tipografía o formato.
Table of content
Como en este blog, Elementor ofrece la opción de poner una lista de los contenidos de la página que se está visualizando, con anclas de menú incluidas que permiten a usuario navegar por el contenido con velocidad y saltarse las partes que no quiera leer.
Hotspot
Con este widget tenemos la capacidad de meter imágenes y señalar en ellas puntos de información. Puede que suene un poco confuso, pero se utiliza mucho en catálogos de productos, donde hay un marcador en cada producto, que a ser pulsado abre un pop up con la información del producto y un enlace a la página del mismo. Es una forma de unir información de una forma visual y hacer una gran panorámica que muestre varios productos o elementos informativos a la vez, sin que el visitante se agobie por ver tanta información junta.
Añadir código CSS para una completa personalización
Cada widget tiene la opción de añadir un código CSS al módulo para completar la personalización si se desea. Es cierto que aquí podemos necesitar algo de código, pero permite customizar absolutamente todos los elementos que nos podemos imaginar.
Ajustes globales y Theme Builder
Para mí, esta es la mejor parte que ofrece Elementor Pro, que desde que ha incorporado el Theme Builder nos deja olvidarnos del theme y personalizar nuestra web de principio a fin como si fuera un folio en blanco.
Ajustes globales
Esta vez desde el propio menú de Elementor Pro, en la sección de ajustes globales podeos escoger qué características generales queremos implementar en todo el sitio web. Aunque después nos va a permitir editar una a una, esto nos va a dar la capacidad de dar una completa personalización a toda la web en unos minutos.
Colores y tipografías
Aquí es el momento de poner a trabajar la parte creativa de nuestro cerebro. Si tenemos claro como queremos que sea vea nuestra web, solo tenemos que introducir los colores y las tipografías y tamaños de letra que queremos usar en los H1, H2, H3, cuadros de texto, enlaces, énfasis, botones… Pero además también va a permitirnos hacer ciertos ajustes globales, como la visualización de las imágenes, la estructura general de las páginas o el fondo.
También podemos cargar nuestras propias tipografías o bibliotecas de iconos personalizados para cada sitio web.
Theme Builder
En realidad podría hacer un artículo (y seguramente más de uno) hablando de la revolución que ha supuesto el Theme Builder de Elementor Pro, que se ha convertido en la solución más rápida, sencilla y eficaz que conozco para trabajar con WordPress.
La principal característica del Theme Builder, es que nos permite crear plantillas para controlar como se va a mostrar el contenido, y podemos personalizar todos los aspectos de la web, y cuando digo todos, me refiero a todos.
Header y Footer
Elementor Pro nos hace poder desvincularnos del theme escogido y tener por delante toda la libertad para dar rienda suelta a nuestra creatividad. Nos va a permitir configurar y diseñar tanto el header, como el footer de la web; en los que podremos incluir cualquiera de los widgets anteriormente mencionados.
Pero no solo esto, si no que también podremos escoger animaciones de entrada, disposición en movimiento de los elementos, efectos sticky para mantener el menú siempre visible en la parte superior de la web, y todo lo que podamos imaginar. Para estas funciones, no es necesario utilizar ningún tema premium, pues con el tema Hello de los desarrolladores de Elementor, tenemos banda ancha para hacer lo que queramos con nuestra web.
Plantillas para páginas, entradas o secciones
Elementor Pro va a permitirnos hacer plantillas sobre las que automáticamente, se colocará el contenido. Es decir, nos una gran ventaja compositiva sobre la arquitectura del sitio web, pues simplemente con crear una plantilla para las páginas, para las entradas, incluso para mostrar ciertas secciones, podemos controlar como se muestra todo el contenido que queramos modificando únicamente la plantilla que lo estructura.
Además, Elementor Pro cuenta con una biblioteca de plantillas prediseñadas, de donde podemos coger ideas o inspiración, o por qué no, usar alguna de ellas. Aunque yo soy más partidario de diseñar todo desde cero ya que esta herramienta lo permite.
Plantilla para tienda y páginas de producto
Aquí tenemos la solución a uno de los mayores quebraderos de cabeza que había en el ámbito de la tienda online en WordPress. Ya que WooCommerce no tiene tanta capacidad de personalización, y nos hacía ser esclavos del tema escogido y el formato que le diera a la página de tienda y de productos.
Pero eso se acabó, pues el Theme Builder nos permite crear desde cero la plantilla que queramos para nuestra página de tienda, para mostrar todos los productos o categorías, y para las páginas individuales de producto. Donde nos permitirá añadir, además de la información que pide por defecto WooCommerce, cualquier widget que queramos en esta plantilla.
Cuando estamos maquetando esta plantilla, podremos utilizar los widgets específicos de Elementor Pro para WooCommerce, donde nos dará diferentes opciones de visualización, movimiento, llamadas a la acción, uso de reseñas… incluso nos dejará personalizar el botón de añadir al carrito y la forma en la que se muestre.
En definitiva, que la tienda online donde podremos personalizar cada detalle, será un éxito seguro si sabemos hacer uso de la libertad que nos da el Theme Builder en este aspecto.
Pop ups
Y la última función de la que voy a hablar en este post, es la de los Pop Ups de Elementor Pro. Esta herramienta nos va a permitir editar a nuestro gusto el Pop Up en cuanto a diseño y visualización, sin límites ni restricciones de contenido. También, colocar esta ventana emergente en el lugar que queramos, en el centro de la pantalla, en una esquina, a un lado del contenido o donde se nos ocurra.
Pero no solo esto, si no que las opciones avanzadas del Pop Up nos dejan configurar cuándo y cómo se va a mostrar al usuario, y de qué manera se puede cerrar. Nos deja un nivel de personalización hasta el punto de poder configurar que aparezca después de un número determinado de visitas a una página o al venir de una dirección web determinada.
Elementor Pro como solución definitiva
En definitiva, ha quedado muy claro por qué Elementor Pro es la mejor opción para crear tu web en WordPress, ya que es una herramienta que nos va a permitir dejar de usar un montón de plugins y código para personalizar un sitio web, ya que engloba todas las utilidades en una misma solución.
Si alguien se sigue preguntando si merece la pena pagar por la versión profesional del editor, mi respuesta es sí, merece mucho la pena. Y más aún para agencias y diseñadores que se dediquen a hacer trabajo web para clientes, ya que podrán tener completa customización de todos los elementos que quieran, y un control y actualizaciones mucho más rápidos y eficaces.
También viene incluida la licencia Pro de Elementor con soporte gratuito en cualquier momento, para resolver dudas o solventar algún problema que se pueda presentar, y actualizaciones ilimitadas de las diferentes versiones que vayan saliendo.
Elementor llegó para quedarse, y ha sido la joya de la corona de los maquetadores web.
