AGREGA ACCESORIOS

Cuenta Regresiva para "FECHAS IMPORTANTES"

jueves, abril 19, 2007

Este código Funciona para explorer y Firefox. Para tener nuestra cuenta regresiva solo vamos a la parte de la plantilla, en la que desplegaremos el código, y listo copiamos todo el código ahi:
.
Este es el código que debemos copiar:



<br /><form name="count"><br /><input name="count2" size="32" type="text"/><br /></form><br /><br /><br /><script><br /><br />/*<br />Count down until any date script-<br />By JavaScript Kit (www.javascriptkit.com)<br />Over 200+ free scripts here!<br />*/<br /><br /><br />//change the text below to reflect your own,<br />var before="Mi Cumpleaños!"<br />var current="Hoy es Mi Cumpleaños!"<br />var montharray=new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec")<br /><br />function countdown(yr,m,d){<br />theyear=yr;themonth=m;theday=d<br />var today=new Date()<br />var todayy=today.getYear()<br />if (todayy < 1000)<br />todayy+=1900<br />var todaym=today.getMonth()<br />var todayd=today.getDate()<br />var todayh=today.getHours()<br />var todaymin=today.getMinutes()<br />var todaysec=today.getSeconds()<br />var todaystring=montharray[todaym]+" "+todayd+", "+todayy+" "+todayh+":"+todaymin+":"+todaysec<br />futurestring=montharray[m-1]+" "+d+", "+yr<br />dd=Date.parse(futurestring)-Date.parse(todaystring)<br />dday=Math.floor(dd/(60*60*1000*24)*1)<br />dhour=Math.floor((dd%(60*60*1000*24))/(60*60*1000)*1)<br />dmin=Math.floor(((dd%(60*60*1000*24))%(60*60*1000))/(60*1000)*1)<br />dsec=Math.floor((((dd%(60*60*1000*24))%(60*60*1000))%(60*1000))/1000*1)<br />if(dday==0&&dhour==0&&dmin==0&&dsec==1){<br />document.forms.count.count2.value=current<br />return<br />}<br />else<br />document.forms.count.count2.value=" "+dday+ " días, "+dhour+" hrs, "+dmin+" min, y "+dsec+" seg " <br />setTimeout("countdown(theyear,themonth,theday)",1000)<br />}<br />//enter the count down date using the format year/month/day<br />countdown(2007,06,20)<br /></script><br />




Ahora en la penúltima línea del código, cambiamos la fecha countdown(2007,06,20), a la que cada uno necesite.



Yo realicé algunas modificaciones al código, ya que el mensaje que desplegaba estaba en ingles y era muy largo, pero si alguien lo necesita así, aquí se los dejo:



<br /><form name="count"><br /><input type="text" size="69" name="count2"><br /></form><br /><br /><br /><script><br /><br />/*<br />Count down until any date script-<br />By JavaScript Kit (www.javascriptkit.com)<br />Over 200+ free scripts here!<br />*/<br /><br /><br />//change the text below to reflect your own,<br />var before="Christmas!"<br />var current="Today is Christmas. Merry Christmas!"<br />var montharray=new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec")<br /><br />function countdown(yr,m,d){<br />theyear=yr;themonth=m;theday=d<br />var today=new Date()<br />var todayy=today.getYear()<br />if (todayy < 1000)<br />todayy+=1900<br />var todaym=today.getMonth()<br />var todayd=today.getDate()<br />var todayh=today.getHours()<br />var todaymin=today.getMinutes()<br />var todaysec=today.getSeconds()<br />var todaystring=montharray[todaym]+" "+todayd+", "+todayy+" "+todayh+":"+todaymin+":"+todaysec<br />futurestring=montharray[m-1]+" "+d+", "+yr<br />dd=Date.parse(futurestring)-Date.parse(todaystring)<br />dday=Math.floor(dd/(60*60*1000*24)*1)<br />dhour=Math.floor((dd%(60*60*1000*24))/(60*60*1000)*1)<br />dmin=Math.floor(((dd%(60*60*1000*24))%(60*60*1000))/(60*1000)*1)<br />dsec=Math.floor((((dd%(60*60*1000*24))%(60*60*1000))%(60*1000))/1000*1)<br />if(dday==0&&dhour==0&&dmin==0&&dsec==1){<br />document.forms.count.count2.value=current<br />return<br />}<br />else<br />document.forms.count.count2.value="Only "+dday+ " days, "+dhour+" hours, "+dmin+" minutes, and "+dsec+" seconds left until "+before<br />setTimeout("countdown(theyear,themonth,theday)",1000)<br />}<br />//enter the count down date using the format year/month/day<br />countdown(2002,12,25)<br /></script><br />



El tamaño del cuadro que se despliega lo cambian variando el siguiente número size="69".

Si no estan seguros en donde copiar este código revisen este otro post: Donde debo pegar el codigo de algo, para que quede en la sidebar??






Este otro código solo funciona para explorer, en firefox aparece otra cosa nada que ver :(.

Si necesitan recordarles a sus visitantes alguna fecha importante, eventos o cualquier otra idea que tengan, a mi parecer esta es la mejor manera, "Una Cuenta Regresiva", ya que los post pasan, y la gente se olvida, en cambio una cuenta regresiva, estará todo el tiempo que necesitemos en el blog.



Primero debemos colocar este código sobre la etiqueta </head> ubicada en la plantilla del blog.



<br /><!-- Mas trucos y scripts en http://www.javascript.com.mx --><br /><SCRIPT LANGUAGE="JavaScript"><br /><!-- <br />function getRemaining() {<br /> today = new Date();<br /> targetdate = new Date("June 20, 2007"); <br /> targetdate.setYear(today.getYear()); <br /> milliseconds = (24 * 60 * 60 * 1000);<br /> remaining = ((targetdate.getTime() - today.getTime()) / milliseconds); <br /> remaining = Math.round(remaining);<br /> }<br />// --><br /></SCRIPT><br />



La fecha que yo quiero resaltar es Junio dia 20, año 2007. Ustedes simplemente cambian este dato por el de ustedes.



Ahora vamos al lugar en donde quieren que aparesca el aviso, en mi caso lo deje en la columna izquierda parte superior.



<br /><SCRIPT LANGUAGE="JavaScript"><br /><!-- <br />getRemaining(); <br />document.write("Faltan ",remaining," dias para mi cumpleaños!");<br />// --><br /></SCRIPT><br />



El tipo de aviso lo cambian en la línea donde aparece el código document.write, si no estan seguros en donde copiar este código revisen este otro post: Donde debo pegar el codigo de algo, para que quede en la sidebar??

Blogalaxia Tags:
Utiles  
Enchular  
Regresiva  
Accesorios  

 

Patricia Ramírez at 1:00:00 PM | Permalink   

  View blog reactions

Buscador

lunes, enero 22, 2007

Para colocar un buscador simple en el blog, que sea solo de búsqueda dentro de nuestro blog, solo deben pegar éste código en la sidebar:

<form name="b-search" action="http://search.blogger.com/"><br /><input type="text" id="b-query" name="as_q"><br /><input type="hidden" name="ie" value="UTF-8"><br /><input type="hidden" name="ui" value="blg"><br /><input type="hidden" name="bl_url" value="agregafotos.blogspot.com"><br /><input type="submit" value="go" alt="Search This Blog" id="b-searchbtn" title="Search this blog with Google Blog Search" onclick="document.forms['b-search'].bl_url.value="><br /></form>

Lo único que deben cambiar es la direccion donde dice "agregafotos.blogspot.com" por la dirección de su blog.

Y eso es todo, asi de facil.

Suerte!!!

Blogalaxia Tags:
Blogger  
Buscadores  
Accesorios  
Utiles  

 

conely at 1:23:00 AM | Permalink   

  View blog reactions

Letras Brillantes con Efecto

domingo, noviembre 26, 2006

Esta pagina Glittergraphics tiene 28 estilos de letras para los que le gustan estas monadas.. :)

Solo deben escribir el texto que quieren y seleccionar el estilo que les gusta.

Este es el estilo 13, y ellos entregan el siguiente código.




<br /><MARQUEE WIDTH="100%" BEHAVIOR="scroll" SCROLLAMOUNT="5" DIRECTION="left"><br /><a href="http://www.glittergraphics.us" target="_blank"><img src="http://i72.photobucket.com/albums/i185/glittergus/alph/13/b.gif" border="0" alt="Myspace Glitter Graphics, MySpace Graphics, Glitter Graphics"></a><br /><a href="http://www.glittergraphics.us" target="_blank"><img src="http://i72.photobucket.com/albums/i185/glittergus/alph/13/i.gif" border="0" alt="Myspace Glitter Graphics, MySpace Graphics, Glitter Graphics"></a><br /><a href="http://www.glittergraphics.us" target="_blank"><img src="http://i72.photobucket.com/albums/i185/glittergus/alph/13/e.gif" border="0" alt="Myspace Glitter Graphics, MySpace Graphics, Glitter Graphics"></a><br /><a href="http://www.glittergraphics.us" target="_blank"><img src="http://i72.photobucket.com/albums/i185/glittergus/alph/13/n.gif" border="0" alt="Myspace Glitter Graphics, MySpace Graphics, Glitter Graphics"></a><br /><a href="http://www.glittergraphics.us" target="_blank"><img src="http://i72.photobucket.com/albums/i185/glittergus/alph/13/v.gif" border="0" alt="Myspace Glitter Graphics, MySpace Graphics, Glitter Graphics"></a><br /><a href="http://www.glittergraphics.us" target="_blank"><img src="http://i72.photobucket.com/albums/i185/glittergus/alph/13/e.gif" border="0" alt="Myspace Glitter Graphics, MySpace Graphics, Glitter Graphics"></a><br /><a href="http://www.glittergraphics.us" target="_blank"><img src="http://i72.photobucket.com/albums/i185/glittergus/alph/13/n.gif" border="0" alt="Myspace Glitter Graphics, MySpace Graphics, Glitter Graphics"></a><br /><a href="http://www.glittergraphics.us" target="_blank"><img src="http://i72.photobucket.com/albums/i185/glittergus/alph/13/i.gif" border="0" alt="Myspace Glitter Graphics, MySpace Graphics, Glitter Graphics"></a><br /><a href="http://www.glittergraphics.us" target="_blank"><img src="http://i72.photobucket.com/albums/i185/glittergus/alph/13/d.gif" border="0" alt="Myspace Glitter Graphics, MySpace Graphics, Glitter Graphics"></a><br /><a href="http://www.glittergraphics.us" target="_blank"><img src="http://i72.photobucket.com/albums/i185/glittergus/alph/13/o.gif" border="0" alt="Myspace Glitter Graphics, MySpace Graphics, Glitter Graphics"></a><br /><a href="http://www.glittergraphics.us" target="_blank"><img src="http://i72.photobucket.com/albums/i185/glittergus/alph/13/s.gif" border="0" alt="Myspace Glitter Graphics, MySpace Graphics, Glitter Graphics"></a><br /></MARQUEE><br /><div align="right" style="position:absolute;z-index:9;right:0px;top:0px;width:88px;height:31px;"><br /><a href="http://www.glittergraphics.us/" target="_blank"><img src="http://i72.photobucket.com/albums/i184/fwlimages/bpgrafixad8831.gif" border="0"></a><br /></div><br />





Al copiarlo en un post se verá, así:(tambien pueden copiarlo en alguna parte de sus plantillas.)

Ahora explicaré como hacer algunos cambios en el codigo que ellos entregan, ya que aparece una imagen arriba del post, y todas las letras hacer referencia a la pagina de ellos.


La imagen que aparece arriba la pueden borrar eliminando el ultimo trozo del código:


<br /><div align="right" style="position:absolute;z-index:9;right:0px;top:0px;width:88px;height:31px;"><br /><a href="http://www.glittergraphics.us/" target="_blank"><br /><img src="http://i72.photobucket.com/albums/i184/fwlimages/bpgrafixad8831.gif" border="0"><br /></a><br /></div><br />





Ademas cada una de las letras hace referencia a la pagina de ellos, se pueden dar cuenta si pasan el mouse por sobre las letras.... Este es el codigo de una letra completa:




