Cómo instalar el constructor de páginas WordPress Elementor: Guía técnica completa

Elementor es un plugin visual de creación de páginas con función de arrastrar y soltar para WordPress que reemplaza el editor de bloques predeterminado con una interfaz de diseño en tiempo real en el front-end. Renderiza los cambios de diseño al instante sin necesidad de recargar la página, lo que lo convierte en uno de los plugins de WordPress más ampliamente adoptados, con más de 10 millones de instalaciones activas en sitios en producción.

Esta guía cubre el proceso de instalación completo tanto para Elementor Free como para Elementor Pro, incluyendo los requisitos previos del lado del servidor, los puntos de fallo más comunes y los pasos de configuración posteriores a la instalación que la mayoría de los tutoriales omiten por completo.

Requisitos previos del servidor y de WordPress

Antes de instalar Elementor, verifique que su entorno de alojamiento cumpla con los requisitos técnicos mínimos. Elementor consume más recursos que un plugin estándar de WordPress debido a su motor de compilación de activos y generación dinámica de CSS.

Requisitos mínimos:

• PHP 7.4 o superior (PHP 8.0+ altamente recomendado para el rendimiento)
• MySQL 5.7+ o MariaDB 10.3+
• WordPress 6.0 o superior
• Al menos 128 MB de límite de memoria PHP (memory_limit en php.ini), aunque 256 MB o más es el estándar práctico en producción

WP_DEBUG debe estar desactivado en sitios en producción para evitar que la salida de depuración de Elementor interfiera con el renderizado
Un certificado SSL válido activo en el dominio — el editor de Elementor se carga a través de HTTPS y fallará o mostrará advertencias de contenido mixto en HTTP simple

Si está ejecutando un entorno de VPS Hosting, tiene acceso directo a php.ini o a la configuración del pool PHP-FPM, lo que le permite ajustar con precisión memory_limit, upload_max_filesize y max_execution_time. Los entornos compartidos suelen limitar estos valores a los predeterminados, lo que puede provocar que el editor de Elementor agote el tiempo de espera o falle al guardar.
Para verificar su límite de memoria PHP actual desde el área de administración de WordPress, navegue a Herramientas > Estado del sitio > Información > Servidor.
Paso 1: Inicie sesión en su panel de administración de WordPress
Navegue a la página de inicio de sesión de administración de su sitio. La ruta predeterminada es /wp-admin añadida a su dominio:
https://yourdomain.com/wp-admin
Ingrese sus credenciales de administrador y haga clic en Iniciar sesión. Debe estar conectado como usuario con el rol administrator — los roles de Editor o Autor no tienen privilegios de instalación de plugins.
Paso 2: Navegue al instalador de plugins
Desde el menú de administración del lado izquierdo, vaya a Plugins > Añadir nuevo plugin. Esto abre el navegador del directorio de plugins de WordPress, que consulta la API del repositorio de plugins de WordPress.org en tiempo real.
Si su servidor está detrás de un firewall restrictivo o tiene outbound_connections bloqueado a nivel de red, esta página puede cargarse sin resultados. En ese caso, deberá instalar el plugin manualmente a través de SFTP o usar WP-CLI (explicado a continuación).
Paso 3: Busque y localice Elementor
En el campo de búsqueda de la página Añadir plugins, escriba Elementor. El plugin que busca es Elementor Website Builder de Elementor.com. Confirme lo siguiente antes de instalar:

Autor: Elementor.com
Instalaciones activas: más de 10 millones
Última actualización: dentro de los últimos 60 días (una fecha de actualización antigua es una señal de alerta para cualquier plugin)
Probado hasta: debe coincidir o estar cerca de su versión actual de WordPress

No confunda el plugin gratuito con paquetes de complementos de Elementor de terceros que aparecen en los mismos resultados de búsqueda. Estos son plugins separados que amplían Elementor pero no son el constructor principal en sí.
Paso 4: Instale y active Elementor
Haga clic en Instalar ahora junto a la entrada de Elementor Website Builder. WordPress descargará el archivo del plugin desde el CDN de WordPress.org y lo extraerá en su directorio wp-content/plugins/.
Una vez completada la descarga, la etiqueta del botón cambia a Activar. Haga clic en él. WordPress registra el plugin, carga su archivo de arranque y le redirige a la pantalla de incorporación de Elementor.
Lo que ocurre internamente durante la activación:

Elementor crea sus propias tablas de base de datos (elementor_library, entradas de meta de publicaciones personalizadas)
Registra un tipo de publicación personalizado para la Biblioteca de plantillas
Genera un directorio de caché CSS en wp-content/uploads/elementor/css/

• Encola sus activos del editor de forma condicional (solo cuando el editor de Elementor está activo, no en cada carga de página)

Si la activación falla con un error fatal, las causas más comunes son una versión de PHP inferior a 7.4, un límite de memoria demasiado bajo para cargar el autocargador del plugin, o un plugin en conflicto que se engancha a plugins_loaded incorrectamente.

Paso 5: Instalación con WP-CLI (recomendado para administradores de servidor)

Si gestiona WordPress desde la línea de comandos — que es el flujo de trabajo preferido en cualquier VPS con cPanel o servidor bare-metal — use WP-CLI para instalar y activar Elementor sin necesidad de usar el navegador:

wp plugin install elementor --activate --allow-root

Para verificar que la instalación se realizó correctamente:

wp plugin status elementor

Para actualizar Elementor más adelante sin iniciar sesión en el panel de administración:

wp plugin update elementor

WP-CLI es significativamente más rápido que el instalador gráfico y es scriptable, lo que lo hace ideal para el aprovisionamiento automatizado de servidores, la clonación de entornos de staging o los pipelines CI/CD que despliegan configuraciones de WordPress.

Paso 6: Complete el asistente de configuración de Elementor

Tras la activación, Elementor lanza un asistente de configuración. Las decisiones clave aquí tienen implicaciones técnicas duraderas:

Nombre del sitio y logotipo: Estos se incorporan a la Configuración global del sitio de Elementor y son referenciados por el Theme Builder si lo utiliza más adelante.

Colores y fuentes predeterminados: Elementor mantiene su propio sistema de diseño global independiente de la hoja de estilos del tema de WordPress activo. Si define colores globales aquí, se almacenan en la base de datos de Elementor y se aplican mediante CSS en línea generado dinámicamente — no en el style.css de su tema. Esto es importante entenderlo al depurar conflictos de especificidad CSS.

Selección de kit de plantillas: Los kits de plantillas son conjuntos de páginas prediseñadas que importan múltiples páginas, configuraciones globales y a veces dependencias de plugins de terceros simultáneamente. Si selecciona uno, Elementor importará una cantidad significativa de contenido en su base de datos. En un sitio nuevo esto está bien; en un sitio existente con contenido, evalúe cuidadosamente si las plantillas importadas entrarán en conflicto con las estructuras de página existentes.

Puede omitir el asistente por completo y configurar todo manualmente a través de Elementor > Ajustes en el menú de administración.

Paso 7: Cree su primera página con Elementor

Para crear una nueva página usando el editor de Elementor:

1. Vaya a Páginas > Añadir nueva página en el administrador de WordPress.
2. Ingrese un título para la página.
3. En el panel derecho bajo Atributos de página, establezca la plantilla en Elementor Full Width o Elementor Canvas (Canvas elimina el encabezado y el pie de página por completo, útil para páginas de destino).
4. Haga clic en Editar con Elementor.

El editor de Elementor se carga en un iframe de pantalla completa. El panel izquierdo contiene la biblioteca de widgets y los ajustes; el panel derecho es el lienzo en vivo.

Conceptos estructurales clave en el editor de Elementor:

• Secciones (o Contenedores en modo Flexbox): Los contenedores de diseño de nivel superior. Cada sección abarca el ancho completo de la página.
• Columnas: Subdivisiones dentro de una sección que controlan el diseño horizontal.
• Widgets: Elementos de contenido individuales (texto, imagen, botón, vídeo, formulario, etc.) colocados en columnas.
• Contenedor Flexbox: El modelo de diseño más reciente de Elementor (que reemplaza el modelo Sección/Columna) que usa CSS Flexbox de forma nativa, dándole un control más preciso sobre la alineación y el comportamiento responsivo.

