Este artículo ha sido consultado en 408 ocasiones.

Como se supondrá, lo primero es logearse ;-) :

Da un clíck sobre "Mi blog". Como notarás, aún no hay ninguna entrada. Damos un clíck sobre "Secciones de tu Weblog":

Da un clíck sobre uno de los círculos grises para agregar temas a tu blog:

Una vez que hayas agregado algunos temas da de nuevo un clíck sobre "Mi blog" y a continuación da un clíck sobre uno de los círculos grises para agregar una entrada a tu Blog:

Este es el editor de entradas. Da un click sobre la imagen de la derecha , una ventana se abrirá para mostrarte como luce actualmente tu Blog. Si aún no has publicado ninguna entrada verás algo como esto:

Nota que el título del Blog, el resumen y tu avatar, los puedes editar desde la opción "Mi Perfil" del ménu. Como ya habrás notado, el URL de tu blog es: http://www.mononeurona.org/blog/login. Donde login es el nombre de usuario que seleccionaste al darte de alta en el portal.

Bien. volvamos al editor de entradas. Este es bastante sencillo, con él puedes elegir la fecha, el tema de la entrada (que son los temas que diste de alta antes), un manejador de imágenes (esto lo veremos más adelante) y el cuerpo de la entrada:

Además, en la parte inferior del editor, verás las opciones "Comentarios" que activa los comentarios que los internautas pueden hacer a esta entrada, "Publicado" que (como el nombre indica) publica la entrada y la hace visible en tu BLog, por último "Concluir Edición" salva el contenido de la entrada, y te regresa a la pantalla de "Mi Blog". Si "Concluir Edición" no está activado, cada vez que salves el contenido la pantalla del editor volverá a presentarse.

El editor está en HTML, pero no necesitar saber mucho de HTML para usarlo, sólo necesitas saber que el tag (o etiqueta) <p> define un párrafo del texto, así que cada nuevo <p> hace que el navegador comience en una línea nueva. De modo que algo como:

<p>Una línea</p> <p>Otra línea</p> <p>Una tercera línea</p> 

En el navegador se vería así:

Una línea

Otra línea

Una tercera línea

Aquí en la MonoNeurona.org usamos una clase de párrafo especial llamada "justificado", que como ya habrás adivinado, justifica los párrafos y le da una mejor apariencia al blog.

Bien, basta de teoría, vamos a agregar una entrada a tu blog. Es muy sencillo, sólo escribe dentro de los tags <p class="justificado"></p>. Si tienes pensado escribir muchos párrafos, copia y pega varias veces <p class="justificado"></p>

Una vez que hayas escrito algunos párrafos, selecciona la opción "Publicado" y da un clíck en "Agregar". Ahora revisa tu blog para ver los cambios:

¡Ya tienes una entrada en tu blog! Ahora en el editor selecciona "Concluir edición" y púlsa sobre "Actualizar". Verás la pantalla con las entradas de tu Blog donde debe aparecer tu primera entrada, está pantalla te dice el título de la entrada y su estado, es decir si está publicada o no. Desde aquí puedes editar una entrada o borrarla definitivamente.

Insertar una imagen a una entrada

Bien vuelve a Seleccionar el círculo gris de "Agregar una entrada a tu Blog". De nuevo verás el editor listo para agregar una nueva entrada. Da un clíck sobre la liga "Image Manager".

Esto te llevará a una pantalla con tus imágenes. Por supuesto, no habrá ninguna si es la primera vez que estás ahí ;-) Da un click sobre el boton "Browse" o "Explorar" (depende del idioma de tu navegador) y selecciona una imagen gif, jpg o png. No se permiten las imágenes TIFF ni BMP pues son muy pesadas. En este caso voy a subir la imagen "bush_funny.jpg". Da un click en "Subir".

Una vez que se haya subido la imagen la verás en el manejador de imágenes, puedes darle un clíck sobre ella para conocer los detalles de la imagen:

Nota que el sistema renombra la imagen para asegurarse que no hay dos imágenes con el mismo nombre.

Bien con una imagen tenemos para el ejemplo. Ahira damos clíck de nuevo "Mi Blog" y una vez allí en "Agregar entrada". Dale un tema y un título a esta entrada y escribe un par de párrafos. Luego da un click a la imagen de la cámara. Una venta pequeña se abrirá con la lista de tus imágenes, abajo de ella verás un tag IMG, cópialo y cierra la ventanita:

