Recientes


Home » , » CAMBIA EL FONDO DE TU BLOGGER

CAMBIA EL FONDO DE TU BLOGGER

Como ya explike en posts anteriores blogger, aparte de ofrecernos una muy limitada cantidad de plantillas (templates) y colores para nuestro blog (todas ella muy pateticas haciendo k todos terminemos con la clasica minima black) tambien nos da la posibilidad de modificarlas haciendo uso del codigo HTML.
Dichas modificaciones pueden darse utilizando una plantilla predeterminada como base, o bien partiendo desde cero. Yo optaria por la primer opcion a menos k ya estes avanzado en lo k codigo html para blogger se refiere (recordemos que el html que usamos en blogspot tiene muchas diferencias con el de una pagina web u otros blogs como wordpress, esto es porque cada servicio nos limita en cuanto a codigo se refiere)

Por lo tanto este post esta dirigido exclusivamente a "blogspot" o "blogger" (no lo intenten con otros servicios)

BACKGROUND BLOG

si tuvieramos algo de nocion de ingles o programacion con solo leer el codigo de nuestra plantilla podriamos deducir de que manera cambiar nuestro fondo, tambien veriamos que nuestra plantilla (en caso de que uses alguna bajada y no de blogspot) posee multiples imagenes de fondo: fondo de cabecera, de los widgets (modulos), el pie de pagina, el fondo de los posts , comentarios, etc....

En este tuto les voy a explikar como cambiar el fondo principal unikamente. El resto de backgrounds pueden hacerlo por intuicion leyendo el codigo, y si se les complika me lo piden y se los expliko en otro post.

ELEGIR LA IMAGEN APROPIADA

Vamos a partir de una imagen con un tamaño de 1024x768 pixeles, actualmente es la resolución de pantalla más utilizada. La imagen que hayan elegido para fondo de su blog tendran que alojarla en algun hosting gratuito como imageshack o photobucket. por informacion acerca de hosting de imagenes lee este post

una vez alojada en el hosting k hayas elegido copia el LINK DIRECTO a dicha imagen. recuerden k en el viejo post acerca de hosting de imagenes (el link aki) hablabamos de 4 links o codigos a nuestra imagen, el k vamos a utilizar para el codigo de nuestro fondo y de casi cualkier programacion k hagamos es el DIREKTO osea debe tener este formato:

http://i338.photobucket.com/albums/n413/nombre de tu cuenta en photobucket/nombre de tu archivo.jpg

INSERTANDO EL FONDO

Vamos a nuestro panel de control (http://blogger.com/home)y seleccionamos la pestaña diseño:



Nos encontraremos con la siguiente pantalla:



En esta seccion vamos a seleccionar la pestaña "seleccionar plantilla nueva" en caso de kerer cambiarla, o "edicion html" para conservar la nuestra (recuerden k kuando trabajamos con plantillas es ideal guardar el codigo antes en un block de notas, por si las dudas)




si solo keremos editar la k ya tenemos vamos direkto a esta imagen (clickeala para ver el codigo):



Ya en el kodigo nos situaremos en el "body" de nuestro codigo:




Dentro de las llaves insertaremos el siguiente código:

background: url( "aqui la url de la imagen que hemos guardado anteriormente" ) no-repeat;

aka tienen unas variaciones en cuanto a la propiedad del fondo:

vamos a cambiar el "no-repeat" por la k keramos:

no tengo ni idea para ke s: inherit
no repetir. no-repeat
repetir (mosaico): repeat
repetir a lo ancho: repeat-x
repetir a lo largo: repeat-y

estas no las probe funcionan con todas las webs no se si con blogger tambien las dejo pro las dudas:

para k el fondo kede fijo y al hacer scroll solo se desplaze el texto: fixed
lo contrario a la anterior: scroll
posiciones del fondo :

abajo: bottom
arriba: top
derecha: right
izkierda: left
centrado: center


si alguna de las variaciones no funka prueben cambiar el "no-repeat" del codigo k les deje por:

para repetir ponen esto: background-repeat: no-repeat (o la k desees)
para la posicion ponen esto: background-position: center (o la k desees)
para dar scorlling o no al fondo: background-attachment: fixed (o la k desees)

con un poko de suerte podemos conseguir estos resultados:




Eso es todo en kuanto a background blog creo si falta alguna info avisen.

"KOMPARTIR NO TIENE LIMITES"
Share this article :

3 comentarios:

Paul Raven dijo...

tuve un problema kon las imagenes las k no aparecen clikeenlas para verlas.

BLUEGAZER dijo...

Funciona 10 puntos, solo faltaba agregarle fixed; para que quedase fijo el fondo, Gracias!

Paul Raven dijo...

Bueno por lo menos le sirvio a alguien ultimamente no se ven muchas almas por aki.....

 
Support : Creating Website | Johny Template | Mas Template
Copyright © 2011. Hazlo Tu Mismo - All Rights Reserved
Template Modify by Creating Website
Proudly powered by Blogger