Para guardar su trabajo, haga clic en el botón Publicar o Actualizar en la parte inferior del panel izquierdo. Elementor guarda los datos de la página como JSON serializado en la tabla post_meta bajo la clave _elementor_data.

Instalación de Elementor Pro (versión premium)

Elementor Pro es un plugin con licencia separada que se instala junto a la versión gratuita — no la reemplaza. El plugin gratuito debe permanecer instalado y activo para que Elementor Pro funcione.

Qué añade Elementor Pro

Cómo instalar Elementor Pro

1. Adquiera una licencia en el sitio web oficial de Elementor y descargue el archivo elementor-pro.zip desde el panel de su cuenta.
2. En su administrador de WordPress, vaya a Plugins > Añadir nuevo plugin.
3. Haga clic en Subir plugin en la parte superior de la página.
4. Haga clic en Elegir archivo, seleccione el archivo elementor-pro.zip y haga clic en Instalar ahora.
5. Una vez completada la instalación, haga clic en Activar plugin.
6. Navegue a Elementor > Licencia en el menú de administración e ingrese su clave de licencia para activar las funciones Pro y habilitar las actualizaciones automáticas.

Instalación de Elementor Pro mediante WP-CLI

Si ya tiene el archivo .zip en su servidor (transferido mediante SFTP), instálelo directamente:

wp plugin install /path/to/elementor-pro.zip --activate --allow-root

Reemplace /path/to/elementor-pro.zip con la ruta real del archivo en su servidor.

Activación de licencia mediante WP-CLI

WP-CLI no gestiona de forma nativa la llamada a la API de activación de licencia de Elementor, por lo que aún necesita ingresar la clave de licencia a través de la interfaz de administración de WordPress en Elementor > Licencia, o usar los propios comandos CLI de Elementor si están disponibles en su versión Pro.

Elementor Free vs. Pro: comparación completa

Consideraciones de rendimiento y errores comunes

Elementor genera archivos CSS por página almacenados en wp-content/uploads/elementor/css/. En sitios con mucho tráfico, este directorio puede acumular cientos de archivos. Regenerar periódicamente la caché CSS a través de Elementor > Herramientas > Regenerar CSS y datos mantiene estos archivos limpios y evita que se sirvan estilos obsoletos.

Errores críticos que se deben evitar:

• Activar la Carga mejorada de activos en la configuración de rendimiento de Elementor reduce el número de scripts y hojas de estilo cargados en páginas que no usan widgets de Elementor. Está desactivado por defecto, pero debería activarse en la mayoría de los sitios en producción.
• La carga de fuentes en línea de Elementor puede entrar en conflicto con la cola de Google Fonts de su tema. Desactive la carga duplicada de fuentes en Elementor > Ajustes > Avanzado > Google Fonts.
• Frecuencia de guardado automático: Elementor guarda automáticamente los borradores cada 30 segundos por defecto. En servidores de base de datos lentos o alojamiento compartido con alta latencia de E/S, esto puede causar retrasos en el editor. Si está en un entorno de Servidores dedicados, esto rara vez es un problema, pero en alojamiento compartido puede manifestarse como el editor volviéndose irresponsivo.
• Conflictos de plugins: Elementor es incompatible con ciertos plugins de caché que minimizan o combinan JavaScript de forma agresiva. Si el editor no carga, desactive temporalmente su plugin de caché y pruebe de nuevo.
• Proxy inverso y caché de borde CDN: Si su sitio está detrás de Cloudflare o un proxy similar con caché HTML agresiva, el editor de Elementor puede cargar una versión en caché de una página en lugar de la versión editable en vivo. Asegúrese de que la ruta /wp-admin/ y las URLs del editor de Elementor estén excluidas de las reglas de caché de borde.

Recomendaciones de entorno de alojamiento

El editor de Elementor es una aplicación de página única con gran carga de JavaScript. Su rendimiento está directamente vinculado al tiempo de respuesta del servidor, la velocidad de ejecución de PHP y la eficiencia de las consultas a la base de datos.

Para sitios WordPress en producción que ejecutan Elementor Pro con WooCommerce o grandes bibliotecas de plantillas, un entorno de VPS Hosting con al menos 2 vCPUs y 4 GB RAM proporciona el margen necesario para un rendimiento fluido del editor y un renderizado rápido del front-end. La capacidad de configurar OPcache, caché de objetos Redis y pools de trabajadores PHP-FPM en un VPS marca una diferencia medible en comparación con los entornos compartidos.

