
Una constante pregunta es cómo hacer para que la imagen de fondo del blog siempre ocupe toda la pantalla sin importar la resolución del monitor. Y es que a veces ponemos una imagen de fondo según las medidas de nuestro monitor, y no consideramos que en la actualidad los monitores los hay de todas las resoluciones, muy pequeños y muy grandes. Así que si ponemos una imagen de acuerdo a nuestra pantalla habrá alguien con un monitor mayor que seguramente no verá toda la imagen o la verá repetida, y en el caso de los que usan monitores muy pequeños verán la imagen incompleta.
Aquí veremos dos soluciones a ello, una usando CSS3, y otra con jQuery. Con cualquiera de las dos haremos que la imagen de fondo de la página ocupe toda la pantalla del monitor sin importar la resolución del mismo.
CSS3
La primera opción es usando CSS3, la ventaja con este método es que no sobrecargamos el blog con scripts, usaremos únicamente la propiedad background-size que se encargará de realizar lo que queremos.
La desventaja es que esta propiedad sólo es soportada por los navegadores modernos, así que en el caso de Internet Explorer sólo se verá de la versión 9 en adelante, en los demás navegadores no deberá haber problema.
El método es muy simple, sólo tenemos que ingresar a la Edición HTML de la plantilla, localizar el background que está dentro de body { y reemplazarlo por esto:
background: url(URL de la imagen) no-repeat center center fixed;
background-size: cover;
Se vería más o menos así:
body {
background: url(URL de la imagen) no-repeat center center fixed;
background-size: cover;
margin:0;
color:#000;
font:x-small Georgia Serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: center;
}
Sólo pon la URL de la imagen y listo.
jQuery
Con este método usaremos jQuery con el plugin BackStretch, la ventaja es que funciona en todos los navegadores, incluyendo IE7 en adelante. La desventaja no es mayor si ya usas jQuery, ya que el plugin en realidad es pequeño. Para usar este método en tu blog entra en la Edición HTML y antes de </head> pega este script:
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
/*
* jQuery Backstretch
* Version 1.2.8
* http://srobbin.com/jquery-plugins/jquery-backstretch/
* Add a dynamically-resized background image to the page
* Copyright (c) 2012 Scott Robbin (srobbin.com)
* Licensed under the MIT license
* https://raw.github.com/srobbin/jquery-backstretch/master/LICENSE.txt
*/
;(function(a){a.backstretch=function(p,b,l){function s(){if(p){var b;0==c.length?c=a("<div />").attr("id","backstretch").css({left:0,top:0,position:m?"fixed":"absolute",overflow:"hidden",zIndex:-999999,margin:0,padding:0,height:"100%",width:"100%"}):c.find("img").addClass("deleteable");b=a("<img />").css({position:"absolute",display:"none",margin:0,padding:0,border:"none",zIndex:-999999,maxWidth:"none"}).bind("load",function(d){var b=a(this),e;b.css({width:"auto",height:"auto"});e=this.width||a(d.target).width();d=this.height||a(d.target).height();n=e/d;q();b.fadeIn(g.speed,function(){c.find(".deleteable").remove();"function"==typeof l&&l()})}).appendTo(c);0==a("body #backstretch").length&&(0===a(window).scrollTop()&&window.scrollTo(0,0),a("body").append(c));c.data("settings",g);b.attr("src",p);a(window).unbind("resize.backstretch").bind("resize.backstretch",function(){"onorientationchange"in window&&window.pageYOffset===0&&window.scrollTo(0,1);q()})}}function q(){try{j={left:0,top:0},rootWidth=h=o.width(),rootHeight=r?window.innerHeight:o.height(),f=h/n,f>=rootHeight?(k=(f-rootHeight)/2,g.centeredY&&(j.top="-"+k+"px")):(f=rootHeight,h=f*n,k=(h-rootWidth)/2,g.centeredX&&(j.left="-"+k+"px")),c.css({width:rootWidth,height:rootHeight}).find("img:not(.deleteable)").css({width:h,height:f}).css(j)}catch(a){}}var t={centeredX:!0,centeredY:!0,speed:0},c=a("#backstretch"),g=c.data("settings")||t;c.data("settings");var o,m,r,n,h,f,k,j;b&&"object"==typeof b&&a.extend(g,b);b&&"function"==typeof b&&(l=b);a(document).ready(function(){var b=window,d=navigator.userAgent,c=navigator.platform,e=d.match(/AppleWebKit\/([0-9]+)/),e=!!e&&e[1],f=d.match(/Fennec\/([0-9]+)/),f=!!f&&f[1],g=d.match(/Opera Mobi\/([0-9]+)/),h=!!g&&g[1],i=d.match(/MSIE ([0-9]+)/),i=!!i&&i[1];o=(m=!((-1<c.indexOf("iPhone")||-1<c.indexOf("iPad")||-1<c.indexOf("iPod"))&&e&&534>e||b.operamini&&"[object OperaMini]"==={}.toString.call(b.operamini)||g&&7458>h||-1<d.indexOf("Android")&&e&&533>e||f&&6>f||"palmGetResource"in window&&e&&534>e||-1<d.indexOf("MeeGo")&&-1<d.indexOf("NokiaBrowser/8.5.0")||i&&6>=i))?a(window):a(document);r=m&&window.innerHeight;s()});return this}})(jQuery);
//]]>
</script>
<script>
$.backstretch("URL de la imagen");
</script>
Pon la URL de la imagen donde se indica y listo.
Con este método la carga de la imagen del fondo se hace hasta el final, esto es para que el usuario no tenga que estar esperando a que cargue la imagen para que empiece cargar el blog, así que si en el body { ya utilizas una imagen de fondo se verá primero e instantes después se cargará la del script, por lo que si lo deseas puedes eliminar la imagen que tengas en el body y así dejar que sólo cargue la imagen del script.
Como puedes ver ambos sistemas son fáciles de aplicar, cada uno con sus pros y contras, pero el resultado es el mismo, extender la imagen de fondo para que se ajuste a la pantalla de cualquier monitor sin importar la resolución del mismo.
Recuerda que en el caso del método con jQuery, deberás verificar que no uses Scriptaculous o Mootools, de ser así tendrás que aplicar unos cambios en el script para hacerlos compatibles.
Y si ya usas jQuery recuerda tener sólo una versión, la última.
Recuerda que en el caso del método con jQuery, deberás verificar que no uses Scriptaculous o Mootools, de ser así tendrás que aplicar unos cambios en el script para hacerlos compatibles.
Y si ya usas jQuery recuerda tener sólo una versión, la última.
Sos un genio El Potro, Me encantan todos tus post y sos el mejor de todas las paginas que expliquen tuturiales para tu blog. Suerte y seguí así que me encanta todo lo que haces y publicas! ;)
ResponderEliminarMuy amable Agustin :)
EliminarGrande Potro sos lo maximo
EliminarMuy buena entrada Potro. Ya me estaba haciendo esa pregunta. Saludos
ResponderEliminarSos el mejor! justo lo que quería =D
ResponderEliminarMuchas gracias amigo potro
ResponderEliminarGracias a todos, ¡buen fin de semana!
ResponderEliminarHola
ResponderEliminaruna consulta ¿la imagen quedara estatica en el fondo? es decir, si bajamos por la pagina se "moverá" el contenido y no la imagen?
Hace algún tiempo, intente colocar una imagen de fondo pero se repetía, mientras bajaba en la pagina o sólo cubría un % de la parte alta y mientras bajaba la parte inferior quedaba con el color de fondo
gracias por tu aporte :D
Hola zux, la imagen quedará fija ya que está se redimensiona y se debe mantener así.
EliminarSaludos.
Hello! tejano de California, tengo un problema que no se si lo es, cuando pongo un fondo, o cambio el fondo de color, al abrir el blog siempre aparece el color del fondo unos segundos hasta que aparece el cuerpo del blog ¿eso es normal o solo me ocurre a mi?
ResponderEliminarLo pregunto porque tengo 4 blogs y todos con plantillas distintas y pasa en los 4.
Gracias y Saludos desde el viejo continente.
Hola unhidalgo, puede ser normal dependiendo de si tu fondo es una imagen, y/o de la carga del blog. Usualmente lo primero que carga son los estilos del body (a menos que antes tengas algún script u otros estilos), así que primero carga el color de fondo y después lo demás, y si el blog anda lento entonces será normal que en un pestañeo se muestre sólo eso y luego se cargue el resto.
Eliminar¡Saludos!
Qué bueno Potro!!!
ResponderEliminar¿Serviría también para la imagen de fondo en la intro del blog???
Saludos!!
Con la opción de CSS3 sí, también debe funcionar ;)
EliminarGracias!!!
EliminarGracias por el aporte amigo mío. Ya le daré utilidad ;)
ResponderEliminarUn abrazo.-
Muy bueno! Te pregunte esto hace unos dias en otra entrada pero me digiste que no lo sabias ¬¬ Seguro q no me entendiste=)))
ResponderEliminarOye Potro una pregunta, sabes como poner un Baner(Gadget) en la cabecera ?, como en esta pagina-web: css-pro.ru
Gracias.
Se me olbido una cosa=) cual es el codigo para insertar una imagen en un Javascript sin que me redireccione a otro sitio sino que solo sea una imagen y ya eata_??? este codigo: http://prntscr.com/e2d94 , sirve para cuando pulses en la imagen te salga otra pagina... pero yo lo que quiero es insertar una imagen y ya sta... Como lo hago? Gracias=)
ResponderEliminarSe que soy pesao, pero necesito mucho esto=) como poner un gadget tipo un cuadro donde pueda poner mi texto?... ej: http://prntscr.com/e2fhy
ResponderEliminarHola admin, si quieres que no tenga enlace quítale las etiquetas de los lados.
EliminarPara lo demás mira estas entradas:
http://ciudadblogger.com/2010/08/dividir-la-cabecera-del-blog.html
http://ciudadblogger.com/2010/06/gadget-para-que-nos-enlacen.html
Gracias_)
EliminarHola , potro le coloque un boton a mi blog que dice NO HAGAS CLICK AQUI haces click sobre el y te lleva a la pagina que yo quiero pero no te la abre en una nueva pestaña lo que quisiera hacer yo es que te lleve a una nueva pestaña ! este es mi blog
ResponderEliminarhttp://megustaelterror.blogspot.com/
Otra duda :S Mira , yo quiero ponerle una radio como la de esta pagina http://disneyatodoritmo.blogspot.com.ar/ pero no se como tengo una lista de IPS de radios pero no se como poner la radio si me respondieras te lo agradeceria muchisimo.
ResponderEliminarLa de la radio ya la solucione pero ahora cambio tengo muchas preguntas :S Espero que no te moleste , vi en internet como poner otra columna pero pruebe lo que pruebe no puedo vos tenes algun link que sea mas especifico ya que no me andan los otros no entiendo :S a este blog le quisiera agregar una columna izquierda : http://megustaelterror.blogspot.com.ar/
ResponderEliminarHola Naza Ocantos. Mira esta entrada para que veas cómo hacer que un enlace se abra en otra pestaña:
Eliminarhttp://ciudadblogger.com/2009/01/abrir-links-en-una-ventana-nueva.html
Lo de la sidebar hay varios en la red, si no te funciona alguno deja un comentario en la entrada de ese blog, seguro sabrán decirte qué sucede.
Saludos.
Muchas gracias ;D
EliminarEste comentario ha sido eliminado por un administrador del blog.
ResponderEliminarComo pongo un gadget alado de la cabezera?
ResponderEliminarHola Agustin, mira esta entrada, ahí verás cómo poder poner un gadget al lado de la cabecera:
Eliminarhttp://ciudadblogger.com/2010/08/dividir-la-cabecera-del-blog.html
hola potro felicitaciones por tu blog tengo una pregunta este truco para el fondo del blog funciona o hay manera de hacerlo con el truco de fondo al azar que publicaste anteriormente
ResponderEliminargracias y saludos desde colombia
Sí Ale, pero sólo con la opción de CSS3, tendrías que agregar en ese código, justo después de background-attachment:fixed;
EliminarEsto:
background-size: cover; background-repeat:no-repeat; background-position:center center;
gracias potro sos un maestro en esto de codecs funciona pero le puse repeat por que en explorer (como cosa rara) al alejarlo (ctrl+-)no capta mira http://musiconferencias.blogspot.com/
Eliminargracias
Recuerda que esta propiedad sólo es reconocida en IE9 en adelante, las versiones anteriores no.
EliminarPotro, muy buena la entrada.
ResponderEliminarAhora, ¿Pero pueden colocarse algunas líneas de código para que aparezcan al abrirlos o eso no tiene solución?
Saludos.
¿Para que sea lo primero que cargue? No sé si sea posible, pero no serviría de mucho porque primero se carga el CSS y luego el script así que no habría quizá ninguna diferencia.
EliminarEntonces a dejar el fondo blanco como es casi todo el blog y apenas se notará la carga del blog.
EliminarGracias por todo.
Hola Potro. Mañana mi madre me va a poner publicidad AdSense en el blog pero tengo un par de preguntas:
ResponderEliminar1- En mi cuenta de Blogger no soy mayor de edad (tengo 15 años), pero en la cuenta de AdSense, al registrarme, ¿serviría poner el nombre completo de mi madre para que no haya problemas con la edad?
2- Estoy también preocupado por si alguien hace muchos clics un día. ¿Hay mucho riesgo de que me quiten la publicidad? ¿A ti te ha pasado alguna vez eso y has podido poner nuevamente la publicidad o no te dan acceso a ponerla de nuevo?
Si ella será la titular de la cuenta entonces todos los datos deben ser de ella.
EliminarSi alguien hace muchos clicks podrían invalidar esos clicks y ya, no pasa nada, en otros casos podrían suspender la cuenta.
Hola!
ResponderEliminarEsta solución es fantástica pero tengo una duda. En mi blog Winx Club All siempre pongo los fondos con personajes de la serie y me preguntaba si la imagen del fondo al ponerse del tamaño de la pantalla de otra persona se podrían ver los personajes deformados (ensanchados o alargados).
Gracias!
Se redimensiona proporcionalmente. Haz la prueba en otro blog, luego cambia el tamaño de la ventana del navegador y verás cómo se comporta la imagen de fondo.
EliminarHola Potro, ya sé que esta no es la entrada, pero es que no encuentro en el buscador. Quería ver una entrada que escribiste sobre la organización de los códigos de la plantilla. Me refiero a cómo escribir texto explicativo entre códigos sin que afecten a la plantilla y así saber qué es cada cosa.
ResponderEliminarGracias y perdona!!!
Me parece que es esta la entrada que buscas:
Eliminarhttp://ciudadblogger.com/2011/07/errores-comunes-al-poner-los-codigos.html
Puede ser Potro, ¿no había otra???
EliminarGracias!!!!
No que yo recuerde. Pero ahí se menciona la cuestión de los comentarios en los códigos.
Eliminargracias ;)
EliminarMuy buena entrada, Potro.
ResponderEliminarUna pregunta: ¿Crees que funcione igual si utilizo la propiedad background-size: 100% 100%?
Es que aprecio una delgada línea blanca en el margen izquierdo, pero si sustituyo la propiedad background-size:cover por la que mencioné, ese detalle desaparece.
Entonces, me gustaría saber si de igual forma seguirá mostrándose la imagen de fondo en todas las pantallas, sin importar la resolución del monitor.
Graciasy saludos. :D
No es igual aunque también puede cubrir la pantalla, la diferencia es que con el porcentaje estableces que tenga ese ancho y ese alto. Con el cover le indicas que se redimensione proporcionalmente hasta que se cubra toda la pantalla.
EliminarY0 habia puesto
ResponderEliminarbackground: #eee [url(#) repeat-x fixed top center];
y también funciona.
Son dos cosas diferentes. Lo que esta entrada trata de resolver es cómo hacer que una imagen pueda verse a lo ancho y alto del blog sin perder su dimensión. El repeat-x, repeat-y, o simplemente repeat lo que hacen es repetir la imagen, y no es el resultado que siempre estamos buscando.
EliminarYa imagino, no obstante, personalmente, nunca podré hacer uso de lo que tan bien explicas en esta entrada.
Eliminary todo porque uno de los blogs está supercargado. Mas de 10.300 entradas tiene.
ResponderEliminarBuenos días potro, Por favor has un Post - Tutorial para enseñar a colocar paginación en blogger!! Estaría muy bueno poder paginar nuestro blog y quitar eso de "pagina principal" y "Entrada antigua". Se verían mucho mas profesionales.
ResponderEliminarAquí te dejo un Link de un tutorial de paginacion, que en lo personal no entiendo nada, por que no lo explican muy bien.
http://emiliocoboscmc.blogspot.com/2012/04/paginacion-para-blogger-mas-ligera.html
Por favor Potro has un tutorial para Paginacion en Blogger!! bye. ;)
Lo tomaré en cuenta SD92 aunque de publicar algún sistema de paginación no sería ahora. De cualquier forma si tienes una duda con ese tutorial puedes preguntarle tus dudas a Emilio, estoy seguro que te responderá con mucho gusto :)
EliminarSaludos!
No puedes manipular el contenido dentro del iframe. El iframe lo que hace es mostrar un sitio externo en otro, pero no puedes editar o manipular nada de ese sitio externo a menos que tú seas el dueño del mismo.
ResponderEliminarHola, Potro. Tengo un problema con mi blog (BlogDesign), al ingresar a las entradas no aparece en cuerpo del post. Ya me fijé por toda la plantilla pero no encuentro ningun error que pudo haber provocado esto. Espero que me puedas ayudar, Saludos.
ResponderEliminarHola Lucas, posiblemente esté faltando un código como <data:post.body/>
EliminarSi puedes revisa la plantilla original y mira esa área (donde está ese código) y verifica que no te falte algo más. Seguramente en algún cambio algo eliminaste o usaste una condicional que no era la adecuada.
Saludos.
Hola Potro como estas?. Bien pues, mi duda esta fuera de este Post... Queria hacerte una pequeña consulta. En mi blog, en la parte inferior, hay un texto que dice "cargando", nose porque razon o circustancia esta allì, si yo no puse nada, ningun gadget ni nada por el estilo... Ya busque en la plantilla y no hay nada, no entiendo porque aparece. En fin, me podrias ayudar?... Este es mi blog. http://www.ViciosaCity.blogspot.com.ar
ResponderEliminar¿Ya has probado verlo desde otro navegador? Porque a mí no me aparece nada, quizá sea una extensión que uses en tu navegador.
EliminarBuenos dias y perdon por escribir aqui esta pregunta pero....: Shadowbox ha dejado de funcionar. sabes algo?
ResponderEliminarsaludos y gracias
Funciona igual que siempre Priamo. Cualquier duda sobre ese tema déjalo en la entrada de Shadowbox para no desviarnos del tema de este post ;)
EliminarSaludos.
Este comentario ha sido eliminado por un administrador del blog.
ResponderEliminarHola Potro!
ResponderEliminarMuy buen tutorial!!!
Gracias.
Te queria preguntar, sabes de que trata esta pagina, se llama asi, punto com, es que me invitaron y quiero saber bien primero de que trata?
Aqui el nombre de la pagina:
flattr
gracias.
No tengo idea, es la primera vez que sé de la existencia de ese sitio o.O
EliminarUna cosita mas, cuando dices tener solo una version de jQuery, significa que?
ResponderEliminar........
dejo la que tengo y elimino la linea jQuery de este scrit
o
se la dejo a este scrit y elimino la que tenia puesta?
o como, explicame porfis me confundi un poco ahi, jejeje.
y cual de las dos me recomiendas en lo personal tu?
y otra cosa:
Debo borrar el fondo de body{
y dejar solo el del scrit?
Yo utiliso la plantilla de creador de blogger, la que se modifica y se sube el fondo por el editor, comprendes?
entonces, que hago en este caso.?
Gracias
Borrar el fondo de body{ es opcional, eso dependerá de ti, pero no es necesario.
EliminarLo otro es dejar sólo una, ¿cuál? la más reciente, como se indica en esa entrada :)
Buen día.
Buenos días Potro esta pregunta no corresponde al tema pero no encontre en donde publicarla.
ResponderEliminarEn mi blog teleszona61.blogspot.com no puedo mostrar mas de 9 entradas, ya modifique en Configuracion Entradas y en Entradas le puse 20, 10, 15 etc y solo me muestra como maximo 9 entradas... agradezco tu ayuda al respecto.
Gracias de antemano.
Hola Abraham, mira esta entrada, ahí se explica por qué sucede:
Eliminarhttp://ciudadblogger.com/2011/06/cuando-en-el-blog-aparecen-menos.html
Oh! rayos es lo que me temía, ya la había leído... pero ¿en verdad no hay nada que hacer? quiero aunque sea 10 publicaciones...
EliminarNi modos, muchas gracias nuevamente y seguimos aqui a la expectativa!
Saludos
Pues nada más que elimines algunos gadgets, o que uses el Leer más nativo de Blogger, con ese es seguro que te aparecen más entradas.
EliminarTienes razón ya aparecen mas, Potro Dios te bendiga! En verdad que tu sitio nos es de mucha ayuda!
EliminarGra-cias Potrooo!!
Por nada :)
EliminarHola Potro, pido disculpas shadowbox funciona perfectamente.
ResponderEliminarsaludos
Potro te deje un mensaje y no se publico, no entiendo porque :\ . Solamente te decia que debajo de mi blog, en la parte izquierda hay una palabra que dice "Cargando"... pero no tengo ningun gadget ni nada por el estilo, ya revise la plantilla y no hay nada... No entiendo porque esta eso allì. Quisiera que me ayudaras a quitarlo porfavor, te agradeceria mucho. (Obviamente que haciendo click en mi Nombre podras entrar al Blog).
ResponderEliminarLo que pasa es que desde hace algunos meses los comentarios se moderan, por eso no los ves inmediatamente ;)
EliminarYa te he respondido más arriba.
Saludos.
Este comentario ha sido eliminado por un administrador del blog.
ResponderEliminarHola Afm, hace días te respondí esa pregunta en la entrada sobre los comentarios anidados.
EliminarSaludos.
Potro una cosa fuera de esto!...
ResponderEliminarHay alguna forma de que mi blog http://www.muyrojo.com.ar/ tenga como url esto http://www.muyrojo.com.ar/independiente/ pero siempre ( al entrar al blog en las entradas,etc?
No Gonzalo, no podemos configurar las URLs de esa manera.
EliminarHola masterweb8000, mira la entrada de la caja de comentarios de Facebook, ahí dice dónde deben ponerse los códigos cuando se tienen los comentarios anidados.
ResponderEliminarCualquier duda sobre ese tema déjala allá.
Saludos.
Gracias por tu respuesta Potro, sera eso..
ResponderEliminarPotro necesito tu ayuda y es que no me funciona el sistema de moderacion no se porque le pongo que Si y el correo pero al poner un comentario nada... lo publica sin poner esperando aprobacion.
ResponderEliminarNecesito ayuda, Un saludo.
Hola Afm, los comentarios tuyos no se moderan si tú eres el autor, sólo se moderan los comentarios de los demás.
Eliminarsois los mejores,gracias.
ResponderEliminarEste comentario ha sido eliminado por un administrador del blog.
ResponderEliminarHola Cirprian, deja la pregunta en esa entrada que es ahí donde corresponde el tema.
EliminarSaludos.
Pd. Eliminé el comentario por el aviso que está al final.
Potro tengo una pregunta..
ResponderEliminarYo uso Dropbox para alojar varios scripts pero me he encontrado con blogs que usan mucho ese sistema y luego de un tiempo los scripts se caen quisiera que me recomendaras algun sitio para alojar scripts.. que sea diferente a Google Sites o Dropbox
Google Sites es bueno, el problema es que si alguien usa un dominio propio no podrá usar esos archivos. Quizá convenga que los alojes en Google Code, no es precisamente el propósito de ese servicio pero muchos suben ahí sus scripts.
EliminarPotro yo uso un dominio .info y Google Code si sirve en blogs con dominio propio?
EliminarCon Google Code no debería haber problema (o no recuerdo si lo hay), pero haz la prueba, este script está alojado ahí, mira si te funciona en tu blog:
Eliminarhttp://ciudadblogger.com/2009/06/reloj-de-cuenta-regresiva.html
Otra cosilla, hay alguna forma de sincronizar disquis con el numero de comentarios que se muestra al costade de mi blog...
ResponderEliminarAca un blog lo hizo no se como ..http://www.soydiablo.com.ar/2012/08/concentrados-con-regreso.htm
El mios es muyrojo.com.ar
Sólo usé Disqus una vez y fue hace mucho tiempo. Pero hace poco leí que un usuario decía que ahí en Disqus tenían la opción, o al menos eso entendí. Quizá en algún blog donde hablen sobre ese gestor de comentarios puedan decirte mejor.
EliminarEste comentario ha sido eliminado por un administrador del blog.
ResponderEliminarEste comentario ha sido eliminado por un administrador del blog.
ResponderEliminarHola FLV, podrías hacer eso usando un tooltip, mira si alguno de estos te permite hacerlo con una imagen:
Eliminarhttp://ciudadblogger.com/2010/07/tooltips-con-css.html
http://ciudadblogger.com/2010/08/tooltips-con-jquery.html
Pd. Eliminé el comentario por el aviso que está al final de la página.
Saludos.
Hola potro:
ResponderEliminarPues yo tengo el jquery a la versión 1.7.1 lo cambio a la version 1.7.2?
Preferentemente sí, es la más reciente.
Eliminar¡Hola! He descubierto tu blog hoy y... ¡me encanta! La verdad es que es muy útil para amateurs como yo, jeje.
ResponderEliminarUna cosita: ¿hay alguna entrada donde expliques algo más del jQuery? Es la primera vez que lo escucho y antes de llevar a cabo este tutorial quiero saber un poco. ¿Es un programa, aplicación, solo un script invisible para habilitar la escritura...?
Espero me respondas, ¡muchas gracias!
Hola Mae Taras, ¡bienvenida a Ciudad Blogger!
EliminarjQuery es una librería de scripts que permite conseguir ciertos efectos, ¿cuáles? son muchísimos, el de esta entrada es uno de ellos pero hay casi para todo, para crear efectos deslizantes, de desvanecimiento, crear galerías, etc. Son muchas cosas las que se pueden hacer con jQuery, pero si apenas estás comenzando no te preocupes mucho por este tema aun, ya con el tiempo se podrán ir presentando dudas o problemas y ahí aprenderemos más sobre ello :)
¡Saludos!
Hola Potro. Ya tengo solicitada mi cuenta para adsense (solo que desde otro correo gmail que es también administrador de mi blog). He enlazado el correo que tenía la cuenta de Adsense (aún sin aprobar) a mi blog, y creo que ya está todo correctamente y solo he de esperar a que me validen la inscripción.
ResponderEliminarEsta es la imagen que me aparece: http://dl.dropbox.com/u/55341396/adsense.png ¿Está correctamente o he metido la pata?
No parece haber nada mal, ahora sólo a esperar :)
EliminarSuerte!
Potro, finalmente he hecho todo bien, pero me han enviado un correo diciendo que no tengo contenido suficiente. Sin embargo, tengo 227 noticias y el blog lleva un año online. ¿Qué me recomiendas que haga? Porque no tengo ni idea de por qué hay poco contenido. Es en mi blog llamado "Campamento Web", intenta mirarlo para ver si se te ocurre alguna solución...
EliminarGracias de antemano ;)
Tal vez no es por el número de entradas sino por la longitud de cada una, he revisado algunas de las que están en la portada y sí las veo muy cortas de contenido. Sería bueno que las siguientes las hagas un poco más largas, así más adelante podrías solicitar de nuevo la inscripción al programa de AdSense.
EliminarSaludos.
Hola Potro, Saludos
ResponderEliminarQuisiera saber como le hago para bulicar una foto sin que tenga el efecto de Leer Mas... Es decir que si deseo publicar una foto apareza del tamaño real en la página que yo quiera. Gracias
Hola Opinion Diversa, tendrías que utilizar el Leer más nativo de Blogger, el problema es que no es automático, tú eliges en cuáles entradas ponerlo y dónde quieres que haga el corte del resumen. La ventaja es que te pondría la imagen en su tamaño real como deseas.
EliminarHola potro:
ResponderEliminarQuiero poner un Gadget en la que haya un contador como se puede hacer¿?
¿Un contador de qué, de visitas? Mira la categoría "Contadores".
EliminarHola Potro.
ResponderEliminaresto era exactamente lo que necesitaba, pero tengo un gran problema, ojala puedas ayudarme, voy a estar eternamente agradecida.
en mi blog (el arte de ser mujer) hice esto de que el fondo cubra toda la pantalla, pero no se veia completa la imagen, es decir, si cubria toda la pantalla, pero no se veia la decoracion de la parte de abajo, y no se por que se me ocurrio cambiar la plantilla, solo por experimentar, pero hice un respaldo antes. y como en ninguna me mostraban las lineas divisorias en los gadgets, volvi a poner la plantilla antigua, pero ahora le pongo fondo con esta opcion de que se vea en toda la pantalla y no me lo muestra, volvi a poner el fondo en un gadget como lo tenia antes y tampoco me lo muestra, solo se ve el fondo rosa, que es el que tengo directamente el las opciones avanzadas del blog. que estara pasando? tendre mal algun codigo de la plantilla? o es que ya no me va a permitir ninguna modificacion? cabe mencionar que antes de hacer el respaldo, borré los codigos que tienes en esta entrada (los de background)y según yo puse los que anteriormente tenia. ya me desesperé de tanto estar intentando ponerle el fondo y nada. plis ayudame!!
upss, ya me extendi mucho, casi pongo una biblia jejeje, sorry.
muchas muchas gracias. saluditos
Hola ARILU2, entré a tu blog pero no veo puestos ninguno de los dos métodos, necesitaría que lo pongas (aunque no funcione) para que pueda ver si es la colocación del código, la URL de la imagen, o algún otro detalle que pueda estar afectando.
EliminarSaludos!
Hola El Potro, no encuentro una pagina de contacto en tu sitio Web. Mi nombre es Massimiliano y me gustaria contactarte para una propuesta de JV al que dije a mi equipo de Marketing que iba a tratar personalmente con usted.
ResponderEliminarPodria decirme por qué medio puedo contactarlo?
Desde ya gracias
Saludos
Hola Massimiliano, si gustas puedes enviarme un mensaje privado desde la página de Facebook:
Eliminarfacebook.ciudadblogger.com
Saludos.
Hola El Crack Loko, en el foro de Blogger verás la información sobre los blogs favoritos de la semana:
ResponderEliminarhttp://productforums.google.com/forum/#!category-topic/blogger-es/3R2AUUFns-w
Saludos y suerte!
Hola, las reacciones vienen incluidas en la configuración de la caja de correo de Disqus. Estaba registrado desde hacia más de tres años, me ha dado por instalarle en uno de los blog y ahí han aparecido junto a los comentarios las reacciones.
ResponderEliminarLo curioso de este correo es que puedes comentar en algunos periódicos sin necesidad de estar registrado. Eso sí, aunque cuando escribes el comentario aparece la imagen que hayas puesto en la cuenta disqus no se si los del propio medio o quien sea anula las imagen y el nombre del perfil y deja una que trae ese correo para comentar como Guest (invitado)
Pues tú sabes más de ese tema que yo :)
EliminarPotro acabo de aplicarlo pero no se vé en la parte superior de la web, que raro, que podría ser me puedes ayudar? hechale una miradita please, saludos.
ResponderEliminarhttp://rapychelas.blogspot.com/
Es por la plantilla, agrega estos estilos:
Eliminar.body-fauxcolumns, .content-fauxcolumns {
height: auto !important;
}
Hola amigo, ¡Muchas fracias amigo potro!
ResponderEliminarYa envié mi Blog, ¡Y vamos aver que pasa! ¡Ojalá lo cojan como el favorito! Aunque no importa, ¡Google lo verá!
Oye amigo potro, Comparte mi blog porfavor.
http://www.elcrackloko.blogspot.com
¡Saludos amigo y muchas gracias por todo!
hola de nuevo Potro
ResponderEliminarmil gracias por tu ayuda, ya lo puse y por fin se ve de nuevo!!!!!! que bien se ve jejeje.
si lo habia quitado porque como no funcionaba, pero lo tenia con el codigo en gadget. y tampoco se veia. pero lo puse de nuevo en html y por fin quedó, no se que abra pasado, porque te juro que estaba poniendo el mismo codigo, lo copiaba de tu entrada y lo pegaba y no se veia. en fin, lo bueno es que ya quedo, y modifique mi fondo para que ahora si se vea la decoracion de abajo.
de nuevo un millon de gracias por toda tu ayuda. no sabes cuanto me ha servido lo que publicas, bueno, ya te habras dado cuenta al ver mi blog verdad jejejeje.
espero no tener que darte mas lata, al menos no pronto. saluditos
Qué gusto que se resolvió ARILU2, saludos!
EliminarHola adrian, no sé cuál plantilla uses, pero sube la plantilla original a un blog de pruebas y mira cuáles son los códigos que tenías ahí.
ResponderEliminarSaludos.
Me a ido genial, es lo que buscaba, ahora a ver el slider que tal, gracias.
ResponderEliminarQué gusto que todo haya salido bien!
EliminarHola Potro!!...disculpa es que mi bloc es privado y tengo solo unos cuantos amigos pero ahora he querido añadir alguno mas y lo escribo pero no aparece en el panel ni tampoco aparece mi lista de contactos para agregarlos desde hay...no se que puede pasar antes si podía que es lo que puede estar mal?...
ResponderEliminarY referente a lo que dices del fondo del bloc a mi me gustaría saber como poder hacer que ocupe todo el fondo de la entrada la imagen sin que se repita o salga dos veces..como puedo hacerlo? yo he probado haciendo la imagen mas grande pero se me repite dos veces igual...
Bueno muchas gracias y un saludo.
Hola Yolanda, no sé porqué pueda pasar eso, pero no estaría de más que pruebes hacerlo en otro navegador. También recuerda que en los blogs privados sólo puedes tener 50 invitados.
EliminarPara lo otro mira esta entrada:
http://ciudadblogger.com/2009/04/entradas-con-imagen-de-fondo.html
Ahí cambia esto:
background="http://URL de la imagen de fondo"
Por esto:
style="background:url(URL de la imagen) no-repeat center center fixed; background-size: cover;"
Hola disculpa tengo una duda he bajado una platilla de btemplates pero me dice que para que salgan mis entradas en la barra en donde van pasando unas entradas tengo que editar no se que cosa no se si tengas un tema de esto o puedas explicarme como hacerlo, muchas gracias espero tu respuesta.
ResponderEliminarHola joe, ¿cuál es la plantilla que has instalado?
EliminarHola de nuevo adrian, esos son los enlaces activos y visitados, aquí puedes ver cómo personalizarlos, aunque creo que desde el Diseñador de plantillas también los puedes personalizar:
ResponderEliminarhttp://ciudadblogger.com/2009/04/personalizar-links.html
Perdon Potro, la pregunta que deje no era en esta Entrada, sino en esta:
ResponderEliminarhttp://ciudadblogger.com/2012/08/slideshow-de-imagenes-como-fondo-del-blog.html
Espero puedas ayudarme!
Muchas gracias Potro!! eres muy amable probare hacerlo.
ResponderEliminarMaestro es posible colocar un slider como fondo de blog tipo http://www.zara.com/webapp/wcs/stores/servlet/home/es/es
ResponderEliminary cambiar el ancho del blog completo de una plantilla prediseñada como http://fransoluciones.blogspot.com.es/
saludos...
Posiblemente sí, aunque no con este. A ver si después me encuentro con alguno que haga las transiciones de esa manera o con otros efectos.
EliminarSaludos.
Hola, Potro. Hace unos días descubrí el blog pero, navengando un poco por las entradas, pude ver que me va a ayudar a resolver varios problemas que tengo con mi blog (en proceso) por lo que te agradezco de antemano todo lo que publicás para los inexpertos como yo. Bueno, también quería hacerte una pregunta: la imagen, sea la resolución del monitor menor o mayor, ¿va a tener alguna distorción? No sé si alguien ya preguntó pero bueno...
ResponderEliminarGracias por tu comentario Pogue Suneka. No tendrá distorsión en cuanto a proporción de tamaño, pero obviamente si la imagen es muy pequeña y si se ve en un monitor muy grande entonces no se verá de tan buena calidad. Lo óptimo sería usar una imagen un poco grande para que no pierda calidad al ampliarse.
EliminarSaludos.
Muchas gracias por responder. Me ayudo mucho.
EliminarHey potroaludos si eres tan amable pido tu ayuda jeje intente hacer el primero paso pero
ResponderEliminarami no me sale asi
body {
background: url(URL de la imagen) no-repeat center center fixed;
background-size: cover;
margin:0;
color:#000;
font:x-small Georgia Serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: center;
}
si no que me sale diferente asi:
body {
font: $(body.font);
color: $(body.text.color);
background: $(body.background);
}
html body .region-inner {
min-width: 0;
max-width: 100%;
width: auto;
}
.content-outer {
font-size: 90%;
}
a:link {
text-decoration:none;
color: $(link.color);
}
a:visited {
text-decoration:none;
color: $(link.visited.color);
}
como le puedo hacer? que valores cambio? x ke me sale diferen? tengo una plantilla de picture windows agradeceria mucho tu ayuda bro
saludos y bendiciones
Hola RAS LION, es el background que está dentro del body { el que debes cambiar, es decir, cambiar esto:
Eliminarbackground: $(body.background);
Por esto:
background: url(URL de la imagen) no-repeat center center fixed;
background-size: cover;
COMO PUEDO HACER PARA QUE LOS GADGETS Y LAS ENTRADAS DE MI BLOG QUEDEN CON EL FONDO NEGRO Y ATRAS DE ESE FONDO OTRO ? COMO EN ESTE: http://musiceverydayplease.blogspot.com.ar/
ResponderEliminarDesde el Diseñador de plantillas puedes elegir qué color de fondo debe tener la sidebar y las entradas.
EliminarHola, yo tengo este problema con mi blog, y no puedo solucionar el problema del fondo, quiero sacar eso blanco!
ResponderEliminarhttps://dl.dropbox.com/u/100138337/error.bmp
Espero su respuesta y gracias!
Ese es el alto del blog, lo que sucede es que el alto no alcanza a cubrir tu imagen de fondo, por lo tanto tienes que hacer que el fondo se repita a lo alto:
Eliminarbody, .body-fauxcolumn-outer {
font: normal bold 12px 'Trebuchet MS', Trebuchet, sans-serif;
color: #000000;
background: #ffffff url(http://1.bp.blogspot.com/-cwNO5TcbcKY/UC11llLz7kI/AAAAAAAAAEg/MoJ3A3ArirY/s0/wall.JPG) no-repeat scroll top center;
padding: 0 0 0 0;
}
Tienes que cambiar ese no-repeat por repeat-y
Quizás parezca un poco tonta pero no entiendo lo del URL (?) no es la dirreción no ? o si, en fin, quien pueda respondanme
ResponderEliminarHola Loane, la URL de la imagen es el link de la imagen. Mira esta entrada para que veas cómo subir la imagen y conseguir la URL:
Eliminarhttp://ciudadblogger.com/2011/06/subir-imagenes-y-obtener-la-url-de-la.html
Gracias por eso me sirvio mucho
ResponderEliminarHola! Una duda, debería subir la imágen en algún tamaño mínimo y máximo particular? Es decir, estoy trabajando con una imagen en alta resolución de unos 4000px x 3000px y tengo miedo de que sea demasiado pesada y tarde mucho en cargar...
ResponderEliminarGracias!
No hay una medida específica, pero yo sí consideraría no hacerla tan grande justamente para que no tarde mucho en cargar. Prueba con varias medidas para que veas qué tanto se distorsiona, de esa manera encontrarás la medida adecuada para ti.
Eliminarhola tengo un problema...la imagen de fondo me aparece luego de los post... en la parte superior, es decir, en la cabezera no me aparece la imagen de fondo. que pudo pasar??? este es mi blog http://futbollaloma.blogspot.com.ar/
ResponderEliminarEs por un estilo de tu plantilla. Agrega antes de ]]></b:skin> lo siguiente:
Eliminar.body-fauxcolumn-outer .cap-top {
background: transparent !important;
}
perfecto! muchas gracias por la informacion!
ResponderEliminar¡Muy buenas!
ResponderEliminarEstoy teniéndo problemas con el fondo del blog y no encuentro la solución. La cuestión es que la imagen del blog me aparece "más arriba" de lo que debería. ¿De qué puede ser?
Dejo el enlace: http://www.lennykravitzspain.com/
¡Me trae de cabeza! :/
Hola, abajo del background-repeat agrega esto:
Eliminarbackground-position: 0px 35px;
¡Saludos!
¡¡Muchísimas gracias!! :-D
EliminarWoww! me ha quedado de pegada. He usado la segunda opción y se ve guapisimo ahora el blog. La única pega que si quiero que se desplace no lo hace, pero ha quedado genial Gracias!
ResponderEliminarQ wena... graciass Potro. Me quedo con la segunda!
ResponderEliminarParece que es la favorita :)
EliminarHola Potro, se puede colocar un fondo dentro de una pagina interior del blog independiente.
ResponderEliminarNo he comprendido ladyruss, ¿dónde quieres el fondo, en la entrada, o que ese fondo sólo se vea en una página en concreto?
EliminarHola Potro que tal saludos ! queria hacerte una pregunta quiero usar la segunda opcion con jQuery
ResponderEliminarpero sucede que yo tengo 2 fondos uno que se muestra en la portada y el otro se muestra en el resto del blog
si me funcionara o es otro procedimiento ? gracias estare muy pendiente para saber si tiene solucion,
este sreia el primero que se muestra en el resto del blog
background-image: url(URLDEIMAGEN);
y el segundo para que se muestra solo en la portada del blog
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<style>
body {background:#000000 url(URLDEIMAGEN);
background-attachment: fixed;
background-position: bottom center;
background-repeat: repeat-x;
!important;}
</style>
</b:if>
Puedes usarlo, y para que no se ejecute en la portada (porque supongo que ese no lo quieres modificar) encierra el código del script también en una condicional, la que es para que algo se ejecute en todas partes MENOS en la portada.
EliminarExcelente ! no recordaba las condicionales. Tan sencillo como usar condicionales! y disculpa Potro no me explique correctamente en mi comentario num. 80 pues en realidad quiero usar este Tuto para los 2 fondos no solo para 1, y solo tenia que usar 2 condicionales uno para la portada y otro para el resto del blog- jejeje, gracias por tu respuesta. bye!
ResponderEliminarSaludos!
ResponderEliminarPrimero de todo felicitarte, por tus artículos, que son de gran ayuda para todos los que queremos tener un bloc en condiciones.
Hice una intro según tu articulo intro con jquery y cookies, y la verdad que muy bien, el problema es la imagen que tengo, quiero que se ajuste a toda la pantalla y no hay manera.
Primero si pongo la imagen en el scrip del intro, en background como tu recomendaste como fondo, no se que código poner para que se ajuste, donde tendría que poner el scrip que indicas en este articulo, ya que lo he colocado y no he conseguido nada. He seguido los pasos para que no haya conflicto entre versiones de jquery, sin resultado.
Si pongo la imagen antes de /body, como también indicas tampoco consigo ajustarla, es más aquí si me ocupa toda la pantalla no se ve el texto "entrar", supongo que queda tras la imagen.
Espero haberme explicado.
Te dejo la dirección de dos blogs de pruebas, el primero tengo la imagen en background del scrip intro.
http://p4dia.blogspot.com.es/
El segundo antes del /body con una imagen reajustada pero que no cubre la pantalla.
http://p5di.blogspot.com.es/
La plantilla es la simple de Bloguer.
Gracias....
Con los intros no es igual Fauci, en los intros no tienes una imagen de fondo como CSS sino que tienes una imagen directa en HTML, ahí aunque le aplicaras estilos para que cubra la pantalla pasaría lo que mencionas, se movería el botón de entrar, porque es una imagen como elemento, no como fondo.
EliminarAmigo potro, por medio de tu pagina he ido optimizando mi blog, pero le he realizado tantos cambios que ahora la plantilla "no me permite cambiar la imagen de fondo" que estará pasando??? esta es mi página: http://guevaragaersteconsultoria.blogspot.com/
ResponderEliminarAmigo Potro, por medio de tu pagina he optimizado la mía, gracias por los tips... pero tengo un problema, de tantos cambios en la plantilla HTML ahora la misma "no me permite cambiar la imagen de fondo"... no se que puede estar pasando???. este es mi blog: http://guevaragaersteconsultoria.blogspot.com/
ResponderEliminarParece que es un error de Blogger, ya muchos han reportado ese problema, pero aun puedes hacerlo directo en la plantilla:
Eliminarhttp://ciudadblogger.com/2009/02/cambiar-color-de-fondo-por-una-imagen.html
Hola Potro!quisiera probar con el metodo con css3,uso plantillas del diseñador podrias indicarme si este es codigo que debo reeplazar?
ResponderEliminar/* Content
----------------------------------------------- */
body {
font: $(body.font);
color: $(body.text.color);
background: $(body.background);
}
html body .content-outer {
min-width: 0;
max-width: 100%;
width: 100%;
}
Saludos!
Hola, el que debes reemplazar es el background como se especifica en la entrada, o sea este:
Eliminarbackground: $(body.background);
Me sirvio mucho... Gracias por los tutos que siempre nos traes.
ResponderEliminarGracias a ti por tu visita Hamiltonbl :)
EliminarMuchas gracias!quedo perfecto con el metodo css3
ResponderEliminarbesito :D
En mi caso quiero poner en mi sitio web una imagen de fondo que tenga la alineación centrada como le puedo hacer
ResponderEliminarPara que el fondo esté centrado agrega esta propiedad:
Eliminarbackground-position:center;
Buenas noche Potro , Gran Blog , me vas a ver a menudo¡¡¡
ResponderEliminarYa me has ayudado alguna vez en alguna duda pero ahora tengo algo mas de tiempo y quiero pulir un poco este hobby para mi de Blog
No consigo quitar el largo de Mi Blog , me seria de gran ayuda Gracias de antemano.
Te dejo mi Blog , no tiene Fin!!!!
nenegarcia.com
Hola Nene Garcia, es por una sidebar que no está bien oculta. Después de #lsidebar-wrapper{ agrega:
Eliminardisplay:none;
Gracias Potro , Espero hacer mas visitas , es un Blog Genial¡¡
ResponderEliminarEl Potro, a ver si puedes ayudarme, quería añadir el script para que el fondo se vaya redimensionando pero al hacerlo entonces el slideshow que tengo en la home deja de funcionar y el texto para la imagen aparece por encima de la foto. ¿Sabes qué puede ser?
ResponderEliminarhttp://bcnbikerteam.blogspot.com.es/
Un saludo y muchas gracias!
Es porque usas Mootools, al final de la entrada se habla sobre ello.
EliminarMil gracias El Potro, domino muy poco sobre el tema y como estoy modificando una plantilla no tenia ni idea de que estaba usando Mootools.
EliminarHe seguido la otra entrada y ya esta arreglado.
De nuevo muchisimas gracias!
Buenas El Potro.
ResponderEliminarAntes de nada, darle la enhorabuena por el pedazo de pagina que tiene, me esta ayudando muchísimo, llevo desde anoche mirándome todo lo que puedo poner.
Pero tengo un problema con lo del fondo, por lo que me han comentado no ocupa toda la pantalla en monitores mas grandes, es decir que este "truco" no me sale.
Espero que me puedas ayudar a resolverlo.
Tampoco me ha salido el de cambiar el diseño de la caja de los comentarios, pero bueno...
Aquí te dejo la dirección del blog.
http://meanwhilerusia.blogspot.com.es/
Un saludo y muchisimas gracia por todo
Hola, tienes dos veces la propiedad background, una de ellas está mal, elimínala:
Eliminarbackground: url http://i.imgur.com/4HLP9.jpg no-repeat center center fixed;
Saludos.
¿Esa que has puesto es la que debo de eliminar?
ResponderEliminarImagino que una de las que esta aqui, es la que debo de eliminar,¿no?
ResponderEliminar/* Content
----------------------------------------------- */
body {
background: url http://i.imgur.com/4HLP9.jpg no-repeat center center fixed;
background-size: cover;
font: $(body.font);
color: $(body.text.color);
background: $(body.background);
}
html body .content-outer {
min-width: 0;
max-width: 100%;
width: 100%;
}
a:link {
text-decoration: none;
color: $(link.color);
}
a:visited {
text-decoration: none;
color: $(link.visited.color);
}
a:hover {
text-decoration: underline;
color: $(link.hover.color);
}
.body-fauxcolumn-outer .cap-top {
position: absolute;
z-index: 1;
height: 276px;
width: 100%;
background: transparent $(body.background.gradient.cap) repeat-x scroll top left;
_background-image: none;
}
/* Columns
----------------------------------------------- */
.-.-.-.-.-.-.-.
He eliminado la primera, que es lo que me has puesto, y esa no es,pero no estoy seguro cual es la otra que debo de eliminar.
un saludo y gracia.
Tienes esto:
Eliminarbody {
background: url http://i.imgur.com/4HLP9.jpg no-repeat center center fixed;
background-size: cover;
font: normal normal 13px Arial, Tahoma, Helvetica, FreeSans, sans-serif;
color: #d52a33;
background: #ffffff none no-repeat scroll center center;
}
Cámbialo por esto:
body {
font: normal normal 13px Arial, Tahoma, Helvetica, FreeSans, sans-serif;
color: #d52a33;
background: #ffffff none no-repeat scroll center center;
background: url(http://i.imgur.com/4HLP9.jpg) no-repeat center center fixed;
background-size: cover;
}
Hola una pregunta, logre hacer todo esto lo mas bien pero ya me aburri un poco... ¿me podrias decir como hago para quitarlo? Porque intente borrando los codigos que me distes pero el fondo me queda blanco y si voy a elegir un fondo predeterminado no me deja.
ResponderEliminarEspero tu respuesta, saludos!
Quita los códigos que pusiste, luego debajo de body { agrega esto:
Eliminarbackground: $(body.background);
Después de eso podrás elegir un diseño desde el Diseñador de Blogger.
ola amigo tu tema esta muy bueno pero yo kisiera saber como hacer para q el fodo tambien se vea en el centro osea tmb en la entradas me dejo enteder grasias antemano
ResponderEliminarTendrías que quitar el fondo de las entradas y/o del contenedor del blog, pero para ello habría que saber en cuál blog lo quieres hacer.
EliminarHola. Tengo un problemilla. He cambiado el fondo de un blog predifino por un fondo que he hexo yo. Luego he seguido tus consejos y en mi ordenador se ve perfecto sin embargo he probado en otros ordenadores con otras pantallas y el fondon aparece, me aparece un fondo blanco. Alguno me podria ayudar?
ResponderEliminarMuchas gracias
Puede ser que la URL de la imagen que has puesto no sea la correcta, te recomiendaría que la subas a Picasa:
Eliminarhttp://ciudadblogger.com/2011/06/subir-imagenes-y-obtener-la-url-de-la.html
Hola Potro,
ResponderEliminarprimero de todo te felicito por al cantidad de conocimientos que tienes sobre este tema, realmente es bárbaro.
Estoy intentado que mi blog tenga una imagen de fondo fija y a pantalla completa, por todos los medios. Con tu solucion CSS he logrado el mejor resultado, pero no se por qué diablos no queda óptimo, a otros usuarios parece funcionarle.
En mi caso, lo que ocurre es que la imagen de fondo aparece enmarcada por color blanco, es decir, la imagen no llega a cubrir toda la pantalla, si bien se mantiene centrada y ocupa un gran trecho, pero el limite es practicamente al limite del campo de los widgets laterales, y tampoco llega al limite superior, Estoy deseperado, que puedo hacer?
Gracias de antemano!
Gracias por tu comentario Scott St. James, en cuál blog tienes el problema, porque en el de tu perfil no veo puestos los códigos CSS para que la imagen cubra toda la pantalla.
EliminarHola Potro, el problema era el navegador.. con google chrome funciona todo perfectamente. muchas gracias!
ResponderEliminarHola,Me llamo María y soy nueva en esto, me paso horas y horas y no avanzo. Necesito que me ayudes para colocar un fondo que no hay manera de ajustarlo, leí el tutorial pero no me aclaro(dónde pego el código? en diseño/gadget/HTML/javascript?) No tengo ni idea...GRACIAS
ResponderEliminarSOCORRO AYUDAMEEEE...NO HAY MANERA DE COLOCAR UN FONDO EN MI BLOG, O ES DEMASIADO GRANDE O SE REPITE!!! Hola, soy María, estoy haciendome un blog y no entiendo que son los códigos CSS. Yo sé ir a DISEÑO/GADGET/ HTML/JAVASCRIPT Y PEGAR UNA IMAGEN, pero me dá miedo hacerlo para los fondos...PORFA A VER SI ME PUEDES ECHAR UNA MANO. GRACIAS
ResponderEliminarEn la entrada dice dónde hay que pegar el código MARÍA, sólo debes seguir las indicaciones al pie de la letra y con cautela.
EliminarEste comentario ha sido eliminado por un administrador del blog.
ResponderEliminarHola Junioz, tendrías que usar una plantilla de las llamadas "Responsive web design", o de las "fluid width", ambas se adaptan al tamaño del monitor del usuario.
EliminarPd. Elimino el comentario por el aviso que está al final.
Saludos.
Yo veo el fondo en ambos.
ResponderEliminarUfffffffff......Que bien pude poner una imagen de fondo en este blog, que estoy tuneando, ahora quiero quitar el nommbre superior, ya que puse una imagen y ahora ya no es necesario, como puedo hacerlo. Otra cosa cuando las imagenes corren, no se despliegan los menus. Te agradesco si puedes ayudarme, esye es el Blog.
ResponderEliminarhttp://pasosporvenezuela1.blogspot.com/
Puedes ocultar el título así:
Eliminar#header h1 {
display: none;
}
En cuanto a lo otro, ¿qué fue lo último que hiciste antes de que esos problemas se dieran? ¿has probado deshacer los últimos cambios realizados?
Buenísimo, me será de mucha ayuda. Un saludo.
ResponderEliminarHola El Potro, me gustaría que mi blog solamente tuviese la imagen de fondo en la (home),¿como puedo hacerlo? no se si ya te lo preguntaron en alguno de estos comentarios, intenté buscar pero no lo encontré...
ResponderEliminarTe agradezco de antemano. un saludo.
Hola alfonso, puedes hacer que se aplique sólo a la portada si antes de </head> usas este código:
Eliminar<b:if cond='data:blog.url == data:blog.homepageUrl'>
<style>
body {
background: url(URL de la imagen) no-repeat center center fixed;
background-size: cover;
}
</style>
</b:if>