THEbatzuk.org

Todos los que se han adentrado un poco en la creación de páginas web directamente con HTML (usando UTF-8), habrán notado un gran problema con las caracteres latinos, es decir: ¿, ¡, ñ y todas las letras acentuadas.

Al intentar escribir uno de estos caracteres, nos resulta la espantosa: �, vean este ejemplo creado por mi: caracteres especiales.

La solución está en escribir esos caracteres con su código original, por ejemplo:
Una A, en realidad 'la compu' la entiende como:  A
Así, cada letra, número y signo puede ser representado con su código. Unos de los más usados son:
á es á
Á es Á
ñ es ñ
¿ es ¿
¡ es ¡

Podemos encontrar todos estos códigos en esta Guía de Caracteres HTML Especiales, pero si no les gusta complicarse, entonces pueden usar el HTMLizer, que convierte texto normal, en texto legible para HTML en un simple clic.

Para adentrarse más en todo esto de caracteres HTML, UTF-8, ASCII, pueden leer este genial artículo: ASCII, Unicode, UTF-8 y la Iñtërnâçiônàlizæçiøn.

La idea es simple, si no no has ingresado a tu blog, entonces aparecerá el link para ingresar; si ya estás, entonces aparecerá el link para salir de la cuenta.

Cuando recién haces un blog en WordPress, en la barra lateral aparece un apartado llamado Meta, que incluye estas opciones, pero mi idea es hacer algo mucho más discreto.

El código sería así:

<?php if(is_user_logged_in()): ?>
<a href="<?php echo wp_logout_url(); ?>">Salir</a>
<?php else: ?>
<a href="<?php echo wp_login_url(); ?>">Entrar</a>
<?php endif; ?>

Y lo podemos ubicar en donde mejor nos parezca. En el footer, sería una muy buena opción.

Todos los blogs que corren con WordPress están hechos con PHP, bueno, más bien con una combinación de HTML, CSS y PHP. Todos ellos son lenguajes de programación: el HTML es la estructura, el CSS es lo visual y el PHP es lo que diferencía a un blog de una página hecha con FrontPage o cualquier otro de esos programas ‘crea-tu-web-fácil’.

Cuando tenía mi blog en Blogger, aprendí muchísimo sobre HTML y sobre CSS. Sin embargo Blogger no usa PHP como motor de sus blogs, usa un lenguaje creado por ellos mismos, el cual está bastante limitado (muy apenas tiene ‘if’).

Así que cuando migré a WordPress, esto del PHP era todo un misterio para mí. Pero dije “para tratar de entender todo este reburujo de <?php?>’s voy a tener que empezar desde cero” así que siguiendo un grandioso tutorial me puse y cree el theme que están viendo en estos momentos. Sin embargo, solo vi a PHP como una manera de traspasar la información de la base de datos a el blog con funciones que ya trae WordPress por defecto.

Hasta hace poco que busqué y encontré las Nociones Básicas de PHP fue que descubrí que PHP y C++ son parecidísimos (al menos en lo básico), y digamos que estoy bastante familiarizado con C++. Ahora estoy bastante contento de poder aplicar lo que aprendí en las últimos semestres de la prepa aquí en mi blog :D

La etiqueta <abbr> viene de abbreviation que significa abreviación y sirve para mostrar el significado de las abreviaciones que usemos en nuestros posts. Ejemplo:

[...] escuchando a SOAD.

Como ven, la palabra SOAD está subrayada con puntos y al pasarle el ratón por encima muestra un ‘Tooltip’ con su significado.

Para lograr eso, yo usé este código:

<abbr title=”System of a Down”>SOAD</abbr>

Bastante simple ¿no?

Aunque esta etiqueta está hecha para abreviaciones y siglas, podemos aprovecharla para otras palabras que sepamos que algunos no van a entender.

• Me duelen las canillas.
• Que chido.
• Traigo una hueva que hasta parecen dos.
• La dí una patada en el huesito sabroso.

La apariencia estándar es el subrayado punteado del mismo color que la letra y yo les recomiendo que lo dejen así para que no se confunda con un enlace, pero si quieren modificar su apariencia pueden agregar estas líneas de CSS:

abbr {
text-decoration: none;
border-bottom: 1px dotted #ff8800;
}

Ahora el subrayado sería color naranja (jeje). Échenle imaginación e imprímanle su propio estilo.

¿Te gusta escribir post muy muy largos, con mucha información clasificada bajo varios títulos?, ¿te gustaría que tus posts tuvieran un índice? ¡Pues entonces estás en el lugar indicado!

Jaja que mam*n estuvo eso pero ya que… Si no saben a que me refiero con “Índice en el post” visiten esta entrada que hice como prueba: Prueba índice en post.

Para hacer el índice, escribimos algo así:

<a href=”#1″>Planteamiento</a>
<a href=”#2″>Nudo</a>
<a href=”#3″>Desenlace</a>

Como ven, son enlaces. Sin embargo el símbolo ‘#’ le dice al navegador que, en la página en que estemos, se desplace hasta donde esté el nombre ’1′ o ’2′ o ’3′.

El siguiente paso es crear ese ‘nombre 1′. Para eso escribimos algo así:

<a name=”1″>Planteamiento.</a>
Texto normal y corriente…

<a name=”2″>Nudo.</a>
Más texto normal y corriente…

Y así de simple hemos creado un índice en nuestro post.

Consejos:

Si vas a utilizar los índices muy seguido conviene ser más específico en las nombres. En lugar de ponerle ’1′, podrías ponerle ‘planteamiento’ o ’1-plan’, porque hay problemas cuando los nombres se repiten en la misma página.

Si utilizas el editor de Blogger nunca escribas en ‘Redactar’. Escribe en ‘Edición de HTML’ y usa la vista previa. Si te pones en ‘Redactar’ después de escribir el primer código, Blogger automáticamente lo transformará a algo así:

<a href=”http://www.blogger.com/post-edit.g?blogID=74893424154127434&amp;postID=2998964798454221083#1″>Planteamiento</a>

Lo cual resultaría en un tremendo error. Pero con estas precauciones seguro que sale todo perfecto.