Crea un blog en WordPress.com IV

31 May

Ahora vamos a ver como podemos modificar la cabecera de nuestro blog de forma todavía más personalizada. Ya sabes, para ir a las opciones de la plantilla: Dashboard»Diseño»Current Theme options. Una vez allí en Header Image URL ponemos la dirección de nuestra imagen personalizada. Pero antes hay que crearla. Arriba de la opción se nos especifican las medidas que debe tener para esta plantilla:  730x140 pixeles.

La vamos a crear con El Gimp. Si no lo tienes, lo puedes descargar e instalarlo: es Software Libre y no tendrás que pagar por ninguna licencia, aquí el enlace: http://www.gimp.org/

Con El Gimp ya instalado iniciamos el programa y creamos un nuevo archivo con las dimensiones que necesitamos para la cabecera de la plantilla que hasta el momento hemos estado utilizando: 730×140 px

Archivo»Nuevo…

Bien. Ahora que ya tenemos el archivo para trabajar comenzamos por buscar una imagen, la cual tenga que ver con el tema de nuestro blog, para esto, recomiendo usar la siguiente página:

Allí van a encontrar miles de imágenes con licencias CC para que las puedan utilizar en su blog sin ningún problema legal.
Elegí la siguiente (aquí puedes ver el perfil del autor speedy2):
Laptop cows

Una vez que hemos descargado la imagen la incluimos en la cabecera. Sólo hay que abrir la carpeta donde la guardamos y arrastrarla al lugar de trabajo:

»»100%

Se creará una nueva capa con el nombre de la imagen que acabamos de importar al área de trabajo:

Ahora exploramos nuestras herramientas en El Gimp y utilizamos la de escalado para cambiar el tamaño de la imagen:

Una vez que la hemos escalado al tamaño que deseemos, seguimos con el alineamiento utilizando cualquiera de estas dos herramientas: la primera nos da mayor precisión y la segunda más libertad de movimiento. Luego de los ajustes obtuve el siguiente resultado:

Ahora en lugar de las vacas se me ocurre poner una captura de WordPress.com o algo por el estilo. Primero voy a girar un poco la imagen para que haya más espacio en el monitor y luego borraré las vacas:

No sólo he girado la imagen, además la escalé a menor tamaño y la he puesto pegada a la izquierda. Antes de borrar las vacas, voy a rellenar el fondo blanco. En la ventana de capas selecciono el fondo y luego la herramienta de mezcla para hacer un relleno con degradado:

Herramienta de mezcla . Antes de aplicar la mezcla, hay que cambiar los colores del frente y del fondo, lo cual podemos hacer dando clic sobre ellos:

Aquí utilizamos una pequeña herramienta que nos permite copiar cualquier color que haya en la pantalla incluyendo los de nuestra imagen, esto sirve para una mejor concordancia en el diseño. La herramienta es un gotero:

Luego de cambiar ambos colores aplicamos la mezcla:

Arrastramos en la dirección que vamos a querer el degradado de los colores y aquí el resultado:

Ahora hay que borrar algunas partes de la imagen (en especial: la vacas). Seleccionamos la capa de la imagen y la herramienta de borrar:

Como puedes ver, además de seleccionar el borrador he cambiado el pincel por uno más suave al cual le modificaremos la escala a 5.99:

Comenzamos a borrar la orilla de la imagen:

Luego hacemos zoom a 300% en la imagen y comenzamos a borrar las vacas (llegó su hora vacas):

Como puedes ver, también he cambiado la escala del pincel a 1.98, puedes ir probando varias escalas y pinceles para que logres un mejor resultado.

***Hay otros métodos, empero el objetivo de esta guía es otro, así que lo mejor es recomendar que los busques en la red, aquí hay un buen inicio:

Gimp-Es

Seguimos… una vez que obtengas el resultado deseado (eliminar vacas):

Descarga la siguiente imagen y repite el método de insertar imágenes al área de trabajo:

Como puedes ver, luego de insertar la imagen se crea una nueva capa la cual movemos debajo de la que ocupa la de la computadora (ahora sin vacas). A esta nueva imagen le borramos también las orillas. Es posible que cuando importemos la imagen al blog, el título quede encimado o simplemente no sea lo que queremos. Entonces de una vez agregamos texto a nuestra imagen. Quizá a estas alturas ya comienzas a familiarizarte con El Gimp. Pero para los que todavía no, lo seguiremos haciendo con ejemplos.

Primero seleccionamos la herramienta y vemos todas las opciones que tenemos para editar texto dentro de El Gimp:

Por ejemplo cambiamos el color del texto: dando clic en “Color” se abre esta ventana e igual que la vez anterior podemos usar el cuentagotas :

