Para editar el HTML en WordPress tienes tres caminos: usar el bloque HTML personalizado dentro del editor, cambiar un bloque existente a la opción “Editar como HTML”, o modificar los archivos del tema desde Apariencia. Cada método sirve para un caso distinto, desde un pequeño ajuste hasta cambios más profundos en el diseño.

Saber editar el HTML te da control fino sobre tu contenido: insertar un código externo, ajustar una etiqueta o corregir algo que el editor visual no te deja tocar. En esta guía verás cuándo usar cada método y cómo hacerlo paso a paso sin romper tu sitio.

Lo que verás en esta guía

• ¿Cuándo necesitas editar el HTML?
• Editar HTML en el editor de bloques
• Editar el HTML paso a paso
• HTML, CSS y JavaScript: qué es cada uno
• Editar el HTML del tema (con cuidado)
• Editar HTML con un tema hijo
• Errores comunes
• En resumen
• Preguntas frecuentes

¿Cuándo necesitas editar el HTML en WordPress?

El editor visual de WordPress cubre la mayoría de las necesidades, pero hay momentos en los que tocar el HTML directamente es la única o la mejor opción. Estos son los casos más frecuentes:

• Insertar un código de terceros: un mapa, un video, un widget o un formulario externo.
• Añadir atributos concretos a un enlace o una imagen, como rel o target.
• Corregir un formato roto que el editor visual no deja arreglar.
• Pegar código de seguimiento o etiquetas para herramientas de análisis.

Editar HTML en el editor de bloques (Gutenberg)

La forma más segura de editar HTML es dentro del editor de bloques, porque los cambios afectan solo a esa página o entrada, no a todo el sitio. Tienes dos opciones: el bloque HTML personalizado, para pegar código propio, y la opción Editar como HTML de cualquier bloque, para retocar el código que WordPress ya generó.

El bloque HTML personalizado es ideal para insertar código externo. La opción Editar como HTML, en cambio, te muestra el HTML de un bloque de párrafo, lista o imagen para que ajustes etiquetas puntuales sin salir del editor. Cuando termines de retocar, puedes volver a la vista visual con la opción Editar visualmente, y así comprobar el resultado sin buscar entre las etiquetas.

Una ventaja de trabajar dentro del editor de bloques es que cada cambio queda registrado en el historial de revisiones de WordPress. Si algo sale mal, puedes volver a una versión anterior de la página con un par de clics, sin haber perdido nada. Es una red de seguridad que no tienes al editar los archivos del tema.

Cómo editar el HTML en WordPress paso a paso

Veamos el flujo completo para editar HTML dentro de una página o entrada usando el editor de bloques. Es rápido y no requiere tocar archivos del servidor.

Paso 1: Abre la página o entrada en el editor

Entra a tu panel de WordPress, ve a Páginas o Entradas y abre el contenido que quieres editar. Asegúrate de estar en el editor de bloques.

Paso 2: Elige el método según lo que necesites

Para insertar código nuevo, añade un bloque HTML personalizado con el botón +. Para retocar un bloque existente, selecciónalo, abre el menú de opciones (los tres puntos) y elige Editar como HTML.

Paso 3: Escribe o pega tu HTML y comprueba

Introduce tu código HTML. Usa la vista previa para ver el resultado antes de publicar, ya que un error en una etiqueta puede afectar cómo se muestra el contenido. Cuando esté bien, pulsa Actualizar.

1. Abre la página o entrada en el editor de bloques.
2. Para código nuevo, añade un bloque HTML personalizado.
3. Para retocar un bloque, usa la opción Editar como HTML.
4. Escribe o pega tu HTML.
5. Previsualiza el resultado y corrige si algo se ve mal.
6. Pulsa Actualizar para guardar los cambios.

HTML, CSS y JavaScript: qué es cada uno

Al editar código en WordPress conviene distinguir tres lenguajes que a menudo se confunden. El HTML define la estructura y el contenido (títulos, párrafos, enlaces, imágenes). El CSS se encarga del aspecto (colores, tamaños, márgenes). Y el JavaScript añade interactividad (menús desplegables, animaciones, formularios dinámicos).

Si tu objetivo es cambiar cómo se ve algo, muchas veces el ajuste va en el CSS, no en el HTML. WordPress incluye un Personalizador con una sección de CSS adicional donde puedes añadir estilos sin tocar los archivos del tema, lo que es más seguro para retoques visuales. Reserva la edición de HTML para el contenido y la estructura.

Editar el HTML del tema (con cuidado)

Si necesitas cambios más profundos en el diseño, tendrás que editar los archivos del tema (como header.php, footer.php o style.css). Puedes hacerlo desde Apariencia > Editor de archivos de temas, aunque este método es más delicado: un error puede dejar tu sitio inaccesible.

Por eso conviene tener siempre una copia de seguridad antes de tocar el tema, y no editar directamente sobre un tema que recibe actualizaciones, porque sobrescribirían tus cambios. Si tu objetivo es un cambio visual, quizá te convenga más cambiar el tema de WordPress por uno que ya haga lo que buscas.

Editar HTML con un tema hijo o un plugin

La forma correcta de modificar los archivos de un tema sin perder los cambios en cada actualización es usar un tema hijo: una capa que hereda del tema principal y donde guardas tus modificaciones de forma segura.

Si solo quieres insertar código en el head o el footer (por ejemplo, etiquetas de análisis), un plugin específico para ello es más simple y seguro que editar el tema. Encuentra opciones en nuestra guía de los mejores plugins de WordPress.

Errores comunes

• Editar el tema sin copia de seguridad: un error puede tumbar tu sitio. Haz siempre un respaldo antes.
• Modificar el tema padre en lugar de un tema hijo: perderás los cambios en la próxima actualización.
• Dejar etiquetas HTML sin cerrar: rompen la estructura de la página. Revisa que cada etiqueta se cierre.
• Pegar código de fuentes no confiables: puede incluir scripts maliciosos. Usa solo código que conozcas.

En resumen

Editar HTML en WordPress es sencillo si eliges el método adecuado: el bloque HTML personalizado y la opción Editar como HTML para cambios en una página, y los archivos del tema (mejor con un tema hijo y una copia de seguridad) para cambios de diseño. Ante la duda, empieza siempre por el editor de bloques.

¿Buscas un WordPress estable y rápido?
Hosting WordPress con NVMe, copias de seguridad y soporte 24/7.
Ver planes WordPress →

Preguntas frecuentes