Búsqueda de Temas

miércoles, 23 de enero de 2008

Como poner simbolos HTML en los posts de Blogger

Hace tiempo que quería explicar un post donde enseñaría como colocar simbolos HTML o de CSS en los blogs, en especial en los posts o las entradas de Blogger y hasta ahorita no me había dado un tiempo para hacerlo de la manera que quería, sin embargo hoy les enseñaré como hacerlo y espero que les sirva.


Lo primero que deben saber es que hay "símbolos" por defecto que el HTML reconoce como propios de su sintaxis. El blog se encuentra todo dentro de un conjunto de etiquetas de HTML llamados tags y que más o menos tienen la siguiente estructura:

<html>
<head><title>Título</title></head>
<body>
</body>
<html>

Lo anterior es sólo algo genérico y si no lo entendieron no importa para nada. En especial a lo que refiere a los símbolos mayor ">" y menor "<" que resultan un problema al ser escritos en las entradas. Si es que intenta escribir por ejemplo </div> dentro de un post o entrada de Blogger (u otro intérprete de HTML en general), de inmediato el sistema lo detectará como una etiqueta del HTML llamada div (propia de este lenguaje), por ende, no saldrá como queremos que se muestre. Así que sólo nos valdremos de unos códigos que tiene el propio HTML para hacer esto posible.

He visto a muchos bloggers sufriendo y que incluso en sus comentarios deben usar códigos como éstos:

[body][/body]

para denotar:

<body></body>

Hasta aquí todo ha sido puro "cuento", lamento haberlos hecho que lean ese pedazo de texto pero era ideal que tuvieran una introducción siquiera parcial de los problemas que existen al intentar mostrar códigos HTML dentro de un post.

Para mostrar etiquetas (tags) HTML dentro de un post sólo necesitamos algunos códigos. Por ejemplo:

Descripción
Notación
Código
Menor que
<
&lt;
Mayor que
>
&gt;
Ampersand
&
&amp;

Si desean por ejemplo escribir el tag <head> deben poner en su entrada &lt;head&gt; (en la pestaña de Edición de HTML, no en el de Redactar). Con eso basta, si desean más códigos pueden visitar cualquier tabla de códigos HTML (ver enlace al final o aquí) y usar su HTML número o HTML nombre. Recuerden que esto también funciona al momento de querer escribir códigos HTML en sus comentarios. Así que basta de usar corchetes para emular los "mayor que" y "menor que" del HTML y en caso tuvieran dudas, las espero con gusto.

Observación: En la vista previa los códigos HTML escritos seguirán mostrándose tal y como se escribieron, su cambio a < y > se mostrará recién al momento de publicar el artículo. Pueden ver más muestras de cómo los he usado en estos posts:

Cómo quitar la barra de Blogger,
Cómo agregar un traductor a tu blog de Blogger,
Cómo agregar un menú superior a tu blog de Blogger, etc.

Otro ejemplo de despedida, por ejemplo para mostrar la estructura de la web puesta al inicio el código que deberían usar sería:

&lt;html&gt;
&lt;head&gt;&lt;title&gt;Título&lt;title&gt;&lt;/head&gt;
&lt;body&gt;
&lt;/body&gt;
&lt;html&gt;

Enlace: Códigos HTML

2 comentarios:

Anónimo dijo...

Chevere, útil y servicial, como siempre.

KnxDT dijo...

Hola TiensJaen, un gusto tenerte comentando por aqui y me alegro que te sea de utilidad. ;)

Contáctame