Este scroll de bienvenida está hecho a base de un script que hará que se muestren líneas de mensajes con las letras apareciendo como si se estuvieran redactando con una máquina de escribir.
Sólo entra a Diseño | Añadir un gadget | HTML/Javascript y ahí pega lo siguiente:
<script>
//Secify scroller contents
var line=new Array()
line[1]="Este es un scroll muy útil para dar la bienvenida..."
line[2]="Y motrar noticias relevantes a tus lectores..."
line[3]="Puedes configurarlo para poner el mensaje que quieras..."
line[4]="Quieres uno...?"
line[5]="CiudadBlogger.com"
line[6]="..."
//Specify font size for scoller
var ts_fontsize="12px"
//--Don't edit below this line
var longestmessage=1
for (i=2;i<line.length;i++){
if (line[i].length>line[longestmessage].length)
longestmessage=i
}
//Auto set scroller width
var tscroller_width=line[longestmessage].length
lines=line.length-1 //--Number of lines
//if IE 4+ or NS6
if (document.all||document.getElementById){
document.write('<form name="bannerform">')
document.write('<input type="text" name="banner" size="'+tscroller_width+'"')
document.write(' style="background-color: '+document.bgColor+'; color:#000000; font-family: verdana; font-size: '+ts_fontsize+'; font-weight:bold; border: medium none" onfocus="blur()">')
document.write('</form>')
}
temp=""
nextchar=-1;
nextline=1;
cursor="]"
function animate(){
if (temp==line[nextline] & temp.length==line[nextline].length & nextline!=lines){
nextline++;
nextchar=-1;
document.bannerform.banner.value=temp;
temp="";
setTimeout("nextstep()",3000)}
else if (nextline==lines & temp==line[nextline] & temp.length==line[nextline].length){
nextline=1;
nextchar=-1;
document.bannerform.banner.value=temp;
temp="";
setTimeout("nextstep()",1000)}
else{
nextstep()}}
function nextstep(){
if (cursor=="\\"){
cursor="|"}
else if (cursor=="|"){
cursor="/"}
else if (cursor=="/"){
cursor="-"}
else if (cursor=="-"){
cursor="\\"}
nextchar++;
temp+=line[nextline].charAt(nextchar);
document.bannerform.banner.value=temp+cursor
setTimeout("animate()",25)}
//if IE 4+ or NS6
if (document.all||document.getElementById)
window.onload=animate
</script>
Cambia lo que está en color rojo por el mensaje que quieras. Si necesitas más líneas de mensaje sólo agrega una igual usando un número consecutivo (7,8,9,etc.)
Para modificar el tiempo que tarda cada mensaje cambia el número 3000 que está en verde, en este caso 3000 representa 3 segundos, si deseas más tiempo sólo modifica en milisegundos el tiempo que deseas.
Lo que está en color azul es el color del texto, puedes cambiarlo por el que quieras.
Puedes ver un ejemplo funcionando en este blog de pruebas.
jajajajaja... esta muy bueno!!!
ResponderEliminarMe gustó mucho el cursor del vaquero también.
Un abrazo!!!!
El vaquero soy yo =)
ResponderEliminarUn día tendré que dejar el cowboy style, mis vecinos ya me ven feo, jaja.
Un abrazo.
jajajajajajaja.... si, a mi me ha quedado grabada la foto que subiste en la red de Jorge con el sombrero. Esa no cha debes haber ganado muchas mujeres con esa pinta. jajajaja.
ResponderEliminarUn abrazo!!!!
Upppsss perdon! quise poner "noche".
ResponderEliminarQuisiera poder recordar cómo me fue esa noche...maldito alcohol, jajaja.
ResponderEliminarUn abrazo.
amigos de cuidadblogger les pido ayuda intente agregar este entretenido scroll pero no me funciona onda me marca como agregado en html pero no me aparece lo q escribo y por desgracia no es la primera ves q me pasa esta al igual q con la nube de etiquetas en movimiento me sucede lo mismo lo hago tal cual como se explica en los 2 casa y nada lo intento con google chrome con firefox y nada incluso lo intento en un segundo blog q tengo para pruebas y al = nada les pido su ayuda para solucionar este problema por favor si es q no es mucha la molestia de antemano gracias y gracias por los demás trucos q si me an funciona excelente pag
ResponderEliminarPotro:
ResponderEliminarMe gusto mucho, y no te rias, voy a intentar hacerlo, jajaajjja, espero me salga.-
Me gusto mucho
Anne
Hola The Deadboy,
ResponderEliminarNo sé si te he entendido bien, ¿los elementos HTML te aparecen vacíos después de haber agregado algo?
Prueba borrando el caché, historial y cookies del navegador.
Saludos.
Hola Anne,
ResponderEliminarSé que te saldrá bien, tengo fe en ti, jaja.
Saludos.
Que bueno
ResponderEliminarme servira para poner las ultimas noticias
saludos
Hola el venado,
ResponderEliminarOjalá te sea de mucha utilidad.
Saludos.
Pero donde hay que pegar el codigo, en edicion de HTML o en un elemento HTML/Javascript
ResponderEliminarUps, no había visto que redacté mal ese detalle, es en un elemento HTML/Javascript.
ResponderEliminarSaludos.
Amigo No me sale
ResponderEliminarHola Dr. Víctor,
ResponderEliminarEste script es un poco delicado, por lo que si lo pones cerca de otro no sale, al igual si tienes muchos scripts en tu blog tampoco saldrá
:S
Saludos.
Mil disculpas a todos, faltaba una diagonal al script y por eso no estaba funcionando.
ResponderEliminarA todos los que no les salía, copien el código de nuevo, ya no deben tener problemas.
Gracias y disculpas nuevamente.
Gracias.
ResponderEliminarAhora si esta funcionando
Ahora recuerdo lo del banner cambiante, esta bien siguelo publicando.
Saludos.
Vale el venado, ya está.
ResponderEliminarSaludos.
Ummm, me salio!!!!!!!!, potro, y sin mirar , todos los mensajes posteriores al mio, se ve que las dos neuronas, que me quuedan, sanas me funcionaron, . . . graciassss,
ResponderEliminarpor tener fe en mi.-
Cariños
Anne
Hola Anne,
ResponderEliminarSabía que podrías!
Gracias por los cariños.
Saludos.
hola que tal no soy un buen programador en html asi que me podrian ayudar un poco?. resien estoy creando mi blogspot y no tengo mucha idea de como hacerlo. el script del scroll esta muy bueno pero no se donde colocarlo dentro del codigo html. y tengo una dudas bastante grande, kiero crear una entrada dentro de otra entrada como por ejemplo una foto de una peli con un enlace y que ese enlace me lleve a un sitio con una breve reseña de esa peli pero dentro del mismo blogspot. les agredeceria enormemente.
ResponderEliminarHola Josue,
ResponderEliminarQué bueno que te animaste a abrir un blog, en lo que pueda trataré de ayudarte.
El código del scroll debes pegarlo entrando en Diseño > Elementos de la página > Añadir un gadget y seleccionas HTML/Javascript, ahí pegas el código.
Lo segundo se me ocurre que podrías aprovechar la plantilla que tienes y poner las fotos que dices en la barra lateral como las que tienes, y esas que enlacen a la entrada con la reseña, si te parece bien esa idea me dices y te explico cómo hacerlo.
Saludos.
Esta buena tu idea me gusta, podrias explicame y te doy un ejemplo mas o menos a lo que me referia con mis dudas de un blog http://sdd-fanatico.blogspot.com/ para que mas o meno veas a o lo ke me referia. mi blog no se trata de peliculas es mas social y cultural.
ResponderEliminarHola Josue,
ResponderEliminarLo que podrías hacer es esto, entra a Diseño > Elementos de la página > Añadir un gadget, y selecciona Imagen, ahí escribe el título y donde dice Enlace pos la URL de la entrada. Haz lo mismo para todas las entradas que quieras relacionar con una imagen. De este modo tus lectores cuando den click sobre la foto verán la entrada que quieres.
Saludos.
Gracias El Potro me salvaste jejeje.
ResponderEliminarahora estoy buscando como solucionar un problema con los comentarios. porque cuando se ingresa un comentario se repite dos veces las verdad no se como configurarlo. si me das una mano con eso te lo agradeceria mucho
Hola Josue,
ResponderEliminarParece ser un error de la plantilla, lo más conveniente sería que subas de nuevo la plantilla en tu blog y probar si con eso se arregla. Eso sí, perderás los cambios que hayas hecho anteriormente.
Saludos.
Hola. Puse todo eso en un elemento HTML/Javascript y me sale el scroll de bienvenida pero con el fondo azul oscuro por lo que no se lee bien ya que esta escrito en negro, ¿cómo puedo poner el fondo blanco u otro color más claro?
ResponderEliminarSoy nuevo en todo esto, me puedes decir como quitar el recuadro que queda entre entrada y entrada (separandolas) donde suele aparecer publicado por... Pues me gustaría saber poder quitarlo o ponerlo del mismo color que el fondo de las entradas...
Muchas gracias.
Hola Jorge,
ResponderEliminarEste script no puede cambiarse el color de fondo ni de texto, más adelante publicaré alguno que tenga estas características, por lo pronto puedes ver este link donde puedes hacer algo parecido pero con efecto arcoiris.
Por lo demás necesito saber cuál es tu blog para tener más datos y poder ayudarte.
Saludos.
solo reemplazar:
Eliminarbackground-color: '+document.bgColor+'; color:#000000
por:
background-color:#000000; color:#ffffff
saludos!!!
Hola. Ya lo solucioné, como vi que el fondo del texto se veia azul oscuro pensé que sería del fondo de la plantilla original el cual lo tengo modificado, entonces me fui a body { background:#123; y modifiqué el código del color y solucionado.
ResponderEliminarPara la otra duda que tengo te mando mail al mail de admin que aparece en contacto, a ver si me puedes ayudar.
Saludos, muchas gracias
hola. muchas gracias por este es scroll me gusto mucho ademas de ser muy interesante
ResponderEliminarPd: te invito a mi blog para que me des tu opinion como quedo..
saludos!!
solovampiros y misterio,
ResponderEliminarMuy bueno el diseño pero el azul del texto de las entradas hace que no se distinga lo que dice, lastima un poco la vista. Fuera de eso me gusta el diseño.
Saludos.
Porque me sale en la linea numero 6 al final del texto lo siguiente.…
ResponderEliminarLos puntos suspensivos son para dejar un poco de espacio y dar tiempo entre cada vez que aparecen los mensajes, pero igual puedes modificarlo por otro texto si lo deseas.
ResponderEliminarSi me funciono! gracias ;)
ResponderEliminarA ti por tu visita :)
ResponderEliminarNecesito Saber como le puedo cambiar el color a las letras del Scroll
ResponderEliminarBusca esta parte del código:
ResponderEliminarstyle="background-color: '+document.bgColor+'; color: '+document.body.text+';
Y cámbialo por esto:
style="background-color: '+document.bgColor+'; color:#FF00FF;
Eso que está en negrita es el código del color, elige el código del color que quieras.
Nadie preguntó cómo se CENTRA todo esto. Como lo quiero debajo del menú -que hasta ahora no se cómo arreglarlo, por eso pedí tu ayuda, Potro-, quiero que este centrado y no del lado izquierdo. ¿Qué código se coloca?.
ResponderEliminarSe hace del mismo modo que se alinean todos los elementos, puedes verlo aquí.
ResponderEliminarMe quedó super
ResponderEliminarpueden verlo en:
http://www.edengonzalez.com/
Este comentario ha sido eliminado por el autor.
ResponderEliminarHola Potro, he conseguido dejar el scrool en transparente, ademas de cambiar el tamaño y color.
ResponderEliminarLo que no consigo es centrar el texto a no ser que sea desplazando ( creando espacios ), no se si tendras alguna solucion. Te adjunto un enlace de la captura del codigo modificado.
Un abrazo y felices navidades a todos/as los ciudad-blogeros.
http://lh5.ggpht.com/_9qZScR42z3g/TQf_mbiIQUI/AAAAAAAANog/qIZgOD3cS8Q/2010-12-15_003612.png
Busca donde dice font-weight:bold; y justo después de ello agrega esto:
ResponderEliminartext-align:center;
Saludos y felices fiestas!
Gracias Potro, JO... eres un hacha. Eternamente agradecido, la verdad es que siempre das en la Diana.
ResponderEliminarBueno vale ya!!! no vaya a ser que la gente piense lo que no es.jajajajaja.
Pues lo dicho, que pases muy Felices Navidades en compañia de los tuyos.
Un abrazo
Gracias, igualmente :)
ResponderEliminarGracias por el truco. Lo he puesto en mi blog y funciona. Es una maravilla.
ResponderEliminarUn saludo
Qué bueno que te ha funcionado :)
ResponderEliminarHola! Y en que momento aparece mi blog? Puedo hacer algo así pero con una imagen? es decir, que no salga nada más que mi imagen, y al darle click o pasar ciertos segundos, aparesca mi blog completo...
ResponderEliminarEn el otro comentario te he respondido a la misma pregunta. Saludos.
ResponderEliminarHOla Potro!!!
ResponderEliminarPero cuando estoy en el blog de prueba que has hecho, ¿cómo se sale del mensaje??
Gracs
No he entendido la pregunta :/
ResponderEliminarQuiero decir;
ResponderEliminarcuando pruebo lo del mensaje en el "blog de pruebas" que has puesto, me aparece una pantalla blanca y el mensaje arriba va saliendo. Me refería a cómo se pasa de esa página blanca con el mensaje al blog. ¿O es que eso ya es el blog?
No sé si mexplico ;(
Gracs majo
Ese es el blog de pruebas, sólo que lo puse de modo que sólo se viera el mensaje sin nada de entradas, cabecera o demás gadgets, pues como tenía más cosas en ese blog de pruebas los lectores se confundían un poco para encontrar el scroll de ejemplo.
ResponderEliminarah vale jajajajaj pensaba que era el mensaje previo al blog (que es lo que quería yo jeje)
ResponderEliminargracs Potro majo
Hola Potro, Me imagino que te pedire rizar el rizo. Bueno se podria poner que cuando salga el texto,este tenga un enlace para que redireccione a otro sitio. Te digo esto porque es un scrool que me encanta,precisamente es de los artilugios que ya tengo fijos en mi blog, pero... haber si se podria hacer lo que te digo. Un abrazo
ResponderEliminarMe temo que no es posible con este script PC :(
ResponderEliminarGracias Potro, algo asi me temia. Bueno todo no puede ser. Un abrazo
ResponderEliminarNo puedo cambiar el fondo blanco por n fondo negro? ya intente pero solamente la letra es la que cambia de color
ResponderEliminarBusca esta parte en el script:
ResponderEliminarbackground-color: '+document.bgColor+';
Y cámbialo por esto:
background-color: #000;
Hola El Potro! Es la primera vez que te escribo aunque te sigo desde hace un tiempo. Estaba buscando a ver si encontraba alguna entrada relacionada con scroll bar y he dado con esta. Verás, va con este tema pero es diferente. Cada vez que cargo mi blog, (todavía está en pruebas y no es público) ya sea la primera que se abre o cuando le das a f5, da lo mismo, siempre se me posiciona (la barra de desplazamiento lateral, que creo que se dice scroll bar) casi abajo del todo del blog. Y no sé cómo conseguir que se quede arriba como tendría que ser, y ahorrar las molestias de estar cada vez que actualizas, pinchando en la barra para desplazarte hasta arriba y empezar a leer. No sé si me he explicado muy bien ;) pero creo que sólo tú podrías ayudarme...eres una "enciclopedia" viviente...jejejeje.
ResponderEliminarSaludos!
Hola Dos de viaje,
ResponderEliminarDe hecho no creo ser una enciclopedia viviente porque no he sabido antes de un caso como el que mencionas. Yo sé que está en un blog de pruebas, pero necesitaría saber la URL para poder ingresar y ver si logro detectar el problema.
De cualquier forma, ¿ya probaste ingresar desde otro navegador?
¡Saludos!
Ok. Gracias. Si puedes echarle un vistazo es dosdeviaje.blogspot.com
ResponderEliminarEs extraño... ¿recuerdas desde cuándo abre así la página? Intenta quitar los gadgets de los contadores y del mapa, sólo a modo de prueba por si alguno de esos scripts fuera el causante.
ResponderEliminarHas dado en el clavo! He quitado primero el gadget de google del mapa y problema solucionado! Ese era el problema.
ResponderEliminarMuchas gracias El Potro! Maestro! ;)
se puede fucionar con el tutorial de un intro para el blog??
ResponderEliminarNo creo, pero si usas el atributo MARQUEE tendrás un resultado parecido y ese sí es aceptable en el intro:
ResponderEliminarhttp://ciudadblogger.com/2009/10/scroll-de-bienvenida-sin-script.html
Hola Potro! lo primero es agradecerte una vez más, porque casi todas las configuraciones nuevas que he agregado en el blog que estoy haciendo (el cual es un portal de noticias)las he conseguido en su mayoría aquí, y muy bien explicado de tu parte, además. Estoy realmente fascinada con tu blog y bueno, quería darte las gracias por compartir generosamente tu conocimiento.
ResponderEliminarY lo segundo sería una duda que tengo para usar este scroll. Yo hice una clasificación de noticias para que todas las cosas con la etiqueta eventos aparezca en un gadget aparte, en la columna derecha (esto también te lo debo a ti, jejej), y quisiera aplicarle el scroll a esa sección de noticias.
El código del elemento de página, como recordarás, es este:
"... type='text/javascript'>var numposts = 10;var showpostthumbnails = false;var displaymore = false;var displayseparator = true;var showcommentnum = false;var showpostdate = false;var showpostsummary = true;var numchars = 100;...>
<...type="text/javascript" src="/feeds/posts/default/-/Eventos?published&alt=json-in-script&callback=labelthumbs">..."
Se puede adaptar este scroll a esa sección?
De antemano muchas gracias Potro y disculpa las molestias.
:)
Muchas gracias por tu comentario Tinta de Cuervos, qué gusto que estés encontrando aquí cosas de tu interés para tu blog :)
ResponderEliminarLamentablemente no puede incorporase de esa manera dentro de otro gadget, este scroll al igual que la gran mayoría trabajan de forma independiente y sólo se les puede añadir un texto y nada más :(
Buen inicio de semana!
Gracias amiguito, seguiré buscando a ver cómo hacer un scroll con los post de una etiqueta en particular, pero igual me mantengo por acá, tu espacio es genial! :)
ResponderEliminarPuedes poner en scroll el título de un gadget, eso sí. No sé si es a lo que te has referido antes. Si es así, entonces con los artilugios expandidos localiza esta parte que está en el gadget al que quieres ponerle el efecto:
ResponderEliminar<h2 class='title'><data:title/></h2>
Y cámbialo por esto:
<marquee><h2 class='title'><data:title/></h2></marquee>
Eso hará que el título de ese gadget se mueva en marquesina.
Gracias, seguro que ese dato me va a ser de utilidad para otros widgets.
ResponderEliminarEn este caso en realidad estoy buscando hacer una especie de marquee vertical en un widget como el de noticias recientes, por ejemplo.
Si logro conseguir la info te la paso igual, :)
Mira esta entrada, quizá te sirva:
ResponderEliminarhttp://ciudadblogger.com/2009/05/links-y-banners-en-movimiento.html
gracias bastante util
ResponderEliminarPotro, gracias por todo.
ResponderEliminarNo hay forma de poner este scroll en la plantilla para ubicarlo donde mas convenga???
Supongo que sí, sólo cambia esto:
Eliminar<script language="javascript" type="text/javascript">
Por esto:
<script>
//<![CDATA[
Y esto:
</script>
Por esto:
//]]>
</script>
Lo coloque dentro de un div para colocarlo y perfecto.
EliminarAhora me surge un problemilla con el script de los enlaces externos en ventana nueva.
Con este script dentro de la plantilla los enlaces externos no se abren en una nueva ventana ¿Alguna solución?
No debería haber problema, manejan funciones distintas :s
EliminarMil Gracias¡¡ Voy a probarlo, crack
ResponderEliminarMuchas gracias, Potro¡ Voy a probarlo. Mil Gracias
ResponderEliminarMil Gracias¡¡ Voy a probarlo, crack
ResponderEliminarY para acabar de rematarlo, Potro. Como podría meterle a este script margin-top y margin-left??? Gracias
ResponderEliminarEnciérralo en un DIV y dentro de ese DIV ponle los estilos que quieras.
EliminarHOLA TALVEZ ME PODRIAS AYUDAR UN CUADRO DE NOTICIAS CON MOVIMIENTO CORREO: dancehallcr@gmail.com
ResponderEliminarQuizá este te pueda servir:
Eliminarhttp://ciudadblogger.com/2010/08/anuncios-rotativos-con-jquery.html
Hola! quiero colocar un cuadro de noticias, pero no es que este ligado a un diario por ej, sino que yo pueda colgar las notas que quiero, se entiende?
ResponderEliminarHay varias opciones, esta es una de ellas:
Eliminarhttp://ciudadblogger.com/2010/08/anuncios-rotativos-con-jquery.html
Hola. Quisiera poner un scroll a un gadget. Que debo hacer? Gracias de antemano
ResponderEliminarHola Mario, el scroll se pone justamente en un gadget, a no ser que te refieras a otra cosa.
Eliminarpuedo colocar enlaces? y de que modo xD que le puse el a href y no sirvio :c
ResponderEliminarNop, no se pueden poner enlaces.
EliminarESTE CODIGO PARA CAMBIAR EL FONDO POR COLOR NEGRO EXACTAMENTE COMO LO PONGO :background-color: #000;
ResponderEliminarYA LO HICE Y NO ME SALE NADA JEJEJEJE
Exactamente así, pero sin los dos puntos al inicio :)
EliminarHola, Potro. Últimamente estoy retocando el blog y, como siempre, tu blog es una fuente inagotable de recursos/ideas. He utilizado el script de este mensaje sin problemas y se me ha ocurrido añadirle una imagen a la izquierda del campo donde aparece el texto pero no atino. En el script quiero que aparezcan las últimas noticias relacionadas con el tema de mi blog y lo que quiero es poner una imagen a la izquierda que diga algo así como "últimas noticias". Sé que podría ponerlo en el título del gadget pero lo tengo sin título por temas estéticos. Gracias de antemano.
ResponderEliminarGracias por tu comentario :)
EliminarHay varias formas de hacerlo, la que se me ocurre ahora mismo es usar una tabla HTML y dentó de ella puedes poner tanto la imagen como el script:
<table border="0">
<tr>
<td><img src="URL de la imagen" border="0" /></td>
<td> ...Aquí el código del script... </td>
</tr>
</table>
Se me pasó por la cabeza utilizar una tabla pero algo hacía mal en los intentos que hice. He hecho la prueba con el código que pusiste y ¡voila! Ha funcionado a la primera. No sé lo que haríamos sin ti, Potro. Una vez más, y no sé cuántas van, muchísimas gracias.
EliminarEs un gusto poder ayudarte :)
EliminarBusca esta parte del script:
ResponderEliminarbackground-color: '+document.bgColor+'; color:#000000;
Justo antes de ese background-color agrega esto:
height: 35px;
Ese valor lo puedes modificar por cualquier otro. Si quisieras cambiar también lo largo, agrega esto:
width: 800px;
Con todos los navegadores siempre hay algún detalle que no se ve igual :/
ResponderEliminarDuda, se puede poner que si el texto supera el ancho que has puesto....se haga una segunda linea? automaticamente?
ResponderEliminarhttp://football-afa.blogspot.com.es/
Por cierto...en firefox se ve bien, pero es posible que en Chrome me tarde demasiado en cargar o que no me cargue? puede ser que por ese motivo el widget que tengo con la pagina de facebook tampoco cargue? es decir...es a raiz de incorporar el Scroll?
Eliminar