HTML Básico para los comentarios en blogs de WordPress

@ 11 . febrero . 2012

Muchas veces entras a un blog, te parece interesante el contenido del post y decides dejar un comentario ya sea para felicitar, profundizar el tema, o corregir/criticar algo.

Justo cerca del recuadro donde debes escribir el contenido, te encuentras un mensaje que dice algo como: Puedes usar HTML en los comentarios.

comentar con HTML

Te dices: “Ah, bueno” y escribes normalmente. Pero … :chan: el comentario que está un poco más arriba se ve mejor, con letras usando negrita, cursiva, recuadros de citas y palabras con enlaces. ¿Cómo habrá hecho? ¿Será el cuñado del dueño del blog? Nah !!!! Es simple: el comentarista ha usado código HTML. Sí, eso a lo que hace referencia lo que se mencionó más arriba.

Si quieres saber como usar HTML para que tus comentarios en otros blogs se vean mejor y sean más completos, esta es la solución:

¿Qué es el HTML?

HTML es un lenguaje para codificar páginas web, algo parecido a un lenguaje de programación pero para Internet. Su nombre es el acrónimo de Hypertext Markup Language: Lenguaje de Marcado de Hipertexto.

Para ver un ejemplo de página web, tan sólo tienes que entrar a una y das click derecho en cualquier parte, eliges Ver código fuente de la página y se abrirá una ventana con el código HTML.

¿Cómo funciona el HTML?

HTML funciona con etiquetas. Las etiquetas son una serie de palabras y signos especiales que el navegador interpreta como órdenes para mostrar de cierta manera el contenido de la página.

Una etiqueta siempre va entre los signos de menor que y mayor que. Estos signos sirven para que el navegador diferencie entre el contenido normal de texto y lo que es HTML.

Las etiquetas más usadas en comentarios son: blockquote, a href, strong, em, li y code.

Nunca olvides cerrar las etiquetas

Aunque hay algunas excepciones, todas las etiquetas tienen una apertura y un cierre, el cierre siempre lleva el signo “/” que significa fin de esa etiqueta:

Negrita: <strong>Hola, Aeromental</strong> = Hola, Aeromental
Cursiva: <em>Hola, Aeromental</em> = Hola, Aeromental
Palabras con enlace:
Visita a <a href="http://www.aeromental.com/">Aeromental</a> = Visita a Aeromental
Citas: <blockquote>Esto dijo Aeromental</blockquote> =

Esto dijo Aeromental

Código: Esto sirve para que escribas código y este se lea pero no se aplique, para esto usas la etiqueta code, por ejemplo:
* debes cambiar los [ ] por < >
[code]<em>Código de em</em>[/code] = <em>Código de em</em>
Lista con números: Aquí juegan las etiquetas “ol” (Lista Ordenada) y “li” (Elemento de la lista) <ol><li>elemento 1</li><li>elemento 2</li><li>elemento 3</li></ol>

  1. elemento 1
  2. elemento 2
  3. elemento 3

Si es lista sin números se usa “ul”: <ul><li>elemento 1</li><li>elemento 2</li></ul>

  • elemento 1
  • elemento 2

Todo siempre debe ser cerrado, no se deja nada abierto y se respeta el orden, si mezclas varios primero se cierra de adentro para afuera:

Esto es en <strong><em>negrita y cursiva</em></strong> = Esto es en negrita y cursiva
Cuando uses enlaces recuerda que es a href=”enlace completo”, el enlace completo siempre va entre comillas dobles y empieza con http://

Los foros usan BBCode, los blogs no.

La mayoría de los blogs (en especial de WordPress) tienen HTML activado para sus comentarios, en cambio muchos foros usan BBCode (foros en phpBB) que son las etiquetas entre corchetes, se ven así [b]negrita[/b] [i]cursiva[/i] [url=enlace]enlace[/url]. Esto no es código HTML (que es un estándar universal) y no funciona en los blogs (porque somos más cool).

Autor del post: DanielSemper: @aeromental + Facebook