Hola bellas! Me preguntaron por Ask si podía hacer un tutorial explicando como se pueden poner 2 fondos diferentes en el blog así como lo ven ahora en Not A Single Song. La verdad es muy sencillo así que aquí les explico como hacerlo.
NOTA: Siempre que hagan un tutorial en el que tienen que modifica el código, les recomiendo hacer una copia de seguridad yendo a Plantilla - Crear/Restablecer copia de seguridad - Descargar plantilla completa
1. Van a Plantilla - Editar HTML
2. Abren el buscador (CTRL+F) y ponen body {. Les saldra eso y un poco más abajo html body $(page.width.selector) { o parecido, algo como esto:
3. Ahora vamos a borrar todo esto y lo vamos a reemplazar por lo siguiente:
body, html {Es importante que presten atención a esto:
font: $(body.font);
color: $(body.text.color);
height: 500px; /*Altura del fondo del header*/
padding: 0;
margin: 0;
}
body {
background: url("URL del fondo del header");
background-repeat: repeat;
}
html {
background: #eedfb4; /*Color del fondo del blog*/
}
- en body { va el fondo superior pero arriba en body, html{ deben poner la altura del mismo y;
- en html { va el fondo inferior
Guardan los cambios y ya está!
Recuerden que los fondos pueden ser o un color o una imagen.
Si desean que sea simplemente un color deben poner background: #eedfb4; y reemplazar el código.
Pero si les gustaría poner una imagen, tienen que poner: background: url("URL de la imagen");
Eso es todo. Cualquier duda que les haya quedado, me dejan un comentario. Un besito!
Me sirvio mucho grax cataa!
ResponderEliminarEres la mejor OMG
De nadaaa :)
Eliminarporque ami nunca me aparecen esos codigos T.T
ResponderEliminarNUNCA?
EliminarNo se por qué no te aparecen la verdad, estan en todas las plantillas de Blogger...
A mi me pasa muy parecito a Moustachito, hasta que puse la misma plantilla que la tuya... Si pongo una es como que desaparecieran todos los codigos que muestras en los tutos :/
ResponderEliminarNo se chicas, yo no estoy loca... la verdad no se que hacen, que plantilla usan o que buscan que no les sale porque yo lo hago perfectamente :/
EliminarHola! Podría ser porque se necesita "Expandir Plantillas de Artilugios" (situado arriba a la izquierda) para que te salgan los códigos que tu dices cataa. ;)
EliminarBueno, por ejemplo, ahora mismo, no me aparece ese codigo :// Salen 3 body { y ninguno es. Incluso, traté, y nop xD no se que estoy haciendo mal, pero una imagen aparece en todo el blog y la otra aparece debajo de los créditos de "Con la tecnologia de Blogger" O.O
ResponderEliminarComo que te salen 3 body{ ha de ser el primero no siempre aparece el html body $(page.width.selector) { puede que solo salga el body.. y lo otro que me has dicho no te he entendido ni medio
EliminarSi quieres pasame la captura del primer body{ que te sale y ya te digo si es.. porque es que me resulta RARISIMO que no te salga, ya que lo he checado en diferentes plantillas
EliminarWii *w* gracias, te lo pregunté yo xD
ResponderEliminartengo que probarlo pronto ^^
un besoo♥
Ah, ya jajaj Pruebalo, y cualquier cosa me avisas :) Un besito
EliminarWow cataa, me encanto este tuto. Me puedo llevar el fondo con el que hiciste la prewiev del tuto?.Es que me encanto ese fondo y le vendria bien a el proximo diseño de mi blog. Gracias
ResponderEliminarNo, esta editado, además como lo vas a sacar de ahí? Es un motivo para el Photoshop
EliminarY hay alguna forma para poner dos fondos en imagen? es decir, el 2º fondo en vez de un color html una imagen *0*
ResponderEliminarMuchas gracias!
Me sirvió de mucho :3
B3sazos!
Lo puse más abajo, leiste todo? Dice, si queres que el fondo sea una imagen solo tenes que reemplazar lo del color por:
Eliminarbackground: url("URL de la imagen"); y ya esta :)
Leaaaaan todo!
Mmm, no me sale u.u
ResponderEliminarLo hago tal cual, pero no me aparece ninguna imagen ni al principio, ni al final del blog :/
Gracias Cata! Me rre sirvio, tube los mismos problemas chicas pero fui buscando!!
ResponderEliminarSOS UNA GENIA CATA!! GRACIAS A VOS MI BLOG ES MUY CUTE :3
No se ve los códigos en el primer layout de usd :c
ResponderEliminarHola Cata,Muchisimas gracias,ami tampoco me aparecía el codigo de html body,lo que me aparecía abajo era otra cosa,pero me sirvió igual! c:
ResponderEliminarGracias cata! Sos todo una genia! Ami me pasó igual, no me salió el código que ati te apareció, pero luego busqué Body { Y me dí cuenta de que era porque utilizaba otra plantilla! Gracias mil! Mira, si quieres te paso mi blog y miras, ya verás que ha funcionado. Te importaría hacerte seguidora por favor?
ResponderEliminarwww.yoselilla-panfu.blogspot.com
Me falta mucho para tener un blog tan fantástico como el tuyo♥