Si está creando sitios para clientes a escala o gestionando una red multisitio de WordPress con Elementor, explore los Paneles de control VPS que le permiten aprovisionar y gestionar múltiples entornos aislados desde una única interfaz.

Para sitios que requieren HTTPS (que el editor de Elementor necesita), asegúrese de tener un Certificado SSL válido instalado y correctamente configurado antes de intentar abrir el editor de Elementor. Un certificado autofirmado o un certificado caducado hará que el iframe del editor sea bloqueado por la política de contenido mixto del navegador.

Lista de verificación técnica de puntos clave

Antes de publicar un sitio con Elementor, verifique cada uno de los siguientes puntos:

• La versión de PHP es mínimo 7.4, preferiblemente 8.0+; memory_limit está configurado en 256 MB o más
• El certificado SSL es válido y HTTPS está aplicado en todo el sitio
• El experimento Carga mejorada de activos de Elementor está activado en Elementor > Ajustes > Experimentos
• La caché CSS se ha regenerado después de finalizar todos los cambios de diseño
• Un plugin de caché está configurado con las URLs del editor de Elementor excluidas de las reglas de caché
• La clave de licencia de Elementor Pro está activada y las actualizaciones automáticas están confirmadas como funcionales
• El directorio wp-content/uploads/elementor/ tiene permisos de escritura para el proceso del servidor web
• WP-CLI está disponible en el servidor para futuras actualizaciones de plugins y tareas de mantenimiento
• Google Fonts no se está cargando dos veces (una vez por el tema y otra por Elementor)
• Las copias de seguridad regulares de la base de datos incluyen la tabla post_meta, donde se almacenan todos los datos de páginas de Elementor

Preguntas frecuentes

¿Elementor funciona con cualquier tema de WordPress?

Elementor es compatible con la mayoría de los temas de WordPress bien codificados. Sin embargo, para la funcionalidad completa del Theme Builder (encabezados, pies de página y plantillas de archivo personalizados), el tema activo debe admitir los hooks body_class(), wp_head() y wp_footer(). El tema gratuito “Hello Elementor” de Elementor.com está diseñado específicamente para ser un tema base sin interferencias.

¿Por qué el editor de Elementor no carga después de la instalación?

Las causas más comunes son: límite de memoria PHP inferior a 128 MB, un conflicto de JavaScript con otro plugin (pruebe desactivando temporalmente todos los demás plugins), un certificado SSL caducado o inválido que hace que el iframe del editor sea bloqueado, o un firewall a nivel de servidor que bloquea los endpoints de la API REST que Elementor usa para la comunicación entre el editor y el backend.

¿Se puede instalar Elementor en WordPress Multisite?

Sí. Elementor puede activarse en toda una instalación de WordPress Multisite. Cada subsitio mantiene su propia configuración de Elementor, biblioteca de plantillas y caché CSS. Las licencias de Elementor Pro son por dominio, así que verifique que su nivel de licencia cubra el número de sitios en su red.

¿Cuál es la diferencia entre las plantillas Elementor Canvas y Elementor Full Width?

Elementor Canvas elimina todos los elementos generados por el tema — encabezado, pie de página y barra lateral — dándole un lienzo completamente en blanco. Está diseñado para páginas de destino independientes y pantallas de inicio de sesión personalizadas. Elementor Full Width elimina la barra lateral pero mantiene el encabezado y el pie de página del tema intactos, lo que lo hace adecuado para páginas de contenido estándar donde la navegación del sitio debe permanecer visible.

¿Afecta Elementor a la velocidad del sitio y a los Core Web Vitals?

Elementor sí añade sobrecarga de CSS y JavaScript en comparación con una página codificada a mano. Sin embargo, con una configuración adecuada — activando el experimento de Carga mejorada de activos, usando un CDN, habilitando OPcache en el servidor y minimizando el número de plugins de complementos de Elementor de terceros — los sitios con Elementor pueden lograr puntuaciones sólidas en Core Web Vitals. La variable de rendimiento más importante es la infraestructura de alojamiento, no Elementor en sí.