<br /><a href="http://www.glittergraphics.us" target="_blank"><br /><img src="http://i72.photobucket.com/albums/i185/glittergus/alph/13/o.gif" border="0" alt="Myspace Glitter Graphics, MySpace Graphics, Glitter Graphics"><br /></a><br />





Lo que deben hacer es dejar solo el codigo de la imagen siguiente para cada una de las letras, eliminando la referencia:




<br /><img src="http://i72.photobucket.com/albums/i185/glittergus/alph/13/o.gif" border="0" alt="Myspace Glitter Graphics, MySpace Graphics, Glitter Graphics"><br />





Entonces se vera de la siguiente forma:






Entonces ahora si ponen el cursor sobre las letras ya no aparece la referencia.. :)



Asi quedaría el código si eliminan la referencia, y la imagen que aparece arriba del post:


<br /><MARQUEE WIDTH="100%" BEHAVIOR="scroll" SCROLLAMOUNT="5" DIRECTION="left"><br /><img src="http://i72.photobucket.com/albums/i185/glittergus/alph/13/b.gif" border="0" alt="Myspace Glitter Graphics, MySpace Graphics, Glitter Graphics"><br /><img src="http://i72.photobucket.com/albums/i185/glittergus/alph/13/i.gif" border="0" alt="Myspace Glitter Graphics, MySpace Graphics, Glitter Graphics"><br /><img src="http://i72.photobucket.com/albums/i185/glittergus/alph/13/e.gif" border="0" alt="Myspace Glitter Graphics, MySpace Graphics, Glitter Graphics"><br /><img src="http://i72.photobucket.com/albums/i185/glittergus/alph/13/n.gif" border="0" alt="Myspace Glitter Graphics, MySpace Graphics, Glitter Graphics"><br /><img src="http://i72.photobucket.com/albums/i185/glittergus/alph/13/v.gif" border="0" alt="Myspace Glitter Graphics, MySpace Graphics, Glitter Graphics"><br /><img src="http://i72.photobucket.com/albums/i185/glittergus/alph/13/e.gif" border="0" alt="Myspace Glitter Graphics, MySpace Graphics, Glitter Graphics"><br /><img src="http://i72.photobucket.com/albums/i185/glittergus/alph/13/n.gif" border="0" alt="Myspace Glitter Graphics, MySpace Graphics, Glitter Graphics"><br /><img src="http://i72.photobucket.com/albums/i185/glittergus/alph/13/i.gif" border="0" alt="Myspace Glitter Graphics, MySpace Graphics, Glitter Graphics"><br /><img src="http://i72.photobucket.com/albums/i185/glittergus/alph/13/d.gif" border="0" alt="Myspace Glitter Graphics, MySpace Graphics, Glitter Graphics"><br /><img src="http://i72.photobucket.com/albums/i185/glittergus/alph/13/o.gif" border="0" alt="Myspace Glitter Graphics, MySpace Graphics, Glitter Graphics"><br /><img src="http://i72.photobucket.com/albums/i185/glittergus/alph/13/s.gif" border="0" alt="Myspace Glitter Graphics, MySpace Graphics, Glitter Graphics"><br /></MARQUEE><br />





Espero que les guste.

Blogalaxia Tags:
trucos  
letras  
efectos  
enchular  

 

Patricia Ramírez at 11:15:00 AM | Permalink   

  View blog reactions

Al fin un Chat Bastante Bueno... Ya se pueden registrar

viernes, noviembre 24, 2006

Al fin, espero que les guste..Aqui les dejo una imagen para que lo vean.






Primero deben registrarse:





No es obligacion completar todos los datos, obviamente los principales son el User name o nick, y el password...



Una vez que ya esten registrados, con su username y password, podran ingresar desde el formulario de la columna izquierda del blog, completando los datos (username y password) y pinchando sobre el boton Ingresar al Chat.


La primera linea sirve para ver si hay alguien en el chat, asi no tienen que estar entrando a cada rato, para ver si hay gente..


Es casi completamente configurable, sonido, tamaño letras, colores de todo lo que quieran, asi que lo pueden dejar al gusto de cada uno.



Realmente creo que es demasiado chat, para lo poco que cuesta, solo 5 dolares, esto lo compran una sola vez (para una pagina web), y todos los upgrades futuros, nuevas versiones, son gratis. Si quieren probarlo, comprarlo o revisar los otros scripts que venden por el mismo precio, pueden hacerlo a traves de esta imagen:










Hay otro modulo para el chat que lo compraré mas adelante, tiene un reproductor de musica, entre otras cosas.



Asi que desde ahora, ya pueden volver a chatear sin problemas. Ahi estaremos para ayudarlos. :)

 

Patricia Ramírez at 5:34:00 PM | Permalink   

  View blog reactions

Codigo para el Servicio, Recomienda Este blog !!

jueves, noviembre 09, 2006

Esto, me parece muy util, sobretodo, porque de cierta manera, si lo piensan es publicidad gratis, no hay mejor forma que los visitantes de sus blogs, los recomienden a sus amigos, y sus amigos, los recomienden a otros y asi susesivamente, de manera piramidal...jajaja


El servicio lo ofrece Bravenet, para los que no tienen una cuenta aqui, "pueden hacelo mediante este link="Bravenet(pasos explicados para obtener una cuenta aqui en este post:Post Anterior)



Este icono esta en el panel general:




yo ya lo tengo activado, pero ustedes lo tienen entre los iconos que estan bajo Unregistered Services, porque obviamente tuve que activarlo para hacer el post. :)






Pinchando en la imagen aparecen 1 o 2 pantallas mas, dependiendo de lo que estes activando, esta es la primera y siempre aparece: un tremendo boton..







y a veces tambien aparece esta, aqui tienen que activar la primera opcion, que siempre corresponde a la gratis:






Esto corresponde al panel de control del servicio y es lo que veran una vez que este instalado el servicio pinchando en el icono de arriba y activen el Tell-a-friend.




Cada vez que realizen un cambio en algo, y apreten sobre Save Changes, aparecera lo siguient, donde service manager, corresponde al panel de control del servicio, que es lo que se muestra en la imagen de arriba:






