Bueno, soy yo de nuevo, en este caso les enseñare como colocar una imagen de fondo en nuestro blog de la manera mas simple y directa….

Lo bueno de esto es que a veces hemos encontrado imagenes muy buenas y que queremos usarlas pero no sabemos donde! Nunca te pasó? Esta es tu oportunidad ya que si tienes un blog personal, o si es de la temática de tu blog, la colocas como imagen de fondo y listo, quedará muy bien.

Muchos usuarios de blogger dejan pasar por alto colocar una imagen de fondo en el blog, sin darse cuenta que es un recurso que nos ayuda bastante a la hora de querer tener el mejor diseño para nuestros visitantes, en esta entrada les mostrare como hacerlo de una manera simple, como ya les mencione; vayamos al truco.

PRIMER PASO:
 BUSCA UNA FOTO QUE TE GUSTE Y QUE MIDA MAS DE 1024 X 728, QUE TENGA BUENA RESOLUCIÓN Y QUE TENGA MAS DE 500 KB, ESTO ES SI LO USAS COMO FONDO DE PANTALLA DE TU PC PUEDE SERVIR PARA TU BLOGGER.
SEGUNDO:
 LA TIENES QUE SUBIR A UN HOSTING, EN ESTE CASO UTILIZAREMOS  IMAGESHACK
,
-AHORA SUBES TU IMAGEN  CON LA OPCIÓN DE MONITOR DE 19 PULGADAS QUE ES LA MAS COMÚN.
-CUANDO TERMINE COPIAS EL LINK QUE ESTA DONDE DICE ENLACE DIRECTO 
 (En ocasiones es necesario registrarse)
-AHORA VAS AL BLOG Y ENTRAS EN LA PESTAÑA DISEÑO LUEGO AÑADE UN GADGET HTML/JAVASCRIP:
LUEGO INSERTAS ESTE CÓDIGO HTML:
 
<style type="text/css">body {background-image: url("TU LINK DE IMAGESHACK VA AQUI"); background-position: center; background-repeat: no-repeat; background-attachment: fixed; }</style><div id="tag" style="position:absolute; left:0px; top:30px; "></div>
PONES TU DIRECCIÓN DE IMAGESHACK ENTRE LAS COMILLAS, LO GUARDAS Y LISTO YA TENEMOS NUESTRA IMAGEN DE FONDO EN NUESTRO BLOG.
Nota:  En este tutorial utilize el hosting  IMAGESHACK por mi preferencia, puedes usar el hosting que desees a tu gusto..
Saludos!!!

38 comentarios

Alberto Franco · abril 1, 2013 a las 11:05 am

Muy buen tutorial Miguel de verdad andaba buscando algo como esto.

Un saludo 😉

tribunaram · abril 3, 2013 a las 9:08 pm

pues a mi no me funciona

paco gaona · abril 26, 2013 a las 12:44 am

no me funciono me ayudan porfa?

    Hayder Juvinao · abril 26, 2013 a las 3:33 pm

    La entrada no es mía, pero dime en que blog no te funciona el truco

jose antonio garcia · abril 30, 2013 a las 11:02 pm

a mi me funciono a la primera, pero esta noche al vovler a casa desaparecio como otras cosas que habia puesto..y no hay manera de ponerlo otra vez

Raúl Peribáñez · mayo 8, 2013 a las 10:54 am

Una pregunta: ¿se puede hacer que esa imagen de fondo incluya un link?

Ya sabes, para usar la imagen como recurso publicitario.

    Hayder Juvinao · mayo 11, 2013 a las 7:19 pm

    Pues el truco se maneja es con atributos CSS por lo que no se puede añadir imágenes, al menos habría que añadirle algo de HTML para agregarle el link 🙂

Ana Ivana · junio 26, 2013 a las 9:01 am

hola, que tal?? a mi no me funciona 🙁
soy un queso para esto!!

Jorge MG · agosto 9, 2013 a las 3:52 pm

Una duda: ¿por qué añades un div al final del código?

trickor treat · agosto 10, 2013 a las 7:34 am

dejes sus comentarios negativos que si da ami me funciono y esta clara la explicacion gracias y saludos

macorisa · agosto 26, 2013 a las 1:03 pm

Genial, ahora solo me falta conseguir una buena imagen para poner de fondo 🙂

¡Gracias!

Naruto Shippuden Latinoamerica · septiembre 13, 2013 a las 8:01 pm

:F que bn lo provare a ver con mi Blog espero que me funcione he estado buscando esto desde hace tiempisimo vere a ver 😀

Itzel Avila · septiembre 30, 2013 a las 4:53 am

Ami si me funciona me coloca el fodo pero es un fondo estico solo aparece sobre todo el blog necesito ayuda mi blog dice que no puedo colocar fondo y esta seria la unica manera aparte de editar el htlm pero no ce que hace necesito poner un fondo

Patry_hennet · octubre 1, 2013 a las 11:48 am

Necesito ayuda, no me funciona

Patry_hennet · octubre 1, 2013 a las 11:52 am

Ya me fue, era el cógido del fondo en imageshak que no iba, lo hice por tinypic y ya va!!

jhordy fonseca · febrero 6, 2014 a las 6:57 pm

exelente me ayudo muxo :-d

Gabriel Fernando Moyano Arias · febrero 11, 2014 a las 5:25 pm

Muchas gracias !!

Cami Salvaje Tutos · marzo 28, 2014 a las 8:25 pm

Lol, todos se complican haciendo eso cuando simplemente pueden ir a plantilla>personalizar>fondo y eligen el que quieran xdd ese proceso es para principiantes

    Jota · marzo 29, 2014 a las 1:50 pm

    La forma más correcta sería ir a Plantilla-Editar HTML y añadir este código antes de </b:skin>:

    body {
    background-image: url(«
    URL de la imagen«) !important
    }

Dj Maxo · abril 16, 2014 a las 8:31 pm

(y) pero ami no me sale toda la pantalla

Marlon Santos · junio 21, 2014 a las 7:43 pm

Hola como hago para colocarle una imagen a esta plantilla que tu tienes porque no aplica

Miranda · junio 30, 2014 a las 3:28 pm

OOh dios mio muchísimas gracias llevaba tiempo buscando una solución que me diera resultado y por fin di con ella 😀
Hace tiempo que blogguer no me sube bien los fondos, lo hacía desde plantilla y me subía la imagen más oscura y no era capaz de solucionarlo pero ahora está perfecta :]
Un saludo <3

Angel Chacin · julio 19, 2014 a las 1:48 pm

que buen blog tienes, gracias por compartir tu blog me guié por ti una vez un saludo….http://ganamuchodinerohoyy.blogspot.com/

Ame · septiembre 5, 2014 a las 8:15 pm

Gracias

Bryan Gonzalez · septiembre 21, 2014 a las 6:55 pm

Gracias me funciono, ya que la otra opcion de cambiar el fondo no me funciona.

Gracias.

Music Manía · noviembre 18, 2014 a las 2:34 am

no se que pasa en html no me aparece opcion de cambiar el fondo y con esto tampoco como lo cambio ayudaaa

Lión Pineda · diciembre 18, 2014 a las 10:29 pm

gracias men!!…estaba ya cansado de que me dieran codigos erroneos…fue poner el tuyo y genial!!!

Anonymous · diciembre 20, 2014 a las 2:29 am

Pues si que me ha funcionado! y super simple! GRACIAS, copié directo el link de la misma foto y asi largo como estaba lo pegué entre los paréntesis. Funciona!

Responder a Alberto Franco Cancelar la respuesta

Marcador de posición del avatar

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *