Dic202013

Convertir HTML a texto plano

Cuando vamos a publicar en nuestro blog un código html, o mostrarlo en un comentario, a veces necesitamos convertirlo a texto plano para que el navegador no interprete dicho código. Puedes hacerlo on-line con nosetup.org

Si no quieres usar el servicio on-line, se puede hacer manualmente sustituyendo los caracteres menor que y mayor que por sus entidades html:

&lt; para <
&gt; para >

Por otro lado, el código convertido a texto plano puede ir entre las etiquetas:

<code> </code>

Pero cuando las lineas de código son, por ejemplo, demasiado largas se puede perder formato y puede que se vea el código con líneas partidas, espacios de más o de menos, etc.

Para mantener el formato, podemos añadir las etiquetas:

<pre> </pre>

Por lo que una buena forma de escribir nuestro código convertido a texto plano es la siguiente:

<pre>
<code>CÓDIGO CONVERTIDO A TEXTO PLANO</code>
</pre>

Post bajo licenciaGeneral Basic Liscense 1.0

Política de comentarios

Dada la importancia de los comentarios como espacio de participación, te pedimos por favor que leas detenidamente y cumplas con las siguientes normas de participación.

7 respuestas para “Convertir HTML a texto plano

Liher

Yo, cuando quiero poner codigo html o css o comandos para la terminal, siempre lo pongo entre las etiquetas y va perfecto, ademas el tema que uso tiene ccs para esas etiquetas y queda muy bien, buen apunte, un saludo


José Miguel

En la mayoría de los casos no es necesario convertirlo a texto plano, pero…

Ignoro si en tu plantilla obtienes otro resultado, pero intenta publicar el código final del post solo entre las etiquetas html.

<pre>
<code>CÓDIGO</code>
</pre>

Observa el resultado:

CÓDIGO


Liher

Hola, he probado a poner las dos opciones siguientes:

"código--"
“código–”

En ambos casos aparece exactamente lo mismo, el texto y caracteres entre las etiquetas igual sin autoformato, salvo que usando la etiqueta “pre” mi tema tiene un estilo css definido y aparece con fuente diferente y un color de fondo, ademas de un simbolo, “”, que indica que lo que hay dentro es codigo.

He probado a ponerlo en una pagina html simple, solo con esas dos lineas en el body y el resultado es igual, solo tengo que poner una de ellas y lo que aparece entre las etiquetas no se altera.

Tengo que decir que cuando yo voy a introducir codigo en WordPress primero pongo la etiqueta “”, luego el codigo que quiero poner y finalmente cierro “” pero lo escribo en la pesataña de “texto” en vez de en la de “Visual”.

Hasta ahora siempre me ha funcionado bien. Un saludo y gracias 😀


Elías R.M.

Hola Liher y José Miguel, por lo que veo, me da la sensación de que cada uno está hablando de una cosa diferente.

Este post se refiere a como publicar código HTML en nuestro post, sin que el navegador lo interprete como código, es decir, que lo muestre como si fuera texto plano.

Cuando estamos escribiendo un post en “visual”, cualquier carácter especial como <, el editor lo escapará para que se muestre como texto plano. Pero si estamos escribiendo en “texto”, el editor no hará nada, por lo que, si lo que escribimos es una etiqueta HTML, el navegador la entenderá como tal y no se verá esa etiqueta como texto plano.

Como ejemplo voy a escribir el mismo código escapado y sin escapar.

Código escapado:

<pre><code>HOLA MUNDO CRUEL</code></pre>

Código sin escapar:

HOLA MUNDO CRUEL

Como se puede ver, en el primer caso se pueden leer las etiquetas HTML, mientras que el segundo caso solo se ve la frase “HOLA MUNDO CRUEL” sin las etiquetas que la rodean, que en lugar de ser mostradas, están siendo interpretadas por el navegador y este le ha aplicando los estilos correspondientes.

P.D. Hemos editado el post, ampliando las explicaciones, para intentar ser mas claros y evitar confusiones. Gracias.


Liher

Gracias por la explicacion Elias, yo queria decir lo mismo que tu, mas o menos, pero me fui por otros derroteros.

Esta bien tener usuarios como tu que participan y ayudan, un saludo 😀


José Miguel

Elias, ademas de usuario, es redactor, administrador y creador de la plantilla del blog…
Saludos.


Liher

Perdon, no lo sabia, mis respetos a Elias, y felicidades por el blog, está genial


Deja un comentario

Tu dirección de correo electrónico no será publicada.