martes, 2 de marzo de 2010

Fondo ó Background “Bella Primavera” para Blogger.



La primavera esta muy cerca, pronto los árboles retoñaran y las flores dejarán mostrar su inigualable belleza, el sol brillará con mas intensidad y los pájaros nos complacerán con melodías hermosas que nos hacen recordar cuán afortunados somos de tener un planeta lleno de vida y color.



Este domingo pensé hacer una plantilla, con motivos florales, delicada  y femenina, pero al final de cuentas decidí por hacer un fondo (background), ya que de ese modo lo tendría listo mas rápido y además complacería a algunas personas que les gusta este tipo de diseño para sus blogs, sobre todo para los blogs personales donde la sencillez es el elemento principal.

Espero haber cumplido con el propósito. Bienvenidos comentarios y sugerencias.

                 

DEMOSTRACION           







Como Instalar el fondo ó  Background:



Tienes dos Opciones:



Opción 1.Agregar el código a un Gadget.





Paso 1. Asegúrate de tener la plantilla de Blogger "Mínima" instalada en tu blog.



Paso 2. Copia el siguiente código:

<style type="text/css">body {background-image: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-P_kPz6MfnFsW9-LUE0zg-p4SiH5gT2HEy73d1QD3Yn3navffffgH9jkbuwBmnri4xyCOhoLdkJ9U9efudppf7824i5-0dWGhUo8hrdOb400iYHJ3xmceKHe_BxH22FHPi-IESLir2Ww/s1600/florebackground.PNG"); background-position: top; background-repeat: no-repeat; background-attachment: fixed; }</style><div id="tag" style="position:absolute; left:0px; top:30px; z-index:50;width:148px; height:47px;"><a href="http://www.compartidisimo.blogspot.com/"; target="_blank" title="Plantillas para blogger Gratis"><img

border="0"src="http://i672.photobucket.com/albums/vv83/karlaenlinea/bnns.png"/></img

border="0"src="http:></a></div>




Paso 3. Vé a Diseño ► Añadir Gadget, y elige la opción HTML ó Javascript y pega el código anterior, guarda los cambios y listo.



Recomendaciones



Para que tu Blog luzca mas bonito con este fondo, puedes borrar el borde que encierra el título, es muy fácil, para ello ve a...





Diseño ►Edición HTML, Luego, busca donde dice:





#header wrapper{
....
border: 1px solid $bordercolor;
...
}


#header{

...

border: 1px solid $bordercolor;

...

}




...borra lo que puse de color naranja, esa parte hace que aparezca el borde.



Nota: Como puedes ver el borde se encuentra tanto el el header wrapper (envoltura de la cabecera) como en el header(cabecera).



Modifica las fuentes (colores de las letras) para que se adapte al diseño.



Nota: En la  Demostración, le dí un margen adicional en el top, tanto a la columna principal, como a la columna lateral, para que se vea más amplio el espacio entre la cabecera y el contenido y armonice con las flores del diseño, Además eliminé el navbar (barra de navegación de blogger).







Opción 2. Bajar la plantilla e instalarla en tu Blog.





Si quieres bajar la Plantilla con el fondo añadido,  los ajustes hechos y el Navbar de Blogger eliminado, para que se vea igual que la demostración (excepto por el título que personalizé)  bájala en el siguiente enlace, y utiliza las mismas instrucciones de instalación que uso para las otras plantillas.

                     



Descargar

                                                                        

Cualquier duda ó sugerencias son bienvenidas y atendidas.

No hay comentarios:

Publicar un comentario