martes, 5 de agosto de 2008

Cómo poner imagen de fondo en Blogger

Algunas personas me han preguntado cómo he logrado poner una imagen de fondo en Nestavista.com, un blog que utiliza Blogger como plataforma. Pues el proceso es realmente fácil y a continuación paso a explicar.

Primero algunos puntos a tomar en cuenta:
Recuerden que la imagen de fondo debe ser pequeña ya que esto hará que cargue rápido y que además no se vuelva tan pesado. Para ello, casi siempre se utilizan backgrounds especiales conocidos como "patterns", imágenes que se pueden repetir a lo largo del eje vertical como horizontal formando una sola imagen uniforme.

Para ello, yo ya hace un tiempo publiqué un post con algunos buenos sitios donde descargar patterns. Luego, tendremos que subirla en cualquier servicio de hospedaje como: imageshack.us, photobucket.com, flickr.com, etc., de tal manera que puedan obtener la URL de la imagen.

Ahora sí vamos con los pasos a seguir:

1) Primero, sacaremos un backup de nuestra plantilla, dirigiéndonos a Diseño->Editar HTML->Descargar plantilla completa.

2) Ahora, insertaremos el fondo con la imagen o pattern escogido. Para ello localizaremos esta parte del código en nuestra plantilla:


body {
background:$bgcolor;
margin:0;
color:$textcolor;
font:x-small Georgia Serif;
font -size/* */:/**/small;
font -size: /**/small;
text-align: center;
}

y añadimos la url de la imagen quedando así:


body {
background:$bgcolor
background-image:url(http://img107.imageshack.us/img107/3635/pat3ud0.jpg);
margin:0;
color:$textcolor;
font:x-small Georgia Serif;
font -size/* */:/**/small;
font -size: /**/small;
text-align: center;
}

Ahora, donde ven http://img107.imageshack.us/img107/3635/pat3ud0.jpg); deberán reemplazarlo por la URL de tu imagen.

3) Como verán, TODO su blog se ha quedado con el fondo de la imagen escogida, no dejando ver el texto de sus artículos (posts). Por ello, lo que haremos es dejarlo en blanco (o en el color que ustedes deseen) para que pueda distinguirse su texto. Entonces nos dirigimos a nuestra plantilla en blogger, y localizamos esta parte del código:


#outer-wrapper {

Luego, añadiremos un "background" con un color cualquiera pero en hexadecimal. Si no sabes cuál es el valor hexadecimal de cada color, pues esta herramienta te ayudará: Conversión de Colores a hexadecimal.

Para quienes hayan tenido un blog con fondo blanco en la parte principal de su blog, el código hexadecimal del blanco será: #FFFFFF. Quedando así:


#outer-wrapper {
background: #FFFFFF;
width: 660px;
margin:0 auto;
padding:10px;
text-align:$startSide;
font: $bodyfont;
}

Y eso es todo, guardamos los cambios y vemos los resultados.

153 comentarios:

  1. Precisamente estaba buscando esta información porque soy nueva en esto. Quizá la pregunta es tonta, pero ¿cómo puedo conseguir la url de una imagen que tengo guardada? Es que estoy interesada en poner un pattern que tengo desde hace tiempo...
    Muchas gracias de antemano.

    ResponderEliminar
    Respuestas
    1. Hola,tambien puedes abrir o ir a entrada nueva como si fueras a subir fotos o videos y subes tu foto.Una vez allí subes tu foto le das a html y te sale el codigo lo copias y cierras y no subes la foto,pero tendras copiado tu codigo,no hace falta ningun programa te basta con el del blog.Bueno depués pegas la foto donde quieras.chao

      Eliminar
  2. @dano@8/25/2008

    Hola,antes que nada felicitárte por la completísima información que publicas en tu blog...Seguido busco información y casi siempre vengo a caer aquí..tengo una pregunta,ojalá puedas resolverla,como hago transparente el fondo de una imagen publicada en blogger? esque el fondo era negro y ahora tengo uno claro (inmovil) y el fondo de las imagenes donde aparece fecha y más ,sigue viendose negro..

    danone_mx@hotmail.es

    ResponderEliminar
  3. Holas!

    Para Maca: Existen varios sitios donde puedes subir tus fotos, una de las más comunes es http://imageshuck.us, donde solo tienes que escoger la imagen guardada en tu computador y eso es todo, imageshuck se encargará de darte una serie de códigos para insertar. En este caso, escoge el último de todos ellos.

    Para @dano@: no entiendo muy bien tu pregunta... lo que no entiendo es cuando dices "el fondo de de una imagen publicada en blogger". Sería bueno, que me dejaras un link hacia tu blog para ayudarte mejor.

    Saludos.

    ResponderEliminar
  4. hola amigo, entendi muy bien las esplicasiones paso a paso para colocar la imagen de fundo a pesar que creo¡¡¡¡¡ averlo hecho bien no veo la imagende fondo que coloque, te agradeceria muchisimo si me ayudases mi link http://fanaticosanime-manga-samy-tsunade.blogspot.com/
    alli tengo un box cualquier cosa me dejas el mensaje o tu correo para comunicarnos si me puedes ayudar muchas gracias

    ResponderEliminar
  5. Muy buena explicación, serías tan amable de apoyarme diciéndome cómo poner un SWF en lugar de mi banner en mi blogger?... gracias

    ResponderEliminar
  6. Holas!
    Para Samy, pues puedes escribirme a mi correo(está en el pie de página de este blog), no tengo ningún inconveniente.

    Para Manolo, pues te refieres a que quieres cambiar tu cabecera por un swf o que quieres agregar un banner en algún sitio de tu blog (sidebar, post, etc). No te endentí bien. Por favor, si puedes me explicas un poco el detalle.
    Saludos.

    ResponderEliminar
  7. hola!!

    Espero que puedas ayudarme, yo quiero poner un swf. de fondo en mi blog de blogger. esta animación la tengo guardada en mi pc, por favor si sabes como hacer para ponerla dime como se hace.

    Muchas gracias!!

    ResponderEliminar
  8. Anónimo10/27/2008

    Hola, esta todo muy bien e hice todo lo que indicaste peeero, funciona solamente con TU IMAGEN! o sea si yo pongo el url de tu imagen se ve todo bien, pero al poner mi URL, sale en blanco. ojala puedas responder, beso.

    ResponderEliminar
  9. Hola, sabes todo esta bien, excepto que todo me funciona con tu URL, ojala pudieras decirme porque, o sea si yo pongo otra URL no funciona, pero con la tuya si :S

    ResponderEliminar
  10. Holas!

    Para Sonia: pues no he probado hacer algo como ello, y no es fácil encontrar algo así tampoco ya que sería demasiado pesado llevar algo así. Lo que sí puedes hacer es convertir tu swf a gif animado si es que lo haces por la animación.

    Para Mur: hola Mur, algo estás haciendo mal supongo. Recuerda que necesitas la url de la imagen que deseas colocar y que esta no sea copiada de algun sitio (blog, web, etc), si es así, bájala a tu PC y vuelve a subirla a algún sitio dedicado a cumplir con esta tarea como flickr.com, imageshack.us, photobucket.com, etc.

    Saludos!

    ResponderEliminar
  11. como puedo hacer para que la imagen no se repita sino que me tome todo lo largo que tiene el blog

    ResponderEliminar
  12. Hola Gestion Ambiental!
    Para repetir a lo largo(horizontalmente) de tu blog necesitarás añadir la siguiente línea:

    background-repeat: repeat-x;

    luego de la línea donde has agregado la URL de tu imagen de fondo. Para el ejemplo que he colocado yo, debería quedar así:

    background-image:url(http://img107.imageshack.us/img107/3635/pat3ud0.jpg);
    background-repeat: repeat-x;


    luego el resto de líneas quedan igual.
    Saludos.

    ResponderEliminar
  13. Hola!!!!
    Realmente mil disculpas por preguntarte esto porque tus explicaciones son muy claras, la verdad q trate y trate de poner la imagen como fondo y no hubo forma, a mi parecer segui los pasos que dictaste con cautela pero evidentemente algo estoy haciendo mal porq no logro mi cometido...( mi intencion es q la imagen se repita tanto vertical como horizontalmente, aunque todavia ni siquiera logre poner la imagen sin q se repita!!!) te paso el url de mi blog y el de la imagen q pretendo utilizar de fondo!!
    mi blog es
    justinrandalltimberlakefansite.blogspot.com

    y la imagen esta en
    http://www.flickr.com/photos/33058969@N02/3082914615/


    Muchisimas gracias x tu tiempo, realmente lo aprecio!! :)

    ResponderEliminar
  14. Hola Jay Jordan!
    Solo debes seguir los pasos que te indico en el tutorial, pero antes debes contar con una imagen pública en Flickr (tampoco pude verla pq me dice está como imagen privada). Lo que puedes hacer es descargarla a tu Pc y volver a subirla desde tu cuenta Flickr y eso es todo.

    Saludos.

    ResponderEliminar
  15. una pregunta
    LA SITUACION DE MI BLOG ES ESTA
    , PONGO EL URL Y TODO

    LA IMAGEN SI SE PONE

    PERO SE MUEVE A LA HORILLA DEL LADO DERECHO

    NO SE VE EN LO ABSOLUTO, ESTA COMO EN BORDE

    ME PODRIAS RESPONDER?

    BYE

    ResponderEliminar
  16. No puedo ver mi imagen :(...
    porfavor me ayudas, se ve todo blanco te doy mi msn a ver si me puedes mandar un mail explicandome porq pasa eso...beso!! y gracias

    ResponderEliminar
  17. mmm creo q no te puse mi msn :S no me acuerdo mmm luzdelirios@live.com.ar

    ResponderEliminar
  18. conchi moyano1/28/2009

    Hola, en primer lugar gracias por los tutoriales que nos das.
    Estoy intentando poner un fondo en mi blog (Blogger) haciendo lo que comentas y no me sale, no se que es lo que hago mal.

    He subido la imagen a imageshack para conseguir el url y cuando lo pego en el sitio indicado no obtengo cambios, por que ocurre esto? Gracias

    ResponderEliminar
  19. Genial!! muchisimas gracias :]

    llevaba varios días buscando la manera de hacer eso, y lo intente de las formas q se, pero me salia solo el pattern.
    Me faltaba el outer-wrapper

    :]

    ResponderEliminar
  20. Juro que si no fuera por vos , jamas de los jamases hubiera podido cambiarle el fonto ♥ muchisisimas gracias.

    ResponderEliminar
  21. Quiero poner una imagen de fondo en mi blog i no puedo.
    toomiitoo@live.com.ar me agregas i me dices bien coomo?

    ResponderEliminar
  22. HEY GRACIAS YA LO PUDE PONER PERO TENGO UNA DUDA QUIERO QUE SOLO SALGA ESA IMAGEN QUE MONTE EN FONDO Y SUB FONDO SALFA OTRO COLOR O OTRA IMAGEN ESO PARA QUE SE ME PUEDAN LEER LAS LETRAS SI GARCIAS...

    ResponderEliminar
  23. gracias pibe ya lo solucione solo tenia que copiar tu codigo para que saliera sin ese fondo trasparente..xD

    ResponderEliminar
  24. Gracias muchas Gracias

    ResponderEliminar
  25. HOLA QUERIDO AMIGO NO PUEDO CAMBIAR MI IMAGEN DE FONDO HAGO TODO PERO ME QUEDA EL FONDO BLANCO. TE DEJO MI BLO Y MI CORREO ES MARCE_LA_PETI@HOTMAIL.AYUDAME POR FAVOR HACE DIAS QUE BUSCO AYUDA

    ResponderEliminar
  26. Hola Marcela
    Te olvidaste de dejarme tu blog. El blog que está enlazado a tu nombre tiene plantilla negra, ¿a qué blog te referías?

    ResponderEliminar
  27. hola, quiero consultarte un tremendo problema.. consigo poner la imagen de fondo, probe con varias y consigo subirlas a todas como fondo pero el problema es que salen incompletas, se ve solo la mitad de la imagen, sera que son muy grandes??, se puede cambiar el tamaño de la imagen . gracias .

    ResponderEliminar
  28. AUXILIO:
    ya probe de todas maneras y no hay forma. tengo un fondo negro y quiero poner una imagen de fondo.. hago todos los paso y el fondo aparece en blanco.. que hgo mal o ..
    Gracias

    ResponderEliminar
  29. Holas!

    Para Miriam Velazco: Pues posiblemente, ya que con el código que les he dado es para que la imagen se repita tanto en vertical como horizontalmente. Si gustas puedes enviarme la imagen que deseas poner como fondo a mi correo (en la parte inferior de este blog está) y te digo si ese es el problema.

    Para Picapiedras: Pues algo estás haciendo mal. Recuerda que el "background-image:url" debe estar debajo de donde dice: "background:$bgcolor", o simplemente este último puedes eliminarlo.
    Igual que Miriam, no olviden que pueden dejarme la dirección de su blog para así poder ver qué tipo de plantilla y css tienen y poder ayudarlos.

    Saludos

    ResponderEliminar
  30. Hola pongo logro poner el fondo pero las entradas que publico no se logran ver las letras bien, como hago para que en las entradas un contra fondo, no se si me explico bien

    ResponderEliminar
  31. Hola: Me pasa exactamente lo mismo que a la mayoría. Escribo tu url y sale el fondo, pero si pongo mi url no pasa nada. ¿por qué sucede?
    Gracias

    ResponderEliminar
  32. Graxias Muchisimas Gracias!!

    me has ayudado bastante.....

    Pero aun no he logrado ponerlo. X_X

    ResponderEliminar
  33. Hola Cecilia
    Es importante saber dónde tienes alojada tu imagen de fondo. En mi caso, la imagen la tengo alojada en flickr.com (si tienes un correo en Yahoo, entonces podrás ingresar con tus mismos datos de acceso a http://flickr.com para subir tu imagen y luego obtener la URL respectiva de esa imagen, pruébalo).
    Saludos

    ResponderEliminar
  34. Hola que tal, pues eh estado probando, y subi la url de la imagen de ImageShack

    esta es la direccion url:
    http://img196.imageshack.us/img196/8444/6a00d83420dec753ef00e54i.gif

    pero aun asi no surte efecto, soy nuevo en esto del blog, y pues, ando viendo como ponerlo de alguna forma mas al dia o visual, en si entiendo tus pasos... pero, solo se me queda en blanco la pantalla, ni con tu URL queda...

    espero me puedas ayudar Porfavor!

    ResponderEliminar
  35. Hola ElComunicador!
    Probé tu fondo en mi blog de pruebas y todo marchó bien. Quizás estes haciendo algo mal.
    He vuelto a reescribir el tutorial para que se pueda entender mejor. Que tal si lo vuelves a intentar.
    Saludos.

    ResponderEliminar
  36. Hola, creo que no soy la unica con el problema de la imagen, he seguido todos tu pasos pero mi fondo no cambia, mi plantilla es la "minima" y el fondo es blanco pero aunque le cambie el color ni eso cambia u.u nose si me puedas decir que hize mal porque he intentado con muchos tutoriales y en todos tengo el mismo resultado, por el momento mi blog es privado pero si gustas lo puedo desbloquear.Gracias de antemano.

    ResponderEliminar
  37. Gracias tio eres bueno en esto me quedo bien estoy fabricando un blog http://wowarnion.blogspot.com/
    pasate y mira como quedo aun me quedan cosas que poner y hacer aver si la dejo mejor que mi otra web
    no tengo mucha idea de web ni nada aunque ya cree una web alo loko no se si te parece que esta bien xD http://wowarnion.spaces.live.com
    despues de cambios y cambios aprendi un poco sobre usar html y mas cosas
    PARA LOS QUE SE ATASCAN MUCHO

    solo con poner

    background-image:url(http://img107.imageshack.us/img107/3635/pat3ud0.jpg);

    pero poniendo el url de tu imagen lo tienes eso va como lo explica en esta web pero segun la plantillas que usas es como debes ponerlo no todas estan igual

    ResponderEliminar
  38. Hola Chicos!
    Donde dice:

    background-image:url(http://img107.imageshack.us/img107
    /3635/pat3ud0.jpg);

    es todo seguido, sino que en el ejemplo se ve en otra línea por falta de espacio. Si logran copiar y pegar el código que les doy arriba en el tutorial, verán que les aparecerá todo seguido, y es así como deben dejarlo.

    Saludos.

    ResponderEliminar
  39. desconocía eso me fue de mucha ayuda chvr........
    salu2

    ResponderEliminar
  40. La verdad, no me funciona y no se por qé -_-

    ResponderEliminar
  41. Anónimo7/24/2009

    Hola Johan.T! Gracias por el tutorial!
    Me ha servido de mucho pues he conseguido poner la imagen de fondo...pero no quiero que se repita...He hecho tambien lo que dijiste para que no se repitiera, de manera que me quedo esto:

    background-image:url(http://farm3.static.flickr.com/2589/3753163688_073ca859d4_b.jpg);background-repeat:repit-x;
    margin:0;
    color:$textcolor;
    ...}

    Se sigue repitiendo. Que hago mal? Contesta porfa! Y gracias!

    ResponderEliminar
  42. Hola Anónimo

    Pues entonces reemplaza donde dice:
    background-repeat: repeat-x;
    por esta otra línea:
    background-repeat: no-repeat;
    Y listo, asunto solucionado. Así tu imagen ya no se repetirá.

    Recuerda que el background-repeat: repeat-x; era si es que querías que tu imagen se repita solo horizontalmente a lo largo de tu pantalla.
    Saludos.

    ResponderEliminar
  43. ke ondas men gracias loco al fin pude poner fondo en mi blog jeje muy buena informacion bay

    ResponderEliminar
  44. Muy útil tu blog, Excelentes tutoriales!
    Una duda, que linea tengo que agregar en el codigo para que la imagen no se mueva, para que se quede fija sin moverse al lado del texto. Gracias!

    ResponderEliminar
  45. Hola FheR ice
    Si deseas poner fija la imagen de fondo en tu blog, necesitarás agregar esta línea en el body:

    background-attachment: fixed;

    Saludos.

    ResponderEliminar
  46. Hola
    esta bien pero tengo un problema
    es que cuando pongo la imagen de fondo (en la minima) esta todo bien ...pero cuando lo hago con otra plantilla el fondo principal me tapa la imagen
    como hago para solusionar el problema
    aqui mi blog para q lo veas
    http://nevermind-sp.blogspot.com/

    chao

    ResponderEliminar
  47. Hola
    sabes que trato y trato pero no me funciona, por mas que cambio distintas imagenes, no pasa nada, sigue quedando asi mismo, si puedes ayudarme porfa!

    ResponderEliminar
  48. alejandrooo9/21/2009

    Hola, espero no haber llegado tarde, lo que quiero hacer creo q es un poko mas complicado...
    tengo una plantilla de 1280 px de ancho e hice un fondo con photoshop de la misma medida ya subi la imagen a picassa, http://lh4.ggpht.com/_PWCRBuSp3AQ/SremZ4fpU9I/AAAAAAAAANQ/KgJRe85MpUM/s640/fondo%20pagina%20revista.png en medio del marco kiero poner una "revista" en flash con el efecto pageflip...pero no se como hacer para que el fondo abarque todo el cuerpo del blog... agredeceria tu ayuda,,, gracias...

    ResponderEliminar
  49. oye muchisimas
    gracias funciono perfectamente
    el fondo
    pero tengo otra pregunta
    como pongo un cuadro de comentarios en mi blogger asi como en el que estoy comentandote
    responde porfa en mi blog

    ResponderEliminar
  50. muchas gracias por el post!!

    pero queria saber si la imagen se quede sin repetir, que solo se mire una

    ResponderEliminar
  51. Hola Fanshakira:
    Para poner un cuadro de comentarios en tu blog solo tienes que ir a tu panel de control de tu Blogger, luego a "Configuración", luego ir a la pestaña de "Comentarios" y ahí activar la opción que dice "Entrada incrustada a continuación". Eso es todo.

    Hola HV:
    Para poner un fondo y que éste no se repita tienes que hacer lo siguiente:
    Reemplazar donde dice:
    background-repeat: repeat-x;
    por esta otra línea:
    background-repeat: no-repeat;
    Y listo, asunto solucionado. Así tu imagen ya no se repetirá.
    Saludos!

    ResponderEliminar
  52. por alguna razon no logro poner fondo con la img a mi blog el agradeceria cualquier ayuda http://materiainfernal.blogspot.com/

    ResponderEliminar
  53. MUCHAS GRACIAS... MIRA LO QUE HICE CON MI BLOG GRACIAS A TI !

    ResponderEliminar
  54. Hola,
    Siguiendo tus indicaciones consigo subir la imagen que quiero de fondo al blog, pero lo que quisiera es que el bloque de las entradas del blog y la columna de gadgets no tapasen la parte derecha e izquierda de la imagen (en el caso de tu blog sería la parte que parece un papel pintado). ¿qué tamaño tiene que tener la imagen para que esto no pase? ¿qué tengo que hacer para que esto no pase?
    Si me pudieses ayudar te lo agradecería un montón, ya que me estoy volviendo loca con el tema.
    Muchas gracias.

    ResponderEliminar
  55. muchas gracias...es lo que estaba buskndo para mi blog...y si funcionó....

    thnx again....

    ResponderEliminar
  56. Hola Bakartxo
    Primero déjame decirte que tienes un blog muy bonito, incluyendo la música que tienes de fondo :)
    Bueno, a ver... en la parte del fondo puedes seguir lo que explico en el tutorial, es decir, poner una imagen de fondo (la que desees), pero eso hará que no dejen ver tus entradas, para ello harás lo siguiente:

    En la parte donde dice: #outer-wrapper
    agregarás lo siguiente (dentro de las llaves):

    background-image:url(http://img3.imageshack.us/i/bgbakartxo.jpg/);
    width: 950px;
    background-repeat: repeat-y;
    background-position: center 90px !important;
    background-position: 11px 90px;
    margin-top: 0;
    margin-right: auto;
    margin-bottom: 0;
    margin-left: auto;
    padding-top: 0px;
    padding-bottom: 10px;
    padding-right: 10px;
    padding-left: 10px;

    Dejando todo lo demás que encuentres en tu outer-wrapper tal y como lo encuentres.
    El ancho de tu fonde de las entradas es de 950px.. por eso es que ya lo coloqué en el código que te estoy dando. También te he colocado un fondo para que lo pruebes con tu blog y veas como queda. Ya luego tú puedes cambiarlo pero recuerda que el ancho debe tener 950px de ancho.
    Bueno, cualquier duda, me escribes.
    Saludos.
    Buen trabajo el que haces.

    ResponderEliminar
  57. Hola Johan,
    Te agradezco tus palabras hacia mi blog... trabajo que me está costando, ya que yo de html no tengo ni idea.
    He hecho los cambios que me has dicho. Si entras en mi blog verás cómo ha quedado.
    Y ahora que ya lo has visto, te explico que es lo que me gustaría hacer con el fondo de mi blog: las abejitas de la derecha quiero que estén más a la izquierda (que no toquen el texto) y las abejitas de la derecha quiero que esten a la derecha de la columna de los gadgets. ¿podrías ayudarme en esto?
    Muchísimas gracias por tu ayuda...

    ResponderEliminar
  58. Otra cosa que igual me puedes ayudar. La imagen que dice "YO" es un gif que abre y cierra los ojos, pero no sé cómo tengo que hacer para que haga ese efecto.
    Si también me pudieses ayudar en esto, me harías la persona más feliz de este mundo (por lo menos del mio).
    Muchas gracias otra vez.

    ResponderEliminar
  59. Hola Bakartxo
    Creo que sí entendí lo que quieres hacer. Entonces lo que harás es lo siguiente:
    El outper-wrapper lo volverás a dejar tal y como está en el tutorial, es decir, vuelve a reeplazarlo por esto:
    #outer-wrapper {
    background: #000000;
    width: 660px;
    margin:0 auto;
    padding:10px;
    text-align:$startSide;
    font: $bodyfont;
    }

    Y lo que haremos para que aparezca el fondo que quieres es modificar el body. Localiza donde diga esto en tu blog:
    body {
    font: 11px/165% 'Lucida Grande', Geneva, Verdana, Arial, Helvetica, sans-serif;
    color: #CAF99B;
    margin: 0; padding: 0;
    background: #010000
    text-align: center;
    }

    y lo reemplazarás por esto otro:
    body {
    background:$bgcolor
    background-image:url(http://farm3.static.flickr.com/2729/4058791010_aaf32c3348_o.jpg);
    background-repeat: repeat-y;
    margin:0;
    color:$textcolor;
    font:x-small Georgia Serif;
    font -size/* */:/**/small;
    font -size: /**/small;
    text-align: center;
    }

    Yo ya te he puesto la URL de la imagen de tus abejitas para que aparezcan de manera correcta, así que solo necesitas hacer lo que te indico y nada más.

    Ahora, lo otro. Muchos de los sitos que te permiten subir imágenes te 'matan' la animación, es decir, aparecen estáticas. Te recomiendo que subas tu imagen animada (con extensión .gif) a esta dirección: http://imageshack.us/
    Una vez que subes tu imagen, te dará una serie de códigos. Tú eligirás la que comience con (signo menor)img.... y luego lo pegas en el lugar de donde está actualmente tu animación en el blog.

    Bueno, espero haberte ayudado. A ver cómo te va con todo lo que te explicado... ya me contarás...
    Saludos.

    ResponderEliminar
  60. Malas noticias: modifico lo que tu me dices y me sale el siguiente error:No hemos podido guardar tu plantilla
    "Por favor, corrige el siguiente error y envía la plantilla de nuevo.
    Declaración de variable no válida en máscara de página: La variable se utiliza, pero no está definida. Información: startSide."
    ¿puede ser que hayamos hecho algo incompatible con alguna parte del resto de la configuración? Si quieres echarle un ojo a la configuración que tenía antes de hacer ningún cambio, te la envío a tu correo.
    Lo del gif me ha funcionado de cine (me ha quedado un poco grande, pero por lo demás era lo que quería).
    Otra vez: Muuuuuuchiiiisimas gracias por tu ayuda.

    ResponderEliminar
  61. Hola, estoy intentando seguir tus pasos para poner un fondo con una imagen rojo damasco, y no me da resultados, no hay cambios, mi plantilla es minima black, crees que eso tiene algo que ver? me gustaría que me echases una manita. El blog que estoy montando es Compases de Amargura, gracias de antemano por tu ayuda

    ResponderEliminar
  62. Disculpa, soy Yo atra vez, me gustaría poner en la cabecera 3 fotos que vayan rotando, existe alguna manera de hacerlo? gracias por tu ayuda.

    ResponderEliminar
  63. Hola Bakartxo.
    Sorry por la demora en conteste. Estuve de viaje.
    Y sí, ya vi como te quedaron las animaciones.. están padres!
    En cuanto al error que te da, sí, yo me equivocado. En todas las líneas de ese código que te he dado deben terminar siempre con un ";" (punto y coma). Ahí me olvidé de colocar ";" después de donde dice "background:$bgcolor" (en el body) y también deberás eliminar del outer-wrapper la siguiente línea: "text-align:$startSide;".
    Luego todo lo demás está bien. Recuerda siempre guardar tu plantilla original por si tienes problemas luego y así puedas volver a restaurarla.

    Me encanta esa canción q tienes de fondo "Life is wonderful"... yeah!!

    Saludos!

    ResponderEliminar
  64. Hola Luciano
    Creo que llegué tarde a tu pregunta. Ya lo lograste verdad?. He visto tu blog y ya tiene un fondo color rojo. Eso es lo que querías?.

    ResponderEliminar
  65. Hola Johan,
    Todo lo que me estás diciendo me está resultando de mucha ayuda. Así que ya he hecho los cambios que me has dicho y la cosa funciona... además he hecho algunos cambios más para que las abejas queden fijas en el fondo. Y ahora otra pregunta ¿Cómo puedo hacer para que las abejas y las flores en lugar de estar en la mitad de la pantalla estén en el fondo? y otra, ¿qué tamaño tiene que tener la imagen de fondo para que esta imagen ocupe todo el fondo?
    Prometo dejarte en paz... y muchas gracias de nuevo!!!

    ResponderEliminar
  66. Si, conseguí poner el fonso damasco que quería, pero me da algunos problemas al ver el contenido de los post y de la sidebar, quería poner en el cuerpo del blog, otro fondo diferente, como un pergamino, tengo la imagen, pero no se como hacerlo, me gustaría que quedara alpo parecido al tuyo, que vaya desde el header hasta el footer, diferenciandose del fondo de damasco en rojo, mi plantilla es la minima black.
    Gracias por tu ayuda, un saludo

    ResponderEliminar
  67. Si funciona muchas gracias=) la verdad esuqe prove muchas veces pero con el url desde tynipic.. y no resultaba , pero lo hice en esa pagina qe diste.. y me funciono:D muchisimas gracias:D

    ResponderEliminar
  68. Holas! Wow que tarde llego!
    Bakar se puede hacer de varias maneras, pero para no complicarse la vida, solo reemplaza la url de la imagen de tu body por esta otra que te doy: http://farm3.static.flickr.com/2585/4098547367_942a4f11de_o.jpg

    Hola Luciano, veo q otra vez llegué tarde. Te quedó bien el blog.

    Hola Cheeps: Me alegra q te haya servido.

    Saludos a todos.

    ResponderEliminar
  69. Millones y millones de gracias... ahora sí que está como quería.

    ResponderEliminar
  70. Primero felicitarte por tu gran pagina y por tu gran ayuda.
    Ya puse una imagen de fondo a mi blog, pero habria alguna manera de poner mas de una imagen de fondo.

    gracias por tu respuesta

    ResponderEliminar
  71. Hola! Muchas gracias por tu info, está super bien explicado, pero no entiendo por qué a mi no me sale.. Hago todo como tú lo explicas (lo he hecho varias veces) y nada. En imageshack.us tengo la imagen que quiero (una cenefa parecida a la de este blog), y nada, al darle a Vista Previa o al aceptar el cambio, el fondo de mi blog no cambia, sigue blanco. Mi blog es mar-blanco.blogspot.com Si puedes ayudarme por favor, mi email es marblanco.art@gmail.com Muchísimas gracias de verdad.

    ResponderEliminar
  72. No sé que hago mal, pero no me sirve, lo hago exactamente como decis, hasta copie con tu url pero tampoco va,

    ResponderEliminar
  73. Gracias por esa publicación es muy importante saber cositas como estas.-

    ResponderEliminar
  74. muchas graciaaas!
    me has ayudado full

    visita mi blog ^^
    www.solocosasdemivida.blogspot.com

    ResponderEliminar
  75. hola! esta muy bien tu explicacion pero en mi blog, puse para que las entradas se vieran con fondo negro, pero quiero que tambien se vean en negro los gadgets, porque sino no le ven las encuestas!

    podrias decirme como se hace? o si alguien sabe agrafeceria ayuda!

    ResponderEliminar
  76. Para Jai Jordan:

    Hola, igual me equivoco pero diría que el enlace de tu imagen no está completo. Prueba de copiar el enlace entero, así te funcionará (creo)...

    Un saludio,.

    ResponderEliminar
  77. Gracias, había buscado la misma información en otras webs y esta es la única que me ha resuleto cómo poner una imagen de fondo.

    ResponderEliminar
  78. jeje gracias, me ayudaste mucho y sabes explicar muy bien, sigue así

    ResponderEliminar
  79. Anónimo1/20/2010

    Gracias!!!!eh echo toda mi pagina gracias a gente como tu.. q mal lo mio pero ta .. el q no sabe no sabe

    ResponderEliminar
  80. Hola, por mas que lo intento no hay manera de poner el fondo a mi blog. Sigo todos tus pasos pero me pierdo cuando hay que insertar la imagen(¿donde?.Yo hago lo del "backup" y aqui ya me pierdo.Ya tengo todos los codigos desde imageshack.us, pero no consigo el resto. A ver que puedo estar haciendo mal. Dime que necesitas pero muy especificado que soy muy novata en todo esto.

    ResponderEliminar
  81. Hola, por mas que lo intento no hay manera de poner el fondo a mi blog. Sigo todos tus pasos pero me pierdo cuando hay que insertar la imagen(¿donde?.Yo hago lo del "backup" y aqui ya me pierdo.Ya tengo todos los codigos desde imageshack.us, pero no consigo el resto. A ver que puedo estar haciendo mal. Dime que necesitas pero muy especificado que soy muy novata en todo esto.

    ResponderEliminar
  82. Mil gracias, había mirado en varios sitios pero ha sido aquí donde se me han disipado todas mis dudas y frustraciones con este tema. ;)

    Un virulento saludo desde la morgue!!

    ResponderEliminar
  83. Hola! Estoy abriendo uun blog y le quiero meter un pattern por detrás que se deberia repetir por x y por y. Estoy asumiendo que x e y son los ejes. Me parece que me esta faltando la coordenada que indica que se repita horizpntal y verticalmente.
    tengo la que es repeat repeat x y repeat repeat y, cual es la que le dice que lo haga por los dos?
    a mi body le puse esto:
    body {
    background:$bgcolor;
    background-image:url(http://farm3.static.flickr.com/2683/4312232258_6ab1925c0a.jpg);
    background-repeat: repeat-x;
    background-repeat: repeat-y;
    margin:0;
    color:$textcolor;
    font:x-small Georgia Serif;
    font-size/* */:/**/small;
    font-size: /**/small;
    text-align: center;
    }

    Otra pregunta!: Por más de que pruebo cambiar tamaños y cargar la imagen del titulo, no puedo hacer que me encastre en el rectangulo dedicado al título. Qué medidas debería tener el archivo para que me encastre perfecto?, porque siempre me sobresale un pedacito a la derecha!

    Desde ya mas que mil gracias! : )

    ResponderEliminar
  84. MUCHAS GRACIAS!!!
    XD
    SALUDOS!!!
    ^^

    ResponderEliminar
  85. no me sirve si no es con tu imagen, he provado diferentes imagenes pero nada se queda en blanco nose cual es la solución

    ResponderEliminar
  86. Disculpa existe alguna manera de reducir el tamaño de la imagen que elegi, esque la que yo queria poner resulto ser muy grande y no se ve bien. Gracias,ojala sepas alguna respuesta

    ResponderEliminar
  87. Hola carnal muchas gracias por el tutorial es claro y consiso, de principio me salia el fondo blanco pero solo había que quitar la parte que decia:
    " background:$bgcolor "
    la elimine y no tuve más problemas no se si sea esta la causa del problema de los demás. Otra vez gracias.

    ResponderEliminar
  88. Hola a todos!

    Para CeciLee: por defecto una imagen se repite tanto en "x" e "y" sin necesidad de estar definiendo la propiedad "background-repeat". Elimina ambas propiedades a las que haces referencia y listo.

    Para angelitos: Pues intenta nuevamente eliminando la línea donde dice: "background:$bgcolor;" y pues la manera más fácil de reducir una imagen es que lo hagas reduciendo tú mismo tu imagen editándola con cualquier programa y volviéndola a subir a algún sitio para que puedas obtener la URL (dirección web) que utilizarás en tu código.

    Para Dumah: es posible que esa sea la solución. Recuerda qeu esa línea que eliminaste yo recomendé colocarla antes que la otra línea donde se hare referencia a la imagen (pattern) e incluí la línea en cuestión debido a que a veces la imagen queda inactiva y en lugar de qeu tu fondo se vea blanco tome el color que le hayas colocado en tu panel de estilos (Diseños->Fuentes y colores). Pero esta bien, si te funciona así no hay problema.

    Saludos a todos.

    ResponderEliminar
  89. Hola!! Muchas gracias!!!!
    Gracias a tu información he conseguido poner un estupendo fondo a mi galería de imagenes.
    Seguiré visitándote para ver más informaciones valiosas!!
    Te dejo URL por si deseas ver cómo quedó !!

    http://sgroyaparadise.blogspot.com/

    Muchas gracias .. besosssss

    ResponderEliminar
  90. Hola otra vez Johan. Hacía tiempo que no pasaba por aquí por que los cambios que hice gracias a ti, me dejaron un blog que me encantaba... Pero desde ayer no sé lo que pasa que salta publicidad y además el encabezado tiene un marco rosa que no me gusta nada. ¿Sabes qué puede haber pasado? y si es así ¿sabes cómo podría hacer que no apareciese la publicidad y quitar el marco fucsia del encabezado? Si pudieses ayudarme te lo agradecería muchíiiiisimo.

    ResponderEliminar
  91. Hola, somos Shiia y Sho, hemos hecho todo tal cual dice y no hemos logrado nada... igual te damos las gracias por la información. Seguiremos intentando.

    ResponderEliminar
  92. Hola Bakar
    Q tal!. Bien, algo se movió seguramente pero todo tiene solución.

    Arreglando el marco rosado: Anda al código de tu blog y localiza esta parte de código (ayúdate presionando las teclas Ctrl+F para activar el buscador):
    ¿Lo encontraste? Ahí, 3 líneas abajo encontrarás algo como "img alt='7 botas para Tecla'...". Entonces seguido de donde dice height='492' escribirás esto: border=0

    Como te habrás dado cuenta, en tu "Mini Yo" también tu imagen tiene un borde rosa ¿verdad?. Entonces, otra vez, ayudándote con el buscador, localiza en tu código donde diga "Mi mini Yo". Ahí, dos líneas abajo encontrarás algo como: alt='Mi foto' class='profile-img'.... etc. Entonces ahí, luego de donde dice: "height='80'" escribirás esto otra vez: border=0

    Ahora guarda estos cambios de tu plantilla y el problema estará solucionado. Si no, me vuelves a escribir para solucionarlo de otra manera.

    Arreglando la ventana de publicidad: Esa ventanita no es más que publicidad intrusiva que aparece por algún script o código que hayas agregado. En tu caso, puede provenir de dos cosas: de tu "widget de música" que has agregado o de tu "Contador de visitas". No logré ver exactamente que ventana apareció pq tengo un software en mi PC que bloquea estas ventanas pero estoy casi seguro que proviene de tu "Contador Web" que has agregado. Yo te recomiendo que lo elimines y uses uno de este sitio: http://www.contadorgratis.es/ que no trae publicidad.

    Bueno Bakar, espero haberte ayudado y sorry por la demora en contestarte y es que anduve un poco desconectado.
    Saludos!

    ResponderEliminar
  93. johan t sos groso!! compadre! ¬¬ pero deviste haber advertido antes ese error de escritura, ta que lo intente 50 mil veces y hasta q no llegue a ese comentario tuyo no pude hacer nada!

    si puede ponerme en la lista del primer comentario para decir que este tutorail es el mejor! por q los otros ta q te dejan cagando!!!

    saludos!! visitame http://jhustdesign.blogspot.com/

    ResponderEliminar
  94. Gracias, estoy empezando con mi blog y esto me ayudo mucho.
    www.millenniumlisbethsalander.blogspot.com

    ResponderEliminar
  95. oye como ago para que mi fondo este en mosaico

    ResponderEliminar
  96. Hola Johan. Gracias a tí he podido poner una imagen a mi blog pero me sale muy pequeña.La medida d emi pattern es 140x780 pixels ¿Qué medida debe tener el pattern o quizá me falta alguna línea de código? Yo lo copié tal cual indicas al principio.
    Gracias

    ResponderEliminar
  97. Johan T.3/08/2010

    Hola Chicos!
    Para emoxgabriel y Damiata: Pues no es necesario que agregen nada para que su pattern se repita en mosaico. Sin embargo, si quieren forzar a hacerlo pueden agregar este par de líneas de código luego de la url de su imagen que agregaron:

    background-repeat: repeat-y;
    background-repeat: repeat-x;

    Espero eso los ayude.
    Saludos

    ResponderEliminar
  98. Anónimo3/13/2010

    hola johan gracias por estos tutoriales maravillosos, mi pregunta es que tamaño debe tener la imagen que quiero poner de fondo en resolucion o pixeles para poderla poner en todo el fondo del blog sin que se repita? gracias

    ResponderEliminar
  99. Yo lo he probado y no me a funcionado :/

    ResponderEliminar
  100. Hey bro pues yo ya hize el tutorial siguiendo cada letra cada palabra y me pasa lo mismo pongo todo bien y al ver mi blog me sale el fondo BLANCO pues haber si me puedes ayudar... aqui esta el link de mi blog:
    http://chihuahuacore.blogspot.com/
    Espero tu respuesta saludos

    ResponderEliminar
  101. Hola Zonbiegarage
    Revisé tu código y localicé el error, y es que te has olvidade de un ";" en la parte del body. Localiza esta lídea de código: background:#000000
    Ahí tienes que ponerle un ; al final y asunto arreglado.
    Suerte.

    ResponderEliminar
  102. Johan eres un genio!!! Gracias, ya he podido cambiar el fondo de mi blog de prueba y me ha gustado así que voy a mi blog principal a implantarle el cambio. GRACIAS!!!!!

    ResponderEliminar
  103. Hola Johan, excelente tu artículo. Te comento que he puesto el fondo y me ha quedado muy bonito pero la imagen tiene a ambos lados unos dibujos. Cuando la pantalla del explorador está totalmente maximizada, todo se ve perfecto pero cuando la pongo por ejemplo a mitad de tamaño (especialmente cuando angosto el ancho de la ventana del explorador, sea IExplorer o Firefox), el texto se solapa del lado izquierdo con los dibujos, por lo que no puede leerse bien. Es como si al cambiar el tamaño de la ventana de navegación, se ajustase todo menos el fondo y por ende los dibujos impiden que se lea bien el texto ¿qué puedo hacer para arreglarlo? El blog es http://embarazodespuesdelos40.blogspot.com Desde ya agradecida por tu ayuda y un gran abrazo

    ResponderEliminar
  104. Este post está muy bien podrías indicarme como puedo hacer lo mismo con las sidebars de los laterales, gracias por adelantado.

    Correo:l4depende@gmail.com

    ResponderEliminar
  105. Felicitaciones, he pasado un buen momento leyendo los comentarios y solicitudes de ayuda.. muy buena presentación de tu trabajo. Saludos Héctor Palito

    ResponderEliminar
  106. Hola ils:
    Muy bonito blog el que tienes.
    Al punto. Una forma no tan eficiente pero sí efectiva y práctica es colocar una nueva imagen con el ancho o grosor del tamaño que tenga tu blog (por ejemplo de 660px), luego subirla a algún sitio como imageshack.us y luego hacer las modificaciones respectivas en tu outer-wrapper. Yo te he preparado el código listo para que solo lo agregues en tu blog y lo pruebes. Quizás te agrada.

    Localiza esta parte de código en tu plantilla y agrega las líneas que te muestro a continuación:

    #outer-wrapper {
    background-image:url(http://img405.imageshack.us/img405/9351/bgembarazo.gif);
    width: 660px;
    background-repeat: repeat-y;

    El resto de código que encuentres en el outer-wraper lo dejas tal y como está.
    Prueba y luego me cuentas.
    Suerte.

    Saludos a todos los demás y que bueno que les haya quedado bien.

    ResponderEliminar
  107. Johan.... ERES UN GENIO!!! wowwwww graciassssssss que alegría me ha quedado perfecto y se ha solventado. Ya no se monta el texto sobre los laterales de la imagen!!! GRACIASSSSSS a ver dale un vistazo, acepto las sugerencias jejeje abrazos
    ilss
    http://embarazodespuesdelos40.blogspot.com/

    ResponderEliminar
  108. Hola Johan soy yo de nuevo!!! a ver, se me ocurre y supongo que se pueda, que la imagen de cabecera se quede fija de forma que cuando baje recorriendo el contenido vertical de la página, la cabecera se mantenga a la vista. Actualmente a medida que me desplazo hacia abajo, se pierde de vista la imagen de cabecera (no la de fondo sino la que tiene el título de mi blog) ¿Hay forma? Por fis si la hay, dime. Ahora estoy emocionada con los cambios que a bien me explicaste y ya casi casi se ve como quiero ;-) Gracias - http://embarazodespuesdelos40.blogspot.com/

    ResponderEliminar
  109. Hola ilss:
    Veo que quedó bien tu blog. En cuanto a lo que me preguntas, pues sí se puede hacer eso, sin embargo en tu caso no te lo recomendaría ya que la cabecera de tu blog es demasiado ancha para que esté siempre fija, eso supondría que gente como yo por ejemplo que tengo una portátil, nunca viéramos la información de tu blog ya que la cabecera ocuparía casi toda la mitad del ancho de mi pantalla.
    En todo caso, la cabecera debería ser más angosta, aunque se ve bonita así. Yo te sugeriría que no se quede fija.
    Bueno, solo son sugerencias.
    Saludos.

    ResponderEliminar
  110. Gracias fue de gran ayuda!
    En otrs lugares me decian como subir la imagen pero no funcionaba.
    Gracias eh!! ^^

    ResponderEliminar
  111. Gracias Johan tienes razón, aceptada la sugerencia ;-)
    Gracias por tanta atención, un abrazo desde Venezuela

    ResponderEliminar
  112. Muchas gracias, me ha sido muy útil.

    Un saludo

    ResponderEliminar
  113. Acabo de actualizar mi blog con estas instrucciones y aprovechando las nuevas plantillas que ha puesto blogger.
    Te agradezco infinitamente, ya que yo no soy buena en programación ni en lenguaje html, así que has sido de una gran ayuda, me parece increíble que pongas esta información, algunos la considerarían confidencial.

    Un abrazo.

    ResponderEliminar
  114. Oye ya pusieron una forma nueva de modificar el diseño de bloger, y ya no aparece el html como lo pones, se puede poner una imagen de fondo desde url? podrias ponerlo ya con la nueva forma que tiene el bloger de poner diseño?? gracias

    ResponderEliminar
  115. Hola Ricardo Raul
    De igual manera como en la explicación, sino que ahora buscarás en tu body la siguiente línea de código:

    background: $(body.background);

    y la reemplazarás por esta otra:
    background-image:url(http://nombre_de_imagen.jpg);

    Saludos

    ResponderEliminar
  116. Hola tengo un problema coloque todo el código que pusiste para insertar una imagen como fondo en el Blogger/Diseño/Avanzado/Añadir CSS y me marca un error que dice: "no hemos podido completar tu solicitud", me pide que describa lo que estoy haciendo cuando se produce el error y me da el siguiente error: bx-l0noik, me podrìas ayudar, no he podido poner una imagen como fondo, ya tengo imégenes en Albumes web de Picasa.

    ResponderEliminar
  117. Anónimo6/27/2010

    Hola, gracias por la información pero he intentado hacerlo y al pinchar la vista previa me cierra la pagina. No he localizado en la plantilla exactamente el texto que indicas en el mio pone
    body {
    font: $(body.font);
    color: $(body.text.color);
    background: $(body.background);
    ¿me puedes indicar como hacerlo?

    ResponderEliminar
  118. Muchas gracias!!!
    me ha servido de mucha ayuda tu page y pues voy a estar recomendandote.
    Bye

    ResponderEliminar
  119. Muchas gracias! me ha servido mucho para el nuevo editor de plantillas, que la verdad se me queda grande...

    ResponderEliminar
  120. Miguel8/31/2010

    Hola, tengo el mismo problema que el anónimo de un poco más arriba, en mi código html me aparece:

    body {
    font: $(body.font);
    color: $(body.text.color);
    background: $(body.background);

    No sé como hacerlo, lo he intentado aun así y me aparece el fondo blanco.

    ResponderEliminar
  121. Anónimo8/31/2010

    Hola, en mi codigo html sale esto:

    body {
    font: $(body.font);
    color: $(body.text.color);
    background: $(body.background);

    ...asi que no se como hacerlo :(

    ResponderEliminar
  122. Hola, oye volvi, jajaja, oye me podrias ayudar, bueno, ya vez que te dije que tengo nueva configuración en blogger, ya le meti una imagen de fondo, gracias a tí, pero me gustaria que la imagen se vea totalmente, es decir, que en donde publico sea transparente, para que la imagen de fondo se vea claramente, mira este es mi blog, http://ricardo-raul.blogspot.com como puedes ver tiene como una mica obscura, que hace que la imagen de fondo no se vea totalmente, esta mica obscura se puede poner transparente¿?¿? me podrias ayudar si¿?¿? gracias

    ResponderEliminar
  123. Hola, tengo un problema con el fondo, lo hice y me salio algo mal, la parte que esta al comienzo del blog, no sale la imagen, podrias ayudarme.

    http://trey-frikimundo.blogspot.com/

    ResponderEliminar
  124. muyyy feooo no le entiendoo naaaaaaaaaaaaa

    ResponderEliminar
  125. gracias por el POST, ME SALIO MUY BIEN Y SOLOCIONÉ MI PROBLEMA.
    MI PAGINA ES: WWW.GLORIOSOLECHUZO.COM.AR

    ResponderEliminar
  126. Te agradezco por lo de cambiar al color que deseamos agregando background: #FFFFFF;
    en #outer-wrapper

    Me estaba volviendo loco. Lo tuyo funciono Gracias.

    ResponderEliminar
  127. Muchas gracias por este magnífico tutorial para mejorar nuestro blog. Gracias amigo

    ResponderEliminar
  128. Hola Johan! me podrias decir como hago para que el fondo no se repita?

    Muchas Gracias!

    ResponderEliminar
  129. Hola BlackHeart666

    Solo tienes que cambiar esta línea de código:
    background-repeat: repeat-x;
    por esta otra línea:
    background-repeat: no-repeat;
    y listo.
    Saludos.

    ResponderEliminar
  130. muy bueno su tutorial pero si no es mucho pedir quisiera saber si me puede indicar como llego al diseño de un blog edicion HTLM (el blog se encuentra dentro de una página Web) ya que quiero cambiarle la imagen de fondo y ponerle una imagen fija.

    ResponderEliminar
  131. Hola! Soy Lucho nuevamente... Quisiera ser más específico en la pregunta que hice anteriormente...
    Tengo un blog dentro de una pagina web que se dedica a relaciones amistosas y mi blog tiene de fondo un color que yo le puedo dar... Pero he visto que otros usuarios le han puesto una imagen de fondo a su blog que se repite a lo largo y a lo ancho del blog.
    Si entiendo que la imagen que quiero poner debe tener una URL y donde debo colocarlo pero mi probema es... ¿como llego a la plantilla HTLM de mi blog?.... ¡Gracias!

    ResponderEliminar
  132. La última vez que dejé mi comentario fue el 19 de marzo de 2011.. ¡Soy Lucho nuevamente!
    Con respecto a la pregunta que hice te paso ha decir que ya lo estoy solucionando... Se trataba de un "bling" que yo puedo crear o adquirir de otro usuario y ponerlo en un casillero en blanco en mi editor de colores del blog (recuerda que dije que yo le podia dar el color al fondo del blog pero no sabía lo de la imagen).
    Hace poco han puesto Internet en mi casa y desde entonces le estoy dedicando más tiempo para solucionar estos problemas que eran muy difíciles desde una cabina de Internet.
    También he abierto un blog en www.blogger.com a travez de una cuenta de google que yo ya tenía (precisamente para aprender como poner una imagen de fondo para blog) y he querido seguir tus instrucciones pero se me complicó todo... luego como dice "Ricardo_raul" blogger tiene una nueva forma de modificar el diseño de blogger y el diseño HTLM ya no aparece como lo pones...
    "Mi preocupación era como poner una imagen de fondo en mi blog que tengo dentro de una página web que se ocupa de relaciones de amistad"
    ¡De todos modos gracias!

    ResponderEliminar
  133. Saludos amigo:
    Un favor, he seguido tus pasos y todo va bien hasta la primera parte en el que el pattern se repite tanto horizontal como verticlamente, lo segundo no funciona en mi html, probé poner repeat-y y salió repetida pero solo en el lado izquierdo ¿Que puedo hacer para que me salga lo mismo en el lado derecho? Es que quiero poner solo dos columnas alos costados. Te agradecería mucho me resuelvas la duda. Gracias de antemano

    ResponderEliminar
  134. Anónimo5/30/2011

    Hola sigo todos los pasos pero no puedo.... quiero darte la imagen... para ver si tu me puedes ayudar?

    Gracias
    Ana María
    anabala_168@hotmail.com

    ResponderEliminar
  135. Anónimo7/11/2011

    ola,bueno yo no entendi nada asi que podrias explicar todo eso en algo mas simple???,soy nueva en esto y no csho como poner una imagen de fondo en mi blog

    chao saludos

    ResponderEliminar
  136. Te agradezco muchísimo tenia rato buscando este dato mil gracias. =)

    ResponderEliminar
  137. Hola amigo. Estoy creando mi blog y quiero ponerle un fondo personalizado, es decir, una fondo propio, tal como lo explicas. Al parecer blogger ha cambiado algo su programación en html porque ya no encuentro textualmente esa línea de código que posteas, sino que encuentro es la siguiente:

    body {
    font: $(body.font);
    color: $(body.text.color);
    background: $(body.background);
    padding: 0 $(content.shadow.spread) $(content.shadow.spread) $(content.shadow.spread);
    $(body.background.override)
    }


    Intenté cambiando esta parte "body.background" por la parte que dices que le agreguemos en donde está la url de la imágen, pero no logro que cambie absolutamente nada. Estaría agradecido si me ayudaras con este problemilla, pues en realidad quiero ponerle una imagen propia a mi blog.

    ResponderEliminar
  138. Hola Diehko
    Es cierto, la plantilla ha cambiado desde la aparición de las nuevas plantillas. De todas maneras, para cambiar reemplazar todo esto:
    "$(body.background)" (sin las comillas) por la URL de tu imagen de fondo.

    Suerte.

    ResponderEliminar
  139. Necesitaria saber si es posible cambiar el tamaño del fondo interior en una plantilla de bloger actual.
    Y donde encontraria el html que se tiene que modificar, el ancho y el alto.
    Gracias!!!

    ResponderEliminar
  140. Miguel Ángel9/09/2011

    Me interesaría poder cambiar el alto y el ancho del fondo interior en una plantilla actual de bloger.
    Y donde encontraría el código html que hay que modificar.
    Gracias!!!

    ResponderEliminar
  141. Por lo visto a muchos les ocurre el problema de la imagen , pero detecto algo que quizás olvidaste mencionar , cuando subes una imagen en imageshack ( que porcierto es shack no shuck ) la imagen se convierte a un formato png. y no jpg. como nos brindas en el ejemplo , la pregunta es ¿esto influye en la ejecución a colocar como fondo en el blog? , si es así ¿nos podriás brindar alguna solución mas factible?, gracias .

    ResponderEliminar
  142. Hola Bryan!
    Normalmente es preferible subir archivos de imagen en formato .jpg o .gif por lo que son más livianos y cargan de manera más rápida. Si subes una imagen .png y si ésta es muy grande, pues verás que tardará en cargar y si carga ésta carga por partes de manera lenta.
    Una buena opción es usar Flickr para subir tus imágenes de fondo. Es un servicio gratuito y también te brinda una url para que puedas hacer con ella lo que quieras.
    Saludos.

    ResponderEliminar
  143. HOLA AMIGOS DEL MUNDO BLOGGER: LES TENGO UN DATO DE COMO AGREGAR UN MP3 CON LA MUSICA QUE UDS QUIERAN YA SEA VIDEO O LIRIKS, EN ESTE CASO LAS CANSIONES QUE SUBEN ATRAVEZ DE ESTE REPRODUCTOR SON DE YOU TOBE.
    PARA ELLO DEBEN HACER O CREAR UNA CUENTA A ESTE ENLACE:
    http://www.mixpod.com/playlist/88783633 O ESCRIBAN MIXPOD EN EL BUSCADOR AHY TE SALE CREAR CUENTA,YA TENIENDO LA CUENTA UDS AGREGAN LA MUSICA QUE QUIERAN, ESCRIBE EL ARTISTA O LA CANSION Y EL TE SALE ALLI,LUEGO DE TENER YA EL LISTADO COPIAN EL CODIGO HTML Y LO PEGAN EN LA PARTE DE SUS BLOGGER Y LISTO AHY TIENEN SU REPRODUCTOR MP3 PARA SU PAGINA.ASI PODRAN TU Y TUS AMIGOS SEGUIDORES ESCUCHAR MUSICA. Y AGRAGAR UN CHAT SI ASI LO DECEAN. MUCHA SUERTES Y ESTE FUE UN APORTE PARA LOS AMIGOS BLOGGEROS. YO APENAS ESTOY EMPEZANDO O CREANDO MI BLOGGER SI QUIEREN PEGUENLE UNA CHECAITA NO ES MUCHO PERO SERIA UNA IDEA PARA SUS FUTUROS DISEÑOS. ESTE ES MI DIRECCION EN EL BLOGGE SI LO QUIEREN VER A LO QUE ME REFIERO CON LO DEL MP3 http://wanmusik.blogspot.com/

    ResponderEliminar

Related Posts with Thumbnails