Formateador de HTML (indentación + copia)
Esta herramienta formatea tu fragmento HTML aplicando sangría legible. Pega el HTML en la ventana izquierda, pulsa Aplicar indentación y verás el resultado en la ventana derecha. Después, usa Copiar para llevar el resultado al portapapeles.
Entrada (pega tu HTML aquí)
Recomendación: pega fragmentos de HTML (por ejemplo, el contenido de un artículo, un bloque o un componente).
Las etiquetas <script>, <style>, <pre> y <textarea> se respetan sin cambios.
Consejo: si vas a formatear HTML generado automáticamente (por ejemplo, por un editor visual), revisa el resultado y elimina atributos innecesarios antes de publicar.
Salida (HTML indentado)
Aquí verás el HTML con sangría. No se ejecuta ningún script pegado; es seguro para inspeccionar el código formateado.
Si tu navegador no permite copiar de forma directa, el botón usará un método alternativo y te avisará.
Cómo usarlo paso a paso
- Abre el editor: verás dos ventanas (entrada a la izquierda, salida a la derecha en PC).
- Pega tu HTML en Entrada. Si quieres, pulsa Cargar ejemplo para ver una muestra.
- Elige el tipo de sangría: Espacios (con tamaño 2/3/4/8) o Tabuladores.
- Opciones:
- Eliminar líneas en blanco repetidas: compacta saltos excesivos.
- Mantener en línea los textos cortos: evita saltos cuando un nodo solo tiene una frase breve.
- Pulsa Aplicar indentación. Revisa el resultado en Salida.
- Pulsa Copiar para llevar el resultado al portapapeles y pégalo en tu editor o CMS.
Si necesitas dos columnas en escritorio y una en móvil, tu tema de WordPress debe definir el layout de .layout y .pane.
(Hay una sugerencia de CSS en comentario al final del documento.)
¿Qué hace exactamente el formateador?
- Identifica cada etiqueta y aplica sangría según la jerarquía DOM.
- No “rompe” bloques sensibles:
<script>,<style>,<pre>,<textarea>se dejan intactos. - Las etiquetas vacías (void) como
<br>,<img>,<input>, etc., no se cierran. - Los textos con una sola frase corta pueden quedar en línea con su etiqueta (si la opción está activa) para mayor compacidad.