Cuando damos clic en el área donde queremos el texto se abre una ventana para escribirlo. Paralelamente se creará otra capa:

Ahora vamos a duplicar esta capa de texto para hacer un efecto. en la ventana de capas con el texto seleccionado damos clic en este botón :

Luego de haberla duplicado, seleccionamos el texto inferior, le cambiamos el color a uno más oscuro vamos a Filtros»Desenfoque [Blur]»Desenfoque gaussiano:

Y modificamos los siguientes parámetros:

Luego multiplicamos unas siete veces la capa donde hemos hecho el desenfoque:

El resultado:

Ahora guardamos el trabajo como .xcf para posteriores modificaciones y luego como .png. (Archivo»Guardar como)

Iniciamos sesión en WordPress.com y vamos a My Dashboard»Diseño»Current Theme Optios»

Allí en Header Image URL vamos a poner la dirección de nuestra imagen, pero primero debemos subirla al servidor. A diferencia de otras plantillas donde se puede agregar la imagen desde nuestro disco duro, en esta hay que usar un pequeño truco. Si no tienes otro lugar donde subir la imagen entonces vamos a abrir una pestaña u otra ventana, sin cerrar la ventana en la que estamos trabajando. Damos clic derecho en Redactar y elegimos la opción que más nos acomode:

Estando ya en la nueva pestaña o ventana, damos clic en Añadir una imagen

Damos clic en Escoger archivos a subir:

Ahora buscamos en nuestras carpetas el archivo que hemos creado con El Gimp:

Aceptar. Luego de unos mementos se verá así:

Nos desplazamos en esta ventana hacía abajo y copiamos la URL:

Cerramos esta ventana:

Cambiamos de pestaña o ventana para regresar a donde tenemos que pegar la dirección de la imagen (en este caso mi pestaña donde tengo que pegar la URL es la de la izquierda):

Estando de regreso pego la dirección en la caja tipo formulario y al principio no parece estar funcionando:

Pero luego de unos momentos (cuando regresé del WC :P) allí estaba:

Ahora sí, nos desplazamos al final de la página y salvamos los cambios (Save Settings):

Quizá luego de hacerlo te dice que la imagen es invalida y que lo intentes de nuevo.

¡No le hagas caso!

Repito. ¡No hagas caso! (son las malditas vacas que están buscando venganza). Sigue adelante, da clic en el botón:

Y seguro que allí estará nuestra nueva cabecera y sin vacas.

Compruébalo tú mismo: http://creaunblogen.wordpress.com/

¿Qué pasa o qué va a pasar con el post que habíamos iniciado para hacer el truco? Nada, sólo cierra tu ventana o pestaña donde lo iniciaste y no pasa nada, ni se publica y mucho menos vas a perder tu imagen de la cabecera. Todas la imágenes que subes a WordPress.com allí permanecen aunque no estén publicadas en ningún post. Incluso este truco se puede usar para otras cosas, pero eso luego se los cuento.

Saludos letransfusionados y alucinados.

PD El hecho de que me haya tardado mucho en publicar esta última entrada no quiere decir que sea el mismo tiempo invertido en crearla. Si demoré, pero no todo fue en esto.

Anuncios

5 comentarios to “Crea un blog en WordPress.com IV”

  1. oleosymusica 3 septiembre 2008 a 1:02 am #

    Excelente trabajo, me sirvió muchisimo. Hice un primer intento muy básico pero ya me pondré a hacer otro con foto y todo y cuando lo suba te digo para que lo veas.

    Además muy bueno todo lo que escribes. Te estaré visitando.

    Saludos desde Caracas.

  2. Androide 23 5 junio 2008 a 10:40 pm #

    Te quedo muy profesional, gracias por el tutorial!

  3. letransfusión 2 junio 2008 a 4:16 am #

    ¡Órale! Gracias Oskar. Quizá no te has dado cuenta, pero al enlace en tus comentarios, le falta una s: http://rincondelnovato.wordpress.com/ y pues no lleva a tu blog. Lo arreglaría, pero me parece que ya no se pueden editar los comentarios por lo que aquí pongo bien la dirección: http://rincondelnovato.wordpress.com/

    Saludos letransfusionados y alucinados. 😉

  4. Oskar 1 junio 2008 a 5:15 am #

    Ah, y que bueno tenerte de vuelta… 😉

    Saludos…

  5. Oskar 1 junio 2008 a 5:14 am #

    Vaya… Excelente como hiciste la edición de esa imagen… Me ha gustado mucho…

    Saludos…

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s

A %d blogueros les gusta esto: