HTML to Elementor
Volver a los tutoriales

Pegar HTML en Elementor de forma segura: qué se elimina y por qué

Pegar HTML en un sitio WordPress en producción es un acto de confianza, sobre todo cuando ese HTML viene de una plantilla, de una IA o de la página de otra persona. El método más seguro no es la cautela: es saber exactamente qué se elimina antes de que nada llegue a tu editor. Aquí tienes esa lista y las prácticas que cubren el resto.

Dos listas: lo que se elimina durante la conversión — scripts, hojas de estilo externas, acciones de formularios y enlaces peligrosos — y lo que no se puede inferir del HTML estático, como estados hover, animaciones y contenido de pseudoelementos.
Dos razones diferentes por las que algo no se transmite: se eliminó a propósito por seguridad, o simplemente no se puede expresar en una página estática.

Qué se elimina antes de que llegues a pegar

La conversión se ejecuta por completo en tu navegador, y el resultado son datos de Elementor, no el marcado original. Por el camino, esto se elimina o se neutraliza:

  • Todas las etiquetas script. No sobrevive ningún JavaScript del origen, sin excepciones. Todo lo interactivo llega como marcado estático para que lo reconstruyas con los widgets propios de Elementor.
  • Todos los manejadores de eventos en línea. Atributos como onclick y onmouseover se quitan de cada elemento uno por uno: la forma clásica de colar scripts en un marcado que “no tiene etiquetas script”.
  • Los destinos de los formularios. Se eliminan los atributos action y method del formulario. Los campos visibles se conservan, pero un formulario pegado nunca podrá enviar en silencio los datos de tus visitantes a quien escribió la página original.
  • Incrustaciones desconocidas. Las etiquetas object, embed y applet se bloquean. Los iframes se permiten desde exactamente cuatro hosts —YouTube, su variante nocookie y el reproductor de Vimeo— y se convierten en widgets de Vídeo; cualquier otro iframe no se traslada como marco activo. El atributo srcdoc, que puede esconder un documento entero dentro de una etiqueta iframe, también se elimina.
  • Destinos de enlace peligrosos y CSS arriesgado. Los destinos de los enlaces y las declaraciones de estilo se limpian en lugar de copiarse tal cual.

Todo lo eliminado aparece en el informe de seguridad de la pantalla de resultados, así que no es una política silenciosa: puedes leer exactamente qué se quitó de tu página concreta antes de pegarla.

Por qué el CSS no puede filtrarse a tu tema

El riesgo más sutil de pegar HTML con estilos no es la malicia, sino la colisión: que la hoja de estilos de la página de origen declare body { font-family: … } o h2 { color: … }, y que esas reglas cambien el aspecto de todo tu sitio.

Para evitarlo, los estilos trasladados se acotan. Cada selector del CSS importado se reescribe para que solo se aplique dentro del contenido importado, y los selectores que apuntan a html, body o :root se reasignan al propio bloque importado en lugar de dejar que alcancen tu página. La sección importada conserva su aspecto; tu tema nunca ve esas reglas.

Por la misma razón, position: fixed se rebaja a absolute durante la conversión: de lo contrario, un elemento fijo de la página de otra persona flotaría sobre todo tu sitio, en cada página que use la plantilla.

Lo que “seguro” no significa

Dos límites, con honestidad. Primero, la herramienta no puede revisar tu contenido: si el HTML contiene textos, imágenes o enlaces sobre los que no tienes derechos, convertirlo no cambia eso. Segundo, la eliminación se ocupa de qué se ejecuta y adónde van los datos; no revisa lo que la página dice. Lee lo que pegas.

Buenas prácticas antes de pegar

  • Convierte, nunca pegues en bruto. La vía peligrosa es pegar marcado de terceros tal cual en un widget HTML: ese camino no elimina nada y trae todo lo que contenía el origen. Convertir a widgets nativos es la capa de seguridad.
  • Lee el informe de seguridad en la pantalla de resultados. Si indica cuatro scripts eliminados y un formulario limpiado, sabes qué comportamiento tienes que reconstruir, y qué estaba haciendo la página original.
  • Pega primero en un borrador. No porque la conversión sea arriesgada, sino porque la revisión del diseño debe hacerse en una página que nadie está visitando.
  • Reconecta los formularios de forma deliberada. El destino de envío se eliminó a propósito; conecta el widget Formulario de Elementor a tus propias acciones en lugar de buscar el destino original.
  • Mantén copias de seguridad en cualquier caso. Un consejo estándar para cualquier importación de cualquier tipo, con cualquier herramienta.

Y tu propio HTML nunca sale de tu navegador

La seguridad también funciona en el otro sentido. La página que conviertes se analiza, se renderiza y se convierte localmente: tu HTML y tus imágenes no se suben a este sitio ni a ningún otro lugar, no existe ninguna cuenta que pueda filtrarse y nada toca tus credenciales de WordPress. La herramienta produce datos; tú decides qué ocurre con ellos, dentro de tu propio editor.

El método más seguro, en un párrafo

Convierte en modo de componentes nativos en lugar de pegar HTML en bruto en un widget. Lee el informe de seguridad. Pega en un borrador, reconstruye las partes interactivas con los widgets propios de Elementor, reconecta el formulario a tu sitio y publica cuando se vea bien en los tres puntos de ruptura. Ese es todo el método: la eliminación descrita arriba se ocupa de la parte que no puedes ver, y la lista de comprobación se ocupa de la que sí.

Escrito por Leo

Nueve años de WordPress y Elementor; 189 sitios migrados. Cada regla de este convertidor viene de un proyecto real. Acerca de esta herramienta