Como ven, las cosas que pueden modificar o ver son: las estadisticas, las opciones generales (general settings), y color & fonts



Esta opcion (recomendation message) no se puede cambiar, solo si pagas, asi que aunque cambies el texto no pasara nada.







Asi se ven las estadisticas, bastante util para saber si el botoncito sirve o no...






Aqui cambiamos el formato de la pantalla en donde se llenan los datos, para enviar el mensaje, los detalles estan explicados en la imagen:







Aqui se cambia el formato del color y el texto (color and fonts), detalles en la imagen:







Ya estamos listos,despues de guardar los cambios, pinchamos sobre service manager, y luego en copy-paste code, lo primero que aparece es la pagina a la que van a redireccionar una vez que se haya enviado el mail, obviamente es el blog de cada uno, si se equivocan y se dan cuenta de que una vez que envian el mail va hacia otra pagina, pueden editarlo directamente en el codigo, como lo explico en la imagen.





Finalmente todas estas son las opciones que tienen para dejar el servicio en sus blogs, a gusto del cliente, si tienen dudas respecto a donde pegar el codigo en la sidebar tal como yo lo deje, revisen este post, ¿donde debo pegar el codigo en la sidebar o barra lateral?.:

 

Patricia Ramírez at 9:44:00 AM | Permalink   

  View blog reactions

Imagen de Fondo para el Blog

sábado, octubre 28, 2006

Este es un aporte de tallarin :).

Bueno aveces queremos poner una imagen en el fondo de nuestros blogs pero no se puede por el simple hecho de que tienes que ubicar alguna parte de tu plantilla y no se que rollo pero ya se terminó, porque aquí esta la solución: solo tienes que poner este código entre <head> y </head> y donde dise AQUÍ TU ENLACE pones el enlace de tu imagen y listo tendrás una imagen en el fondo de tu blog aquí esta el codigo maravilloso: (hay unas contraindicaciones, que se detallan al final del post)



<br /><script language="JavaScript1.2"><br /><br />/*<br />Watermark Backgound Image Script- © Dynamic Drive (www.dynamicdrive.com)<br />For full source code, 100's more DHTML scripts, and TOS,<br />visit dynamicdrive.com<br />*/<br /><br />if (document.all||document.getElementById)<br />document.body.style.background="url(' AQUI TU ENLACE ') white center no-repeat fixed"<br /><br /></script><br />





Contraindicaciones:

Pero como no todo es perfecto tiene algunos problemas como por ejemplo:

1.-Si tu imagen es pequeña tal y como esta así se vera pequeña. La solución para esto es agrandar tu imagen al tamaño de todo tu blog y veras que todo te quedara bien.



2.-Otro de los problemas es que talvez tengas que cambiar algunos parámetros de tu blog como por ejemplo el color de las letras y cosas asi, espero que esto les sirva.

 

Patricia Ramírez at 1:19:00 AM | Permalink   

  View blog reactions

Ventana de Avisos Para tus Visitantes

viernes, octubre 27, 2006

Como la mayoria de los usuarios, no leen los avisos que estan en los post o en alguna parte de la sidebar o barra lateral, quizas les interese este código.

¿Que es lo que hace?, Aparece un cuadro flotante, con el mensaje que ustedes quieran, este mensaje se puede mover y también cerrar.

Aquí les dejo una imagen de como queda en el blog:



Lo dejaré en el blog de prueba para que lo vean.




Ahora los pasos para que lo hagan en sus blogs:

Paso 1:

Primero deben copiar el siguiente codigo entre las etiquetas <style> y </style>



<br /><!--<br /><br />/*Post-it note script- by javascriptkit.com<br />Visit JavaScript Kit (http://javascriptkit.com) for script<br />Credit must stay intact for use*/<br /><br />#postit{<br />position:absolute;<br />width:250; //ESTA LINEA CORRESPONDE AL ANCHO DEL AVISO<br />padding:5px;<br />background-color:lightyellow; //AQUI EN ESTA LINEA CAMBIAN EL COLOR POR EL DE USTEDES<br />border:1px solid black; //EN ESTA LINEA CAMBIAN EL COLOR DEL BORDE<br />visibility:hidden;<br />z-index:100;<br />cursor:hand;<br />}<br /><br />--><br />



y este segundo código entre las etiquetas <body> y </body>


