En la lección anterior, editores de contenido, hemos visto algunos de los editores de contenido para WordPress más populares.
Para el desarrollo de este curso de WordPress, vamos a trabajar con Elementor ya que es muy fácil de usar y es 100% compatible con Astra, el tema que utilizaremos también en el desarrollo de este curso.
Elementor es un plugin que se instala desde el repositorio de plugins de WordPress y se integra con "casi" cualquier tema WordPress.
https://es.wordpress.org/plugins/elementor/
Para instalar el plugin:
Una vez activo el plugin, nos encontraremos con una página de bienvenida con un vídeo introductorio, para que comencemos a trabajar en nuestro sitio web.
Anuncio publicitario
Al instalar Elementor se crea un elemento de menú llamado Elementor, en el menú principal de WordPress, con una serie de apartados donde se puede configurar el plugin.
Vamos a ver solo los apartados en los que necesitamos hacer cambios. El resto se pueden dejar como están.
Dirígete al apartado Elementor >> Ajustes y, en la pestaña General, verás las siguientes opciones:
Elementor es un plugin tan potente que podríamos diseñar un sitio web, con este plugin, sin necesidad de instalar un tema.
Sin embargo, como es obligatorio tener un tema activo en WordPress, vamos a aprovechar el potencial tanto del tema (en este caso Astra) como de Elementor para conseguir excelentes resultados.
Astra incluye su propia librería de fuentes y opciones de colores por lo que no será necesario utilizar estas opciones del plugin. Marca las casillas para desactivar estas opciones y haz clic en Guardar cambios.
Indica el valor del Ancho del contenido y haz clic en Guardar cambios.
Una vez instalado y configurado Elementor, podemos comenzar a editar nuestras páginas y entradas.
Lectura recomendada...
En la lección del curso de Elementor, panel de edición de Elementor, puedes encontrar información actualizada sobre todas las opciones de edición de este editor de contenidos.
Otra de las grandes bondades que ofrece Elementor es que se pueden diseñar plantillas para luego importarlas en nuestro sitio web. La finalidad de crear plantillas en Elementor es la de ahorrar tiempo y mantener un diseño estandar.
Los tipos de plantillas que podemos crear con Elementor son:
Para que entiendas el uso de las "Páginas" en Elementor, veamos un ejemplo:
Imagínate que vamos a crear el sitio web de un Gimnasio. En nuestro sitio web vamos a ofrecer 4 servicios: Spinning, CrossFit, Pesas y Pilates.
Cada uno de estos servicios tendrá su propia página individual con el mismo formato (imagen principal, título, texto, iconos y formulario de contacto) y solo se diferencian en la imagen principal, el título y el texto. El resto de elementos (iconos y formulario de contacto) serán los mismos para todos.
Lo que tenemos que hacer es crear una plantilla en Elementor del tipo "Página", una sola vez, y la importamos en cada uno de los servicios. Luego modificamos solamente lo que nos interesa (imagen principal, el título y el texto) en cada servicio.
De esta forma no tenemos que repetir el trabajo 4 veces y nos ahorramos tiempo que siempre se traduce en dinero.
Para crear una plantilla en Elementor, dirígete al apartado Plantillas >> Añadir nueva.
Se abrirá una ventana donde tendrás que seleccionar el tipo de plantilla, Página o Sección, escribir el nombre de la plantilla y crearla. Luego, en el apartado Plantillas >> Plantillas guardadas, puedes ver el listado de plantillas que hayas creado.
Una vez hayas creado una plantilla, lo siguiente será insertarla en una página o entrada.
Dirígete al apartado Páginas. Verás el listado de páginas existentes en WordPress pero algo diferentes que al principio.
Cuando editas una página o entrada por primera vez con Elementor (como lo hicimos en el punto 3), Elementor añade un aviso y un enlace directo a cada página o entrada que será visible en el listado de páginas o entradas.
Como puedes apreciar en la imagen anterior, se ha añadido el mensaje Elementor en el título de la página y el enlace Editar con Elementor en el menú de la página.
De esta manera puedes editar la página directamente con Elementor sin tener que entrar primero en la página.
Haz clic en el enlace Editar con Elementor. Una vez dentro, accede a la biblioteca de Elementor haciendo clic en el icono ubicado en el recuadro Arrastra aquí el widget del área de contenido.
En la ventana BIBLIOTECA, haz clic en la pestaña Mis plantillas. Verás un listado de las plantillas creadas.
Haz clic en Insertar para insertar la plantilla en la página o entrada.
En la lección del curso de Elementor, plantillas con Elementor, podrás encontrar información más detallada para crearlas e insertarlas en las páginas y entradas.
Como habrás podido apreciar en los puntos anteriores, Elementor es el editor de contenidos perfecto para diseñar sitios web con WordPress. Es 100% compatible con Astra y ofrece una interfaz agradable de trabajo.
Aunque la versión Lite de Elementor (gratis) ofrece widgets suficientes para crear sitios web "sencillos", desde mi punto de vista, el plugin carece de algunas funciones que solo se podrían conseguir con la versión PRO.
Esto no quiere decir que el plugin no funcione bien. Ten en cuenta que, al ser un plugin FREEMIUM, ofrece una versión Lite para que lo probemos y podamos adquirir la versión PRO si cumple nuestras expectativas.
Te voy a contar una anécdota que me pasó con Elementor:
En el sitio web de un cliente (muy exigente por cierto) tenía instalados 21 plugins que necesitaba para poder hacer todo lo que mi cliente me pedía y el sitio web estaba cargando muy lento.
Aunque es una cantidad razonable de plugins, después de conocer Elementor, me di cuenta que podía prescindir de 9 de ellos ya que Elementor (versión PRO) era capaz de realizar el mismo trabajo de todos estos plugins y hasta mucho mejor.
Simplemente le planteé a mi cliente la opción de hacer un rediseño de su sitio web con Elementor y, la mejora del diseño, funcionalidad y velocidad de carga fué brutal además de reducir el tiempo de trabajo.
Los plugins que eliminamos al instalar Elementor PRO fueron:
Elementor PRO fue capaz de hacer y mejorar todo el trabajo que hacían estos plugins incluyendo la opción de integrar Mailchimp en los formularios de contacto y suscripción.
Además de esto, la versión PRO de Elementor ofrece más funciones para el desarrollo de sitios web profesionales:
Y muchas funciones más que nos permitirán construir un sitio web realmente profesional ahorrándonos tiempo y dinero.
Aunque para el desarrollo de este curso vamos a utilizar la versión Lite (gratuita), vale la pena invertir en la versión PRO ya que todo son ventajas: tienes la opción de realizar diseños más profesionales, mejora la velocidad de carga de tu sitio web al no tener que instalar tantos plugins, entre otras.
Uno de los mejores editores de contenido que puedes instalar para crear un proyecto profesional con WordPress, es Elementor. Ofrece una versión gratuita, que puedes instalar desde WordPress y, una de pago, con excelentes opciones de diseño.
Es rápido, fiable y poderoso. Se adapta perfectamente a "casi" cualquier tema y posee una estructura perfecta para el desarrollo de sitios web profesionales.
Elementor PRO ofrece una completa variedad de widgets y funciones más que suficientes para diseñar sitios web profesionales por lo que no haría falta instalar más plugins en tu sitio web.
Sin embargo, muchos usuarios no tienen la posibilidad económica de comprar la versión PRO del plugin, lo cual es una pena. Si eres uno de estos usuarios, no te desanimes.
Aunque Elementor es el plugin oficial (el sitio web oficial es elementor.com), existen otras empresas que desarrollan plugins para Elementor. Estos plugins suelen ser FREEMIUM o PREMIUM y, muchos de los widgets que ofrecen en la versión Lite (gratis), no se encuentran en la versión Lite de Elementor y funcionan como complemento del plugin.
Muchos de estos plugins se pueden encontrar en el respositorio de plugins de WordPress.
Anuncio publicitario
Ha sido tan excitante crear esta lección que no sabría como concluirla. Sonará repetitivo decir otra vez que Elementor es un potente editor de contenidos con el que se puede desarrollar infinidad de sitios web con una apariencia profesional.
No me gusta el SPAM y se que a ti tampoco. Sólo recibirás información útil sobre WordPress.
Al enviar, confirmas que has leído y aceptas la política de privacidad. Conoce nuestro compromiso con tu privacidad.
Copyright © 2025 Curso de WordPress
Hecho con Venezolano!
Desarrollado con WordPress y diseñado con Hello Theme y Elementor.
hola, pues yo tengo un problema y es que se queda en la pagina de "cargando"pero no me carga Elementor. gracias anticipadas
Hola Javi, puedes echarle un vistazo a este vídeo https://www.youtube.com/watch?v=eFNUY4A485I que a lo mejor te puede ayudar. Un saludo!
Hola Gian: excelente tu curso! Ahora, me he topado con un inconveniente que aún no logro resolver. La cuestión es que importé, desde otra página web que he creado hace un tiempo, una plantilla de Elementor para utilizar en las entradas de mi nueva pagina, Ahora bien, una vez que modifico la entrada con esta plantilla y guardo los cambios, al ver como quedo el trabajo, los cambios no aparecen y en su lugar me aparece una entrada con las características del tema que tengo instalado (Hello) con algunas pequeñas modificaciones hechas con Elementor. Tenés idea de donde puede estar mi error?
Hola German, muchas gracias por tu comentario. He de suponer que has exportado una plantilla del tipo "Single" con variables dinámicas para aplicar en las entradas. Si es así, al exportar la plantilla de origen, solo se exporta la estructura pero no los estilos (colores, tipografías). Si actualmente tienes instalado el tema Hello, la nueva entrada adoptará los estilos que tengas creados pero no los de la plantilla. En caso contrario, podrías indicarme qué tipo de plantilla has exportado de origen? Este suele ser uno de los problemas más frecuentes que se suelen encontrar ya que existen varias plantillas pero cada una tiene una función diferente. Saludos!
Hola Gian: la plantilla es una plantilla creada por mi con elementor para las Entradas del blog, Pero no solo no me toma los estilos de las plantillas como bien decís (colores, tipografías, etc.) sino que tampoco me guarda las modificaciones hechas en cada entrada sin usar plantilla alguna. Predomina el estilo del tema. No se si me explico. Desde ya muchas gracias, por tu respuesta!
Hola Gian buen día! Te escribo para comentarte que ya descubrí cuál es el problema por el cual no podía hacer modificaciones a mis entradas ni a mis páginas correctamente usando Elementor (ni importando una plantilla desde otra web, ni haciendo las modificaciones ahí mismo). El problema es el archivo .htaccess que coloqué en la ruta wp-content/uploads/. Solucionarlo me costó empezar desde cero y reiniciar completamente mi cuenta de hosting! pero FINALMENTE LO LOGRÉ!! jajaja. En cuanto cree ese archivo el problema surgió. Muchas gracias por tu increíble Post es de gran ayuda para aficionados como yo y me entretiene horrores!! jaja
Hola German, me alegra saber que lo hayas podido resolver aunque haya costado un poco. Muchísimas gracias por tus palabras y por haberte tomado la molestia de compartir la solución en los comentarios. Continuaré creando más contenido para que te ayude con el desarrollo de tu sitio web con Elementor. Un abrazo!
Hola empecé a trabajar con elementor Pero cuando vi a usar las plantillas no encontré ninguna... Qué debo hacer para tener acceso a ellas?
Hola Omar, si accedes a las plantillas desde el apartado Plantillas, no vas a encontrar ninguna ya que desde ese apartado solo se listan las que hayas creado. A las plantillas prediseñadas por Elementor, se accede desde cada página o entrada o incluso cuando vayas a crear una plantilla nueva. Saludos!
Buenas,
estoy utilizando Elementor de esta forma: creo Módulos a base de plantillas (canvas), luego creo las páginas que no son más que los módulos importados. El problema es que cuando voy y modifico una plantilla/módulo, las páginas no se actualizan con la información de los módulos importados y tengo que entrar a cada página y re-importar los módulos. Qué estoy haciendo mal? Es decir, quisiera que se actualicen las páginas con la nueva información. Muchas gracias y un saludo
Hola Javier, muchas gracias por escribir. En primer lugar, no utilices el término "módulo" porque se presta a confusión. No es un término que exista en Elementor. En Elementor hay varios tipos de plantillas y, según lo que me indicas, has creado una plantilla del tipo "Página". Estas plantillas suelen ser útiles cuando tienes varias páginas con una distribución muy similar (misma cantidad de secciones, columnas...). Cuando las importas, lo que es útil es la distribución pero, el contenido (colores, textos, imágenes), es independiente de la plantilla. Si modificas el contenido de la plantilla, no se modificará el contenido de la página ya que esta plantilla no funciona así. Lo que tu quieres hacer, puedes hacerlo con plantillas del tipo "Sección". En este caso, creas varias plantillas tipo sección con el contenido que se repetirá en todas las páginas. Luego importas las secciones en cada página y, si modificas la sección desde el apartado Plantillas, se actualizará la información en cada página automáticamente. Espero poder haberte ayudado. Un saludo!
Excelente, voy a probarlo! uno que es novato...
Muchas gracias
Hola, tengo elementor e instalé uno de los sitios que trae astra prediseñados, pero no me funcionan los efectos de entrada en ningún elemento que quiera colocarselo.. ¿Alguna idea?
Hola Elsy, no entiendo muy bien tu pregunta. ¿A qué te refieres con los efectos de entrada? ¿Es algo de Elementor o de Astra? Si pudieras ser un poco más específica con tu pregunta es posible que te pueda ayudar. Saludos!
Efectos de movimiento de elementor, por ejemplo : fade in, fade out.. Etc.. No me funcionan 🙁
Hola Elsy, a mi me pasó lo mismo. El problema se encuentra en el sistema operativo. Yo uso Windows 8 y se encontraban las animaciones desactivadas. En Google puedes buscar algo como "activar animaciones en Windows (o MAC)" y vas a encontrar muchos tutoriales y vídeos. No pongo enlaces ya que, dependiendo del SO que estés utilizando, será diferente pero seguro que con eso podrás ver las animaciones de Elementor. Un saludo!
Gian muchisimas gracias, si era eso... tenia en mi windows 10 las animaciones desactivadas. Que bueno contar con gente dispuesta a ayudar como lo hiciste tu. Bendiciones.
Que bueno que lo hayas podido resolver. Ha sido todo un placer. Saludos!
Hola, tengo una duda, si ya compre el elementor pro, puedo hacer la cancelación de este?
Hola Catherine, si tienes una licencia de Elementor PRO tienes un tesoro en tus manos. No se cuáles son las razones para que quieras devolverla pero piénsatelo bien ya que tienes una herramienta muy poderosa para el desarrollo de sitios web. Estoy comenzando a crear un curso de Elementor donde voy a exprimir este plugin al 100%, tanto la versión gratuita como la PRO que quizá te pueda ayudar. ¿Qué puedes solicitar la devolución del importe? Por supuesto que sí. Te ofrecen 30 días para solicitar la devolución pero yo que tu me lo pensaría. Un saludo!
yo tmb quiero cancelarlo y no veo donde encontrar esas opcion, eso ya deja mucho de que desear
Hola Jorge, ¿por qué quieres hacerlo? Supongo que tendrás que enviar un ticket al soporte de Elementor y solicitar la cancelación. Saludos!