Acerca de texto justificado y tabulaciones en blogger

El texto justificado y con sangría al comienzo de párrafo en blogger

Quizás es que soy demasiado de la antigua escuela, ó que me insistieron demasiado en el instituto para hacerlo así, pero me encanta que el texto de mi blog esté justificado, (ocupe todo el espacio de la columna en la que se encuentra), y todos los párrafos deben empezar por un espacio igual. Cuando la tecnología no lo permitía, todavía recuerdo mi primer 386, lo he llegado a hacer incluso a mano poniendo espacios para que todo quedara bien.

Al empezar en blogger me di cuenta que en esta plataforma no se puede usar el tabulador para dar formato al texto ya que lo que hace el editor de entrada es saltar a otro botón.

Una solución podría ser utilizar el programa de edición de texto que tenemos instalado en el equipo, en este caso pages, escribo esta entrada desde mi Imac, y luego copiamos y pegamos en el editor, pero si lo hacéis veréis que el texto que se pega se transforma al formato que está en el editor de entradas.

He encontrado dos soluciones una muy fácil y otra más complicada que requiere un nivel mínimo de HTML, con la fácil ponemos la sangría a mano, mientras que con la otra controlamos totalmente el texto a cambio de programar.

La solución más fácil es escribir directamente con el tabulador en la primera linea, pero en un editor de texto plano, como puede ser el blog de notas, TextWrangler, ó Leafpad . Escribimos la entrada copiamos todo el texto y pegamos. Hasta ahora esta entrada está escrita así. Una vez tenemos el texto con sus sangrías utilizamos el formateador de blogger para convertir el texto en título<h1> negritas <b> y todo lo que queramos. Ni siquiera pongo captura de pantalla pues no tiene ninguna complicación.

Y ahora viene la solución más complicada. Antes de empezar si no sabes mucho del HTML y del CSS, te recomiendo que mires mi próxima entrada de mi blog en la que trataré este tema. Un ejemplo muy sencillo de que es eso del HTML y el CSS, no muy científico pero bueno de momento creo que es suficiente, el HTML es el texto de un libro, mientras que el CSS es la edición de ese libro (versión de bolsillo,tapa dura,ebook...). Si controlamos el CSS, podemos hacer que dos páginas con el mismo texto no se parezcan en nada.

Si se define lo que tiene que hacer la presentación (CSS) de nuestro blog cuando vea la etiqueta párrafo (<p> en HTML) que es dejar un cierto espacio en la primera linea, con definir los párrafos en HTML tenemos la solución al problema.

Para entrar en la edición del CSS debemos entrar en el home de nuestro blog. Una vez allí en la flecha hacia abajo que se encuentra entre el símbolo de documentos y el de ver blog.

Ahi pinchamos en plantilla y veremos esta pantalla:

Pulsamos en el botón de personalizar que está marcado en otro color. En la siguiente pantalla pulsamos la opción de Avanzado.

Se nos mostrará otra nueva columna a la derecha. Aquí se pueden editar muchísimas opciones de nuestra plantilla, pero la que nos interesa que es la de CSS se encuentra al final de todo. Allí ponemos el siguiente texto:

p{
text-indent: 10px; 
}

Este simple texto le dice al navegador que todas las primeras lineas que estén dentro en un párrafo,<p>, deben empezar desplazadas hacia la derecha 10 pixeles. La medida por supuesto se puede poner la que se quiera y en otras medidas como porcentajes en lugar de pixeles, text-indent:5%; hará que las letras se desplacen un 5% de la medida horizontal a la derecha. Le damos al botón de la derecha de añadir al blog y listo.

Bueno ya lo tenemos hecho, pero ahora ¿cómo definimos los párrafos en nuestras entradas? Aquí es donde empieza lo divertido, tenemos que pinchar en la pestaña HTML, que está al lado de la de Redactar y dar formato de párrafo <p> y </p> donde empiece y acabe el párrafo.

Además para fastidiar más la cosa, hay veces que al editor se le va la cabeza y te borra todas las etiquetas. Así que para hacerlo de manera segura podemos utilizar editores HTML como notepad++ AptanaStudio, Dreamweaver... y allí escribir todo el código para controlar al 100% la entrada.

Ya que he escrito de este tema, en mi próxima entrada pondré una introducción de HTML y de CSS para iniciarnos en el mundo de la programación web.