Puedes poner en Blogger la barra "cargando página" que indicará que los elementos del sitio se están cargando. Una vez que el sitio cargue todos los elementos la barra desaparecerá. Para colocarlo en nuestro blog nos ayudaremos con un script, los pasos son los siguientes:
Vamos a Plantilla | Edición de HTML y antes de </head> pegamos lo siguiente:
<script type='text/javascript'>
window.onload = detectarCarga;
function detectarCarga(){
document.getElementById("imgLOAD").style.display="none";
}
</script>
Guardamos los cambios y vamos a Diseño | Elementos de la página y en un elemento HTML/Javascript pegamos lo siguiente:
<div id="imgLOAD" style="text-align:center;">
<b>Cargando...</b>
<img src="URL de la imagen" />
</div>
Este elemento lo podemos arrastrar donde mejor nos guste, aunque generalmente va arriba de los posts. Donde dice URL de la imagen lo cambian por la dirección de la imagen que quieran. Les dejo unas cuantas imágenes para que usen.
estaba esperando a que publicaras este post me quedo de maravilla
ResponderEliminargracias
Hola Daniela, qué bueno que te ha servido. Saludos.
ResponderEliminarHola daniela, quisiera saber la dire de tu web, par ver como te quedó.
ResponderEliminarPotro: la verdad que está muy buena la idea, de todos modos, no creo que pueda usarla, ya que mi página con ese flash del Cyborg y el Widget de las fotos demora mucho en cargarse.
Saludos!
Bueno, lo ideal es que sólo se usen los scripts necesarios, aunque tu página me carga rápido, no sé si sea por el navegador o la conexión a internet.
ResponderEliminarSaludos.
wow!!! genial me sirvio muxo :-)
ResponderEliminargracias x el truco
cuidensen muxo y gracias!!
bye
Hola ETOILE-SAMA,
ResponderEliminarQué bueno que te gustó. Sólo que para que desaparezca la barra cuando carga la página debes poner el código en un elemento sólo y no compartirlo con el script de las imagenes que rotan.
Saludos.
Excelente, recién conozco este blog, y le veo el más útil para los bloggeros...
ResponderEliminarGracias, saludos!
Hola Alfonso E.
ResponderEliminarGracias por tus comentarios y bienvenido, ojalá puedas encontrar información útil aquí.
Saludos.
epale amigo no me sirvio la imagen se queda hay no se desaparece que hagoooo
ResponderEliminar¿Cuál es la dirección de tu blog?
ResponderEliminarwww.mastron-os.blogspot.com
ResponderEliminarAl parecer es por los scrolls de bienvenida que tienes, esos scrolls son muy bonitos pero por desgracia impiden que otros scripts se ejecuten correctamente.
ResponderEliminarSaludos.
epale amigo disculpa ya resolvi el problema de todas formas gracias y visita mi blog
ResponderEliminarMe ha quedado perfecto, gracias men.
ResponderEliminarMe alegro que te haya funcionado ;)
ResponderEliminarSaludos.
Hola Potro cabe destacar que te hace falta una barra de cargar muy famosa
ResponderEliminarhttp://static.ak.fbcdn.net/rsrc.php/zCQYC/hash/ejut8v2y.png
Ah chinga! No la reconozco :(
ResponderEliminar¿De dónde es esa barra?
mmm, es de Facebook, pense que lo conocias.
ResponderEliminarbueno si quieres colocalo para que los demas lo pongan
nos vemos
Ah vaya, es que casi no uso Facebook :P
ResponderEliminarQue tal Mi buen Potro!
ResponderEliminarOie Campeon, me gusto mucho este script y opte
por ponerlo en mi blog, pero sabes que, la mendiga
imagen no desaparece al terminar de cargar el blog.
Nose si fuera mucha molestia que le hecharas un
ojo de pasada a mi blog: http://CeTis71.blogspot.com
Por mientras aqui andara indagando que tienes
un material ultrarecontrautilisisisisisimoo! ajuaa! :)
Saludos, y cuidate!
Hola Charly,
ResponderEliminarNo veo que tengas el script en tu blog, pero igual a veces sucede que otros scripts hacen que este no funcione adecuadamente :s
¡Saludos y gracias por tu comentario!
oye portro me gustaria ponerla como una imagen estatica o algo asi pero no se como
ResponderEliminarPodrías intentarlo así, en el segundo código donde dice:
ResponderEliminarstyle='text-align:center;'
Cámbialo por:
style='text-align:center; position:fixed; top:100px; left:500px;'
Donde dice top 100px es la distancia de arriba y left 500px la distancia desde la izquierda.
HOLA!
ResponderEliminarInstalé tu script y no funciona, espero que me puedas ayudar
http://alejandropensado.blogspot.com
Saludos y GRACIAS!
Puedes probar con esta otra opción que tiene Oloblogger:
ResponderEliminarhttp://oloblogger.blogspot.com/2010/02/aviso-de-carga-solo-con-css.html
Saludos.
PUES ME HE DADO CUENTA QUE EN LOS BLOGS QUE NO FUNCIONA (EL MIO POR EJEMPLO) FUNCIONA AL FINAL SI LE QUITO LA PARTE: (b)Cargando...(/b) PUSE PARENTESIS PORQUE NO PUESDO PONER LOS SIGNOS DE MENOR QUE Y MAYOR QUE
ResponderEliminarEste comentario ha sido eliminado por el autor.
EliminarEstimado, el mayor que y menor que se pone como sigue (Los pondré separados pues si los coloco juntos los caracteres aparecerán con el signo)
EliminarMayor que ---> & g t ; (ponlos juntos)
Menor que ---> & l t ; (ponlos juntos)
saludos y espero haberte ayudado
cbonick
Ummm qué extraño, pero bueno, mientras funcione de eso modo está más que bien :)
ResponderEliminarpotro nuevamente molestando jejeje hay forma que esa imagen de carga (mientras se cargue el blog) ponga opaca el fondo algo muy parecido al efecto causado al usar el Shadowbox: ventanas modales multimedia. solo que es solo mientras se carga la pagina.
ResponderEliminarUmmm no, o al menos no con este método :\
ResponderEliminarPotro lo que yo kiero es que salga una pagina en blanco con solo la imagen de la barra cargando y cuando termine de cargar la pagina desaparezca y aparezca mi contenido
ResponderEliminarpotro y con una animacion flash?
ResponderEliminarNo sabría decirte, al menos éste script funciona con imágenes, no sé si haya algún otro que acepte formato flash.
ResponderEliminarpotro revisando la parte 'imgLOAD' style='text-align:center;' sustitui los apostrofes (') por comillas "" y funciono Y POR ALGUNA RAZON ESTRAÑA al copiar tu codigo y pegarlo al gadget pegue imgload sin la parte que va en mayusculas por lo que no me funcionaba hasta que puse la forma correcta que es : imgLOAD seria bueno que los usuarios verifiquen si han colocado bien el nombre imgLOAD.
ResponderEliminarQué curioso lo de las comillas :?
ResponderEliminarGracias por el aporte, cambiaré mejor los apostrofes por comillas por si las dudas.
potro so en lugar de la barra puese una imagen, ESTA ES LA DUDA: como hacer para que quede flotando, pero centrado? es decir que no importe que resolucion tenga el navegador que siempre se vea centrado, algo parecido a shadowbox, en la forma esque siempre esta centrada
ResponderEliminarEsa sí te la voy a deber porque no veo cómo. Quizá habría manera de hacerla flotante y de ajustarle medidas para centrarla pero sí irá en función de la resolución del monitor donde lo configures, en algún otro se verá distinto :/
ResponderEliminarQue tal potro, d nuevo x aca.Poco a poco estoy arreglando el blog con los utilisimos aportes q nos brindas.
ResponderEliminarInstale el script y funciona . Una pregunta: y si quiero q al entrar al blog solo me aparezca la barra CARGANDO en una pagina sola (al centro) y cuando termina de cargar recien aparezca el contenido del blog?. Se podra?
No con este método pero investigaré si hay algún otro con el que pueda hacerse.
ResponderEliminarSaludos.
okkk potro ,t felicito , x q a muchas personas no les gusta compartir lo q saben, deberian tomar siempre los buenos ejemplos.
ResponderEliminarHola Potro
ResponderEliminarHe estado hoy cacharreando en el blog y he notado que el reprodutor de música se detiene luego de una o dos canciones
Lo que hice fue colocar el pajarito de twitter y algunos enlaces. Me ayudas a saber si hay alguna interferencia entre estos y el cargador de Goear o si es que la página está pesada y la manera entonces como deba "descargarla" a agilizar la carga púes me interesa mantener la información , pero también que se pueda escuchar la música que he colocado
Gracias lindo
El problema parece estar en el reproductor, seguramente el resto de las canciones no están funcionando bien, sería cuestión de revisar la lista de reproducción desde Goear.
ResponderEliminarDe cualquier manera para acelerar la carga del blog basta con eliminar todos los gadgets que no sean necesarios y dejar únicamente los que consideres que sí son verdaderamente útiles, con eso lograrás hacer un poco más rápido el blog.
Saludos!
Hola Potro
ResponderEliminarTienes razón, el inconveniente está en Goear, y es que hay algunas canciones que se deja escuchar, se dejan pasar a equipos MP4, pero no se dejan colocar en lsita, pues sale inmediatamente al momento de escucharla Status y queda suspendido y luego sale End of Playlist.
sabes algún truco para permitir que estas canciones se logren colocar en lista?
Gracias
Hola! Queria saber si me puende ayudar con lo siguiente..quiero poner una promo al iniciar la web con el efecto estilo lightbox,, he realizado galerias y demas con esta ventana modal, pero nose como hacer para que se me abra apenas ingreso a la web..espero se entienda y me puedan ayudar!
ResponderEliminarGracias!
Soraya Eugenia, no hay truco para eso pues eso depende básicamente del reproductor. Pero si el problema está en el formato de las canciones puedes usar algún programa para convertir MP4 en MP3 y luego subes de nuevo tus canciones a Goear.
ResponderEliminarDiseños MPR, con Lightbox no es posible agregar una ventana modal al cargar el blog, pero tengo entendido que con Lightwindow sí.
ResponderEliminarhttp://vagabundia.blogspot.com/2007/12/lightwindow-casi-casi-perfecto.html
Seeee!! esta chidisimo, te la rifas potro, lo implemantare pronto en mi blog!!
ResponderEliminarQué bueno que ha sido de tu agrado :)
ResponderEliminarTengo un problema y es que he insertado lo de que me aprezca cargando, pero cuando se carga la pagina no se quita, explicame detalladamente como tengo que hacer para que desaparezca al cargarse la pagina. Gracias
ResponderEliminarMira en el código que pusiste en el gadget, esta parte debe ser así:
ResponderEliminarid="imgLOAD"
Y lo tienes así:
id='imgload'
Debe estar con las comillas dobles y tener lo que está en mayúscula como se indica.
muchas gracias!!! solucionado!! maquina! =)
ResponderEliminarasi se ha quedaodo:
ResponderEliminarhttp://theinformaticalrincon.blogspot.com/
=)
Genial lo que hace rato buscaba!! Gracias potro... Si tuvieras algo para calificarte el post te daria un "10" ¿Aunque no te quedaria mal un calificador? piensalo y Gracias! ;)
ResponderEliminarNo es necesario, pero gracias :)
ResponderEliminarmuy bueno hay alguna forma de ponerlo que carge solo una parte del blog¿????
ResponderEliminarUsa una condicional en el elemento HTML/Javascript donde has puesto el segundo código para ocultarlo donde no quieras que sea visible.
ResponderEliminarHola disculpa use este script pero el problema es que no desaparece cuando se termina la carga y/o se interrumpe, me podrias ayudar a saber que debo cambiar?
ResponderEliminarhttp://www.theradikalzone.blogspot.com
Gracias
Algún otro script debe estar haciendo conflicto. Prueba poner le primer código antes de </head> que es donde originalmente debe estar. Si eso no lo resuelve entonces sí debe ser por otro script del blog.
ResponderEliminarGenial!!Ya lo puse en mi blog!!Aunque yo lo hice con mi propia imagen relacionada con el tema de mi blog.Muy buen truco.
ResponderEliminarQué gusto que ha sido de tu agrado :)
ResponderEliminarEste comentario ha sido eliminado por el autor.
ResponderEliminarHace tiempo que sigo tu blog....y es de lo mejor que se puede encontrar sobre blogger...
ResponderEliminarRespecto a la barra cargando... tengo un blog y acabo de hacer una animación flash de precarga... queria saber como configurar el blog para que me aprezca la animación de precarga cuando entro al sitio. Pongo este ejemplo sobre lo que deseo ( aunque lo mio seria más simple) http://www.vabieka.com/
Saludos y Gracias!
Gonzalo
Talvez siguiendo este método de Oloblogger:
ResponderEliminarhttp://oloblogger.blogspot.com/2010/02/aviso-de-carga-solo-con-css.html
Sólo que en lugar de poner el código de la imagen pondrías el código del archivo flash.
Hola
ResponderEliminarSabes que se me queda pegado el cargando aunque ya haya cargado la pagina.
Que puede ser????
La mayoría de las veces es por algún otro script con el que no es compatible, sucede muy a menudo.
ResponderEliminarhola potro eres el mejor..! gracias a este post o como se llame mi blog se vé genial.. pero no tienes otro truco para que la imagen sea flotante? porfa responde
ResponderEliminarHola Jim 011,
ResponderEliminarPrueba cambiando esta parte del código:
style="text-align:center;"
Por esta:
style="text-align:center; position:fixed; top:200px; left:300px;"
wow esto es genial si me funcionó. gracias potro eres el mejor
ResponderEliminarGracias! muy util :D
ResponderEliminarEste comentario ha sido eliminado por el autor.
ResponderEliminarEste comentario ha sido eliminado por el autor.
ResponderEliminarno me funciona potro
ResponderEliminar¿En cuál blog lo has puesto?
Eliminara mi tampoco
ResponderEliminarEste comentario ha sido eliminado por el autor.
ResponderEliminarPotro muy buena tarde, fijate que necesitamos tu ayuda, tiene relación con la carga de nuestro blog, en los ultimos 2 días ha estado muy lenta dicha carga, no sabemos a que pueda deberse, hice una revisión en busca de algo que pudiese causar dicho problema pero aun sigue igual a pesar de que quite algunos scripts que creimos que eran los culpables pero sigue igual, échale un vistazo por favor y nos cuentas por esta vía, sabemos que siempre encuentras una solución a nuestros problemas.
ResponderEliminarBuenas noches. Quizá sea tu conexión a Internet, porque cargué tu blog tres veces y las tres veces cargó a muy buena velocidad o.O
EliminarAh ok, muchas gracias, creimos que no era eso porque manejamos otro blog y ese si cargaba rapidito, entonces borre todo el historial del navegador, incluso probamos con otro navegador pero la diferencia en cargar continuaba, pero bueno ojala sea eso entonces, gracias como siempre, feliz día!
ResponderEliminarTienes razón, recien ingresamos nuevamente como cualquier otro lector y si cargó rápido, gracias nuevamente!
ResponderEliminarestamos en el 2012 jojo
ResponderEliminarHOLA
potro no sabras algo igual pero q solo sea para un gadget en specifico
No he entendido José, ni lo del año ni lo del gadget :/
EliminarHola Potro!!!
ResponderEliminarPodrías echarle un vistazo a mi blog para ver como consideras el tiempo de carga del mismo... Personalmente lo veo algo lento, ya me dirás
Gracias!!!
Hola JordanyPippen, a mí me ha cargado en buen tiempo, muy poco en realidad (en comparación con otros sitios), pero aun así no está de más que consideres eliminar cosas que no sean realmente útil, eso siempre debe hacerse aun cuando el blog cargue bien ;)
EliminarMil gracias como siempre!!!
EliminarLa imagen me queda estática!!!
ResponderEliminarEn el blog que aparece en tu perfil lo veo funcionando bien.
Eliminarffff nunca se me dio por guardar las imagenes sino copiarlas de tu blog y ahora parece que estan caidas :(
ResponderEliminarHola Juan David, ya he alojado nuevamente las imágenes, de cualquier manera te recomiendo que la alojes en tu propio hosting.
EliminarSaludos.
Hola potro alguna sujerencia para poner esto en mi web ... pero quisiera que saliera de primero sin que se muestre nada ... hasta que pase el tiempo que debe pasa que se quite y se ponga la web lo estoy haciendo en xhtml y css
ResponderEliminarpotro como pusistes ese boton anclado al rool over de tu blog ese que dice te gusta ciudad de blog que contiene un css cuando das click... haa y necesito ayuda con el botoncito cargando para mi web que esta en xhtml y css necesito que salga en toda la pantalla y solo el boton cargando
ResponderEliminarMira estas entradas Rudy:
Eliminarhttp://ciudadblogger.com/2011/03/precargar-el-blog-con-jquery.html
http://ciudadblogger.com/2012/01/botones-flotantes-para-recomendar-el.html
gracias por la ayuda ... soy nuevo por aqui y me ha servido de gran utilidad ciudad de bloger
EliminarPues bienvenido a Ciudad Blogger :)
Eliminarhay algo que no me gusta y es que sale el cuadrito al rededor como se quita eso?
ResponderEliminarSupongo que debe ser por algún estilo de tu plantilla, habría que ver en cuál blog lo has puesto.
EliminarHola potro gracias por la información, una pregunta si quiero colocar una imagen más grande que ocupe todo el ancho del blog con la misma función?
ResponderEliminarPuedes poner una imagen mucho más grande, pero eso perjudicaría la velocidad de carga del blog :/
EliminarHola, potro! xD
ResponderEliminarEh... Bueno, pues tengo una duda; ¿Por qué no sale nada?
Hice todos los pasos e hice exactamente como tú lo escribes aquí, pero no pasa nada, la barra no sale y todo está exactamente igual, como si no hubiera nada.
¿Me podrías ayudar? Gracias!
Recién llego a tu blog y parece que me servirá mucho! Saluditos *u*
Hola Keizzu, no mencionas en cuál blog lo pusiste, pero prueba poner el primer código antes de </body>
EliminarHola, no se si me podrias ayudar.
ResponderEliminarMi blog se carga bien, pero arriba en la barra superior, la ruedecita de descarga no deja de dar vueltas..¿me explico? ¿porque pasa esto?
Mi blog es http://elrefugiodelirtea.blogspot.com
Gracias
Hola Lirtea, entré a tu blog pero no he visto que hayas colocado el código de esta entrada por lo que no he podido verificar lo que mencionas.
Eliminarhola hola!! soy una seguidora en la sombra, ajaja bueno te comento hace mucho tiempo que uso ese script y me va de perlas, indudablemente, el problema es que e añadido otro efecto con text/javascript , que hace que las letras cambien de color que qeda bastante bien, y no me gustaría prescindir de ninguno de los dos, he estado mirando y por la red ponia algo de jQuery y de ponerle no.conflict , he modificado el codigo, le he hecho de todo y nada, alguna solución ? te paso mi blog por si quieres ver el problemita
ResponderEliminarhttp://nubilactica.blogspot.com.es/
Hola azucarilla azucarada, lo del no.conflict es sólo para cuando hay incompatibilidad entre jQuery y otras librerías como Mootools y Scriptaculous. ¿Cuál es el código que añadiste para las letras? ¿si quitas ese código funciona nuevamente este?
EliminarEfecto rainbow, para el titulo de mi blog
EliminarRainbow Text Effect (c)2003-12 mf2fm web-design http://www.mf2fm.com/rv
En los creditos del codigo pone esto por si sirve de ayuda...
Gracias por los detalles extra. He puesto en un blog de pruebas ambos scripts, primero puse después de <head> el de esta entrada, es decir, el de la barra "cargando", y luego antes de </head> puse el del efecto arcoiris y ambos han funcionando, con un poco de retardo pero funcionan sin problema.
Eliminar¿No has puesto algún otro código que podría afectar el de "cargando?
mmm antes del efecto rainbow funcionaba correctamente, fue al colocarlo, que vi que ya no iba... dejame ver si pongo cada uno en un lugar diferente aver si va..
Eliminarlos demas efectos si funcionan, tengo alguno mas por ahi y si van.
Pruebo y te comento Gracias!!
nada e probado colocando el de cargar desp. de Head y el de rainbow antes de /head y se qeda igual, le e quitado el efecto rainbow para comprobar nuevamente que sea esto, y directamente a funcionado sin problema ninguno.
EliminarEs extraño, quizá quieras probar otra opción que no use script, como este:
Eliminarhttp://www.oloblogger.com/2010/02/aviso-de-carga-solo-con-css.html
Gracias!! voy a echarle un vistazito =)
EliminarEXACTAMENTE HICE LO QUE DECIA EL POST, Y NO SE PUDO :( LO INTENTE 2 VECES Y NO.
ResponderEliminar