Selecciona "Publicado", pega el tag IMG dentro de un tag P y da un click en el botón "Agregar":

Ya puedes ver la entrada con la imagen publicada:

Tip: Como ves la imagen se muestra en el blog, pero está a la izquierda. Para centrar una imagen cambia el tipo de p´arafo de <p class="justificado"> a <p class="imagen"></p>:

Voila!! ;-)

Insertar una imagen externa a una entrada

La imagen que acabamos de insertar es una imagen interna es decir que está en el mismo servidor que el blog. Pero podemos agregar un imagen externa, es decir que está en otro servidor de internet.

Por ejemplo la imagen http://www.rooksrant.com/images/bush-haters.jpg.

Para agregar está caricatura a nuestra entrada lo hacemos así:

Damos un clíck en el botón "Actualizar" y el resultado será:

La ventaja de usar una imagen externa es que no es necesaria subirla con el manejador de imágenes, la desventaja es que si en el otro servidor la renombran o borran ya no se verá en tu blog ;-(

Consideraciones acerca de las imágenes

Como te habrás percatado, el blog usa el clásico diseño de tres columnas. La columna más ancha es la central, donde van las entradas del blog, y por consideración a los usuarios con resolución 800x600 píxeles, ninguna imagen que insertes en tu blog debe verse más ancha que 550px.

Si tienes una imagen que mide más que eso puedes hacer dos cosas, una es editarla con Gimp y reducirla a 550px de ancho antes de subirla con el manejador de imágenes, (y cuidando de reducirla proporcionalmente para que no se distorsione).

Si se trata de una imagen que no se puede reducir (como por ejemplo un wallpaper que hiciste con Gimp y que quieres publicar). Puedes usar los parámetros width y height del tag img. Por ejemplo fijate en la imagen: http://www.kde-look.org/content/files/36070-PenguinLife800x600.png la cual mide 800x600, es decir, más de los 550 pixeles recomendables.

Podemos insertar esta imagen como externa en nuestro blog así:

Que se verá así:

¿Qué hemos hecho? Al usar width="50%" y height="50%" sólo le hemos dicho al navegador que muestre la imagen al 50% de su tamaño a lo ancho y a lo alto ¿fácil no? Los paŕametros width y height pueden usare tanto en las imágenes externas como en las internas de nuestro Blog. Es decir que podemos subir una imagen de más de 550px de ancho y luego mostrarla al 50%, 60% o 40%.

Una última consideración. Existen aún (aunque no lo creas ;-] ) navegadores textuales. Pensando en estos navegadores que no muestran las imágenes, se invento el páramtero alt o "Alternativo". En lugar de la imagen en estos navegadores se muestra el contenido de alt. alt de acuerdo al W3C es un párametro obligatorio, de modo que es buena idea ponerlo en todos nuestros tags <img>.

Por otro lado el párametro title es el encargado de mostrar el tooltip cuando ponemos el mouse sobre una imagen. El toolptip es ese mensajito que se muestra. Este tag no es obligatorio, pero es recomendable.

Ficha del autor:
colotto
colotto_ARRROBA_gmail.com
Daniel Colotto es estudiante de la facultad de robótica en la Universidad de Quintana Roo, México. Ha escrito tutoriales sobre Python, GTK# y usabilidad. Cuando no está programando o jugando Quake, se le puede ver buceando y/o ligando gringas en Playa del Carmen. Le gusta comer chocotorros y leche Hershey's

No importa cuanto conocimiento tengas, sino lo que hagas con el
Ver todos los articulos de colotto

Última actualización: 2007-04-29 10:57:00-05

saidjose está:
Instalando postgresql desde fuentes
4 hours, 4 minutes ago

saidjose está:
Detenido en la instalacion de karamelo por que en ubuntu edgy no hay postgresql 2.8
4 hours, 5 minutes ago

rnstux está:
buscando bugs!.....en el trabajo, hay un chingo de cucarachas!
4 hours, 36 minutes ago

aarkerio está:
please reporten los bugs en Trac
5 hours, 40 minutes ago

vendaval está:
meditando sobre los capchas
5 hours, 51 minutes ago

saidjose está:
bajando e instalando karamelo
5 hours, 56 minutes ago

Que estuvimos haciendo >>

Consultoría y Soporte