<br /><!--COMIENZO DE LA LINEA EN DONDE PUEDEN CAMBIAR LA POSICION--><br /><div id="postit" style="left:180px;top:160px"><br /><!--FIN DE LA LINEA EN DONDE PUEDEN CAMBIAR LA POSICION--><br /><div align="right"><b><a href="javascript:closeit()">[Cerrar]</a></b></div><br /><br /><!--AQUI INSERTAN EL CONTENIDO DEL ANUNCIO(ESTO LO CAMBIAN POR LO QUE QUIEREN)--><br /><br /><b>Recordatorio:</b><br><br /><p><font size="2" face="Arial"><br /><a target="_new" href="http://ayudaparatublog.com/directorio">DIRECTORIO DE BLOGS</a><br><br />Si quieres mas visitas inscribe tu blog en nuestro directorio</font></p><br /><p> </p><br /><br /><!--FIN DEL CONTENIDO DEL ANUNCIO--><br /><br /></div><br /><br /><br /><br /><script><br /><br />//Post-it only once per browser session? (0=no, 1=yes)<br />//Specifying 0 will cause postit to display every time page is loaded<br />var once_per_browser=0<br /><br />///NO NECESITAN CAMBIAR NADA DE AQUI///<br /><br />var ns4=document.layers<br />var ie4=document.all<br />var ns6=document.getElementById&&!document.all<br /><br />if (ns4)<br />crossobj=document.layers.postit<br />else if (ie4||ns6)<br />crossobj=ns6? document.getElementById("postit") : document.all.postit<br /><br /><br />function closeit(){<br />if (ie4||ns6)<br />crossobj.style.visibility="hidden"<br />else if (ns4)<br />crossobj.visibility="hide"<br />}<br /><br />function get_cookie4(Name) {<br /> var search = Name + "="<br /> var returnvalue = "";<br /> if (document.cookie4.length > 0) {<br /> offset = document.cookie4.indexOf(search)<br /> if (offset != -1) { // if cookie4 exists<br /> offset += search.length<br /> // set index of beginning of value<br /> end = document.cookie4.indexOf(";", offset);<br /> // set index of end of cookie4 value<br /> if (end == -1)<br /> end = document.cookie4.length;<br /> returnvalue=unescape(document.cookie4.substring(offset, end))<br /> }<br /> }<br /> return returnvalue;<br />}<br /><br />function showornot(){<br />if (get_cookie4('postdisplay')==''){<br />showit()<br />document.cookie4="postdisplay=yes"<br />}<br />}<br /><br />function showit(){<br />if (ie4||ns6)<br />crossobj.style.visibility="visible"<br />else if (ns4)<br />crossobj.visibility="show"<br />}<br /><br />if (once_per_browser)<br />showornot()<br />else<br />showit()<br /><br /></script><br /><br /><script language="JavaScript1.2"><br /><br />//drag drop function for ie4+ and NS6////<br />/////////////////////////////////<br /><br />function drag_drop(e){<br />if (ie4&&dragapproved){<br />crossobj.style.left=tempx+event.clientX-offsetx<br />crossobj.style.top=tempy+event.clientY-offsety<br />return false<br />}<br />else if (ns6&&dragapproved){<br />crossobj.style.left=tempx+e.clientX-offsetx<br />crossobj.style.top=tempy+e.clientY-offsety<br />return false<br />}<br />}<br /><br />function initializedrag(e){<br />if (ie4&&event.srcElement.id=="postit"||ns6&&e.target.id=="postit"){<br />offsetx=ie4? event.clientX : e.clientX<br />offsety=ie4? event.clientY : e.clientY<br /><br />tempx=parseInt(crossobj.style.left)<br />tempy=parseInt(crossobj.style.top)<br /><br />dragapproved=true<br />document.onmousemove=drag_drop<br />}<br />}<br />document.onmousedown=initializedrag<br />document.onmouseup=new Function("dragapproved=false")<br /><br /></script><br />



Todo lo que tienen que hacer es pegar estos dos codigos dentro de las etiquetas mencionadas y listo, ya estara funcionando.
En el codigo puse mensajes que muestra en donde deben cambiar el mensaje que yo tengo por el de ustedes, ademas en la linea:

<div id="postit" style="left:180px;top:160px">

pueden cambiar la posicion en donde aparece el aviso, solo deben cambiar los numeros 180 para variar la distancia entre el margen izquierdo y 160 para variar la distancia con el margen superior del blog.
Suerte!!

 

Patricia Ramírez at 12:22:00 AM | Permalink   

  View blog reactions

Como poner emoticons en tu Blog ?

martes, octubre 24, 2006

Este súper util post fue enviado por Teko

Si tu no sabes como poner emoticons en tu blog y quieres tenerlos , este post es para ti.

La forma de hacerlo es muy facil, solo tienes que poner este "pequeño" codigo dentro del <head>, esta en las primeras lineas de tu plantilla, en cualquier lugar sirve, pero de preferencia , seguido del <head>.



<br /><!--BloggerEmoticons--><br /><script type="text/javascript"><br /><!-- <br /><br />function replaceText() {<br />// no support<br />if(!document.getElementById) {<br />return;<br />}<br /><br />bodyText = document.getElementById("body");<br />theText = bodyText.innerHTML;<br /><br />// replace<br />theText = theText.replace(/;\)/g,'<img src="http://photos1.blogger.com/blogger/7678/802/1600/wink.gif" alt=";)" />');<br />theText = theText.replace (/;-\)/g,'<img src="http://photos1.blogger.com/blogger/7678/802/1600/wink.gif" alt=";-)" />');<br />theText = theText.replace (/:D/g,'<img src="http://photos1.blogger.com/blogger/7678/802/1600/biggrin.gif" alt=":D" />');<br />theText = theText.replace (/:-D/g,'<img src="http://photos1.blogger.com/blogger/7678/802/1600/biggrin.gif" alt=":-D" />');<br />theText = theText.replace (/B\)/g,'<img src="http://photos1.blogger.com/blogger/7678/802/1600/cool.gif" alt="B)" />');<br />theText = theText.replace(/B-\)/g,'<img src=" http://photos1.blogger.com/blogger/7678/802/1600/cool.gif" alt="B-)" />');<br />theText = theText.replace(/:x/g,'<img src=" http://photos1.blogger.com/blogger/7678/802/1600/mad.gif" alt=":x" />');<br />theText = theText.replace(/:X/g,'<img src="http://photos1.blogger.com/blogger/7678/802/1600/mad.gif " alt=":X" />');<br />theText = theText.replace(/:-x/g,'<img src="http://photos1.blogger.com/blogger/7678/802/1600/mad.gif " alt=":-x" />');<br />theText = theText.replace(/:-X/g,'<img src="http://photos1.blogger.com/blogger/7678/802/1600/mad.gif" alt=":-X" />'); <br />theText = theText.replace(/:-\(/g,'<img src="http://photos1.blogger.com/blogger/7678/802/1600/sad.gif" alt=":-(" />');<br />theText = theText.replace(/:\(/g,'<img src="http://photos1.blogger.com/blogger/7678/802/1600/sad.gif" alt=":(" />');<br />theText = theText.replace(/:o/g,'<img src="http://photos1.blogger.com/blogger/7678/802/1600/ohmy.gif" alt=":o" />');<br />theText = theText.replace (/:O/g,'<img src="http://photos1.blogger.com/blogger/7678/802/1600/ohmy.gif" alt=":O" />');<br />theText = theText.replace(/:-o/g,'<img src=" http://photos1.blogger.com/blogger/7678/802/1600/ohmy.gif" alt=":-o" />');<br />theText = theText.replace(/:-O/g,'<img src=" http://photos1.blogger.com/blogger/7678/802/1600/ohmy.gif" alt=":-O" />');<br />theText = theText.replace(/:p/g,'<img src=" http://photos1.blogger.com/blogger/7678/802/1600/tongue.gif" alt=":p" />');<br />theText = theText.replace(/:-p/g,'<img src=" http://photos1.blogger.com/blogger/7678/802/1600/tongue.gif" alt=":-p" />');<br />theText = theText.replace(/:-P/g,'<img src=" http://photos1.blogger.com/blogger/7678/802/1600/tongue.gif" alt=":-P" />');<br />theText = theText.replace(/:P/g,'<img src=" http://photos1.blogger.com/blogger/7678/802/1600/tongue.gif" alt=":P" />');<br />theText = theText.replace(/:-\)/g,'<img src=" http://photos1.blogger.com/blogger/7678/802/1600/smile.gif" alt=":-)" />');<br />theText = theText.replace(/:\)/g,'<img src=" http://photos1.blogger.com/blogger/7678/802/1600/smile.gif" alt=":)" />');<br /><br />bodyText.innerHTML = theText;<br />}<br /><br />--><br /></script><br /><!--BloggerEmoticons--><br />





Ya habiendo añadido esto, lo siguiente es aun mas facil. Solo hay que localizar el <Body> y sustituirlo por este otro:


<body id="body" onload="replaceText();">



Una vez hecho esto, solo guarda los cambios y vuelve a publicar tu plantilla. Tus emoticons se veran asi :







Recuerda, solo se ven en los post y en los comentarios , pero en el "permalink", no donde se ponen los comentarios desde blogger.


Y eso es todo..Espero que les sirva, tanto como me sirvio a mi.. :)

 

Patricia Ramírez at 1:41:00 PM | Permalink   

  View blog reactions

Como crear una Tabla en el blog?

lunes, octubre 23, 2006

Las tablas son muy utiles, si tienes imagenes y quieres colocarlas ordenadas, lo puedes hacer dentro de una tabla. Este código es super simple, y consta de 3 partes principales:

<table> (esto corresponde al comienzo de la tabla)

<tr> (esto corresponde al comienzo de la primera fila)

<td> (esto corresponde al comienzo del elemento de una columna)

</td> (esto corresponde al fin del elemento de una columna)

</tr> (esto corresponde al fin de la primera fila)

</table> (esto corresponde al fin de la tabla)



Entonces la estructura queda como muestra la siguiente figura:





Aqui les dejo el código para esta misma tabla:

<br /><table><br /><br /><tr><br /><td>Codigo del Objeto 1</td><br /><td>Codigo del Objeto 2</td><br /></tr><br /><br /><tr><br /><td>Codigo del Objeto 3</td><br /><td>Codigo del Objeto 4</td><br /></tr><br /><br /><tr><br /><td>Codigo del Objeto 5</td><br /><td>Codigo del Objeto 6</td><br /></tr><br /><br /></table><br />



Eso es todo, como ven el objeto 1 y 2 estan en la misma fila (<tr> </tr>) pero distinta columna (<td> </td>). Al igual que los objetos 3 y 4; y 5 y 6.

Espero que les quede claro.

Blogalaxia Tags:
Tabla  
Agregar  
Codigo  
Accesorios  

 

Patricia Ramírez at 10:26:00 AM | Permalink   

  View blog reactions

Javascript que Cambia la imagen por otra al Pasar el mouse por encima

martes, octubre 17, 2006

Este primer código va entre las etiquetas <head> y </head> (el comienzo de esta etiqueta esta en las primeras lineas de toda su plantilla), este codigo se copia textual, y no se le hace ningún cambio, solo en el segundo se cambian las url de las imagenes:



<br /><SCRIPT LANGUAGE="Javascript"><br /><!-- Consigue mas JavaScript en http://www.mundojavascript.com --><br /><!-- Swap images<br />function Permut (flag,img) {<br /> if (document.images) {<br /> if (document.images[img].permloaded) {<br /> if (flag==1) document.images[img].src = document.images[img].perm.src<br /> else document.images[img].src = document.images[img].perm.oldsrc<br /> }<br /> }<br />}<br />function preloadPermut (img,adresse) {<br /> if (document.images) {<br /> img.onload = null;<br /> img.perm = new Image ();<br /> img.perm.oldsrc = img.src;<br /> img.perm.src = adresse;<br /> img.permloaded = true;<br /> }<br />}<br />// --><br /></SCRIPT><br />



y este segundo codigo es en donde se verá el efecto, debe ir debajo de <body>:



<br /><A HREF="http://ayudaparatublog.com/personal" TARGET="_BLANK" onMouseover="Permut(1,'IMG1');" onMouseout="Permut(0,'IMG1');"><br /><IMG SRC="http://photos1.blogger.com/blogger/5923/1205/200/toplaya.jpg" border=0 NAME="IMG1" onLoad="preloadPermut(this,'http://photos1.blogger.com/blogger/5923/1205/200/DSCN4479.jpg');"><br /></A><br />



Lo que se obtiene como resultado, lo pueden ver pasando el mouse sobre mi foto en la columna izquierda, en este caso yo puse la direccion de mi blog personal, obviamente ustedes la cambian por lo que quieran.


Este es el link de mi primera imagen:

http://photos1.blogger.com/blogger/5923/1205/200/toplaya.jpg
Y este es el link de la segunda:

http://photos1.blogger.com/blogger/5923/1205/200/DSCN4479.jpg

Lo unico que deben hacer es sustituir estos links por los de ustedes en el segundo codigo.



Revisar Tambien: ¿donde debo pegar el codigo en la sidebar o barra lateral?.

Blogalaxia Tags:
Imagen  
Cambiar  
Blogger  
Personalizacion  

 

Patricia Ramírez at 11:38:00 PM | Permalink   

  View blog reactions

Agrega en tu Blog tu Imagen de Gmail

viernes, octubre 06, 2006

Solo debes ingresar a GSIG, escribir tu username de gmail, y listo tendras el codigo de las diferentes imagenes que entregan, para pegarlo en tu blog:













Si no sabes en donde pegarlo revisa el post, ¿donde debo pegar el codigo en la sidebar o barra lateral?.

 

Patricia Ramírez at 6:57:00 PM | Permalink   

  View blog reactions

Agregar una Imagen en el Titulo a la Plantilla Minima Black

La imagen pueden subirla a blogger o en cualquier otro host.



Aqui les dejo la Plantilla Minima Black con los cambios Ya realizados, para que la descarguen: Minima Black Imagen en el Titulo



Todo lo que esta entre " " es una explicacion que deben eliminar, la puse al lado de cada linea que se debe modificar para que quedara mas claro, si no entienden algo, dejen la pregunta en el comentario



Este el codigo Inicial:


<br />/* Header <br/><br />----------------------------------------------- *<br />@media all {<br />"EN ESTA PARTE AGREGAREMOS 3 LINEAS UNA CORRESPONDE AL LINK DE LA FOTO, OTRA ES PARA AJUSTAR EL ANCHO Y LA ULTIMA PARA CENTRAR LA IMAGEN"<br /> #header { <br /> width:660px;<br /> margin:0 auto 10px;<br /> border:1px solid #333; "ESTO CORRESPONDE AL BORDE MAS EXTERNO SI QUIEREN LO ELIMINAN"<br /> }<br /> }<br />@media handheld {<br /> #header {<br /> width:90%;<br /> }<br /> }<br />#blog-title {<br /> margin:5px 5px 0;<br /> padding:20px 20px .25em;<br /> border:1px solid #222; "CON NONE ELIMINAMOS EL BORDE "<br /> border-width:1px 1px 0;<br /> font-size:200%;<br /> line-height:1.2em;<br /> color:#ccc;<br /> text-transform:uppercase;<br /> letter-spacing:.2em;<br /> }<br />#blog-title a {<br /> color:#ccc;<br /> text-decoration:none;<br /> }<br />#blog-title a:hover {<br /> color:#ad9;<br /> }<br />#description {<br /> margin:0 5px 5px;<br /> padding:0 20px 20px;<br /> border:1px solid #222; "CON NONE ELIMINAMOS EL BORDE"<br /> border-width:0 1px 1px;<br /> font:78%/1.4em "Trebuchet MS",Trebuchet,Arial,Verdana,Sans-serif;<br /> text-transform:uppercase;<br /> letter-spacing:.2em;<br /> color:#777;<br /> }<br />




Este el codigo Final:


<br />/* Header<br />----------------------------------------------- */<br />@media all {<br /> #header {<br /> width:660px;<br /> margin:0 auto 10px;<br /> border:none; " ASI ELIMINAN EL BORDE "<br /> background: #000 url( http://photos1.blogger.com/blogger/7875/3285/1600/Encabezado%20Pagina%201.jpg) no-repeat; "ESTA ES LA URL DE LA IMAGEN #000 CORRESPONDE AL COLOR DE FONDO LO PUEDE CAMBIAR, REVISEN POST ANTERIORES"<br /> padding: 0 0 187px 0; "CON ESTE PADDING PUEDEN AJUSTAR EL ANCHO SI SU FOTO ES MAS ANCHO CAMBIAN EL 187, POR UN VALOR MAYOR Y VICEVERSA" <br /> background-position: center; "ESTA ES PARA CENTRAR LA IMAGEN" <br /> }<br /> }<br />@media handheld {<br /> #header {<br /> width:90%;<br /> }<br /> }<br />#blog-title {<br /> margin:5px 5px 0;<br /> padding:20px 20px .25em;<br /> border:none; "ELIMINAMOS EL OTRO BORDE "<br /> font-size:200%;<br /> line-height:1.2em ;<br /> color:#ccc;<br /> text-transform:uppercase;<br /> letter-spacing:.2em;<br /> }<br />#blog-title a {<br /> color:#ccc;<br /> text-decoration:none;<br /> }<br />#blog-title a:hover {<br /> color:#ad9;<br /> }<br />#description {<br /> margin:0 5px 5px;<br /> padding:0 20px 20px;<br /> border:none; "ELIMINAMOS OTRO BORDE EL DE LA DESCRIPCION"<br /> font:78%/1.4em "Trebuchet MS",Trebuchet,Arial,Verdana,Sans-serif;<br /> text-transform:uppercase;<br /> letter-spacing:.2em;<br /> color:#777;<br /> }<br />

Blogalaxia Tags:
Titulo  
Personalizar  
Modificar  
Imagen  

 

Patricia Ramírez at 5:51:00 PM | Permalink   

  View blog reactions

Como agregar otra barra Lateral o Sidebar a las plantillas de Blogger ?

Vamos a ir haciendo un análisis plantilla por plantilla

Primero las que mas votos tuvieron:



Minima black

<br /><br />/* Content<br />----------------------------------------------- */<br />@media all {<br /> #content {<br /> width:660px;<br /> margin:0 auto;<br /> padding:0;<br /> text-align:left;<br /> }<br /> #main {<br /> width:410px;<br /> float:left;<br /> }<br /> #sidebar {<br /> width:220px;<br /> float:right;<br /> }<br /> }<br />



Creamos algo así:
<br /><br />/* Content<br />----------------------------------------------- */<br />@media all {<br /> #content {<br /> width:880px;<br /> margin:0 auto;<br /> padding:0;<br /> text-align:left;<br /> }<br /> #main {<br /> width:410px;<br /> float:center;<br /> }<br /> #sidebar1 {<br /> width:220px;<br /> float:right;<br /> }<br /> #sidebar2 {<br /> width:220px;<br /> float:left;<br /> }<br /> }<br />

Blogalaxia Tags:
Sidebar  
Modificar  
Cambiar  
Agregar  
Columnas  

 

Patricia Ramírez at 3:36:00 PM | Permalink   

  View blog reactions

Presentaciones PowerPoint en el Blog

jueves, octubre 05, 2006

Este dato lo saque de ñblog y aqui les voy a explicar el procedimiento detallado para que suban sus presentaciones powerpoint al blog.






Paso 1

Esto es algo que casi no se ve, pero no se pueden registrar de inmediato, primero deben solicitar una invitacion, la pagina es Slideshare..





Paso 2
Una vez que les llega el mail a la cuenta que pusieron en este formulario:




Paso 3

Entonces ahora pueden comenzar a registrarse:






Paso 4

Luego les llega un mail con los datos de la cuenta, Ahora una vez que estan adentro solo deben pinchar en UPLOAD, como se muestra aqui, y les aparecera la siguiente pantalla, en donde deben buscar en su disco duro la presentacion, y completar los datos que quieran del siquiente formulario:






Paso 5

Una vez que la carga se ha realizado, aparecera lo siguiente, aqui para obtener el codigo solo deben pinchar en donde dice Title, en este caso dice Presentacion Sindicato:






Paso 6

Y aparecera la siguiente pantalla, y ahora solo deben copiar el codigo que se entrega en la entrada que van a crear.






Eso es todo espero que les sirva, muchas personas habian preguntado por esto.

Blogalaxia Tags:
Presentaciones  
Powerpoint  
Post  
Blogger  
Personalizacion  

 

Patricia Ramírez at 10:31:00 AM | Permalink   

  View blog reactions

Subir musica a mi blog con EVOCA

lunes, septiembre 25, 2006

Pasos para subir musica en este servicio, primero pincha en evoca para registrarte: EVOCA, si estas en la pagina principal de evoca entonces haz click sobre Regístrate o signup segun el idioma en que vez la pantalla (abajo al final aparece ingles/español ahi puedes cambiar)

Una vez que hemos indicado todos los datos, pulsaremos el botón Sign me Up.

Luego te va a llegar un correo que nos permitirá formalizar el registro. Realizados todos esos pasos, podemos comenzar a utilizar Evoca.

Luego accedemos con nuestro usuario a través del enlace Ingresar.

Cuando accedemos con nuestro usuario, podemos comprobar que estamos bien logados, porque veremos el nombre de nuestro usuario en la parte superior derecha de la pantalla: Bienvenido, elrincondeanita.

Para subir una canción, debemos pulsar el enlace Subir una grabación.

En la siguiente pantalla debemos completar los datos que solicitan; no es obligatorio completar todos, pero si es importante que tengamos encuenta estos cinco pasos, que vemos en la imagen:

En el paso dos, pulsaremos el botón Examinar, para localizar en nuestro computador el archivo de MP3 o WAV que queremos incorporar a nuestro blog. Lo seleccionamos y pulsamos el botón Abrir.

Luego pincha en Upload, para comenzar con la carga del archivo, que nos llevará unos minutos. Una vez que hayamos terminado, podemos encontrar nuestra canción en la pestaña Mis Grabaciones.

Para escuchar la grabación que hemos subido, podemos pulsar el play, si lo que queremos es acceder al código html para incorporarlo a nuestro blog, pulsaremos sobre el nombre de la canción.

De la imagen de arriba, copiamos el código que aparece en la sección Para tu blog utiliza:, y lo pegamos en una nueva entrada de post.

Una vez que hayamos terminado de editar nuestro post, podemos pulsar el botón Publicar, para ver como nos a quedado.

Ademas evoca tiene la opcion de agregar los blogs que tienen en blogger, asi despues seleccionan enviar a blog y listo.

Blogalaxia Tags:
Musica  
Subir  
Evoca  
Blog  
Blogger  
Canciones  
Personalizacion  

 

Patricia Ramírez at 5:08:00 PM | Permalink   

  View blog reactions

¿Cómo subir un video de youtube a mi blog?

Asi se llama este post que encontre en una seccion del blog de anita, super bien explicado asi que para que me voy a dar de nuevo el trabajo de escribir los mismo. Cualquier duda que tengan dejenla por aqui. Y de paso visiten a ANITA, jajaj.

Para subir videos debemos acceder a YouTubeTM Broadcast Yourself.

Una vez en YouTube, pulsaremos “Sign Up” o “Log In”.

Lo primero que debemos hacer es darnos de alta.

Para subir un video a YouTubeTM Broadcast Yourself, debemos pulsar la pestaña “Upload”.

En la siguiente pantalla debemos cumplimentar los siguientes datos, y pulsar el botón “Continue”. Como podéis ver en el primer paso indicaremos: el título que queramos darle a nuestro video, una descripción, las tags que queramos utilizar y una categoría.

En el paso dos, pulsaremos el botón “Browse”, y localizaremos en nuestro ordenador el archivo de video que queremos incorporar a nuestro blog. A continuación pulsaremos el botón “Upload Video”.

Mientras nuestro video se está cargando, veremos la siguiente pantalla:

Una vez realizada la carga vemos la siguiente pantalla con toda la información. Lo que a nosotros nos interesa es el código html que se encuentra a final de la pantalla, en el apartado “Embed HTML”.

Debemos copiar dicho código y lo pegamos en nuestro blog.

Dependiendo de la caracteristicas del archivo, tendremos una anchura y altura determinada para cada video. Si subimos nuestro video en la coctelera, tenemos un ancho máximo de 444, más o menos. Como podemos ver, you tube, nos ha dado un ancho por alto de 600 x 350: “width=600”, “height”=350. Para que no se deforme la información en vuestro blog, os recomiendo que la cambies a 440x257, es decir, “width=440”, “height”=257.

Para centrar la imagen, llevarla a derecha o izquierda podemos utilizar el código html: class="imgizqda", class="imgcen" ó class="imgdcha".

Una vez que hayamos terminado de editar nuestro post, podemos pulsar el botón “Guardar borrador”, para ver como nos a quedado.

Documento PDF con toda la información:Manual

Nota: Está prohibido poner trozos de películas que tienen copyright.

Blogalaxia Tags:
Videos  
Reproductores  
Blogger  
Agregar  
Blog  
Youtube  

 

Patricia Ramírez at 5:03:00 PM | Permalink   

  View blog reactions

Agregue una imagen con titulo, pero se ve el antiguo, como lo borro??

viernes, septiembre 15, 2006

Aqui lo principal, es borrar la etiqueta <$BlogTitle$> que aparece en la plantilla.



Por ejemplo en el caso de la plantilla son of moto: (todo este codigo corresponde al titulo y la descripcion)




<div id="blog-header"><h1>

<ItemPage><a href="<$BlogURL$>"></ItemPage>

<$BlogTitle$>

<ItemPage></a></ItemPage>

</h1>

<p><$BlogDescription$></p></div>



Lo que esta entre h1, es lo que saldra con el formato de titulo...yo borre todo lo que esta entre <h1> y </h1>, aunque si no me equivoco basta con borrar la etiqueta <$BlogTitle$>

 

Patricia Ramírez at 4:42:00 PM | Permalink   

  View blog reactions