Más gadgets por San Valentín

Seguimos en el mes del amor, y como vimos anteriormente, puede ser que a algunos les resulte demasiado cursi aquello de llenar de corazones todo el blog, entonces, aquí hay otro Truco que también puede agradar a los que no se animaron con los corazones. Este gadget, además de ser sencillo de ponerlo en cualquier parte del blog, es menos invasivo que el anterior.

Solo copia el siguiente código:

<br /><br /> <embed src="http://img99.imageshack.us/img99/2750/roseh.swf" width="170" height="300" type="application/x-shockwave-flash" flashvars="v_wd=TU TEXTITO AQUI &v_t=2009/12/6" wmode="transparent"></embed><br /><br />  

Entra en Diseño, Añadir gadget, HtmlJavascript, y arrástralo hasta donde creas conveniente. La imagen se verá más o menos así:





Cambia donde dice Tu frase aquí por la frase que a ti te guste y listo, ya tienes un motivo para desear feliz San Valentín

Corazones flotando en el blog por San Valentin.

Como ya estamos casi a la vuelta de San Valentin, fecha en la que todos estamos predispuestos a dejarnos llevar por ese espíritu romántico, enamoradizo y aventurero, y como siempre tratamos de aprovechar casi cualquier medio para poder expresar ese sentimiento hacia nuestro ser querido, he aprovechado la oportunidad para traerles este sencillo y divertido –y expresivo también- gadget de corazones para poder ponerlo en el blog y así inundar de romanticismo nuestros posts; y como el corazón es el símbolo del amor, pues que mejor manera de expresar lo que sentimos si no es llenando nuestras entradas con corazones... !en toda nuestra pantalla...¡

Puedes ver un ejemplo de esto en este Demo.

Ponerlo en el blog es muy sencillo, entra a Diseño, Añadir Gadget, Html-javascript, y copia el siguiente código:

 <script language='javascript' type='text/javascript'>
//<![CDATA[
// Script original de Eloi Gallés Villaplana

var numero =25
var velocidad = 20
var imagenamor = "https://lh4.googleusercontent.com/-_DubFGB9694/TyjSYMzn48I/AAAAAAAAAIo/fQ4ArWbipE8/s40/corazon.gif"

var ns4arriba = (document.layers) ? 1 : 0
var ie4arriba = (document.all) ? 1 : 0
var dombrowser = (document.getElementById) ? 1 : 0

var dx, xp, yp
var am, stx, sty
var i, doc_ancho = 1024, doc_alto = 768

function amor() {

    establece_dimensiones()

    dx = new Array()
    xp = new Array()
    yp = new Array()
    am = new Array()
    stx = new Array()
    sty = new Array();
     
    for (i = 0; i < numero; ++ i) {
        dx[i] = 0
        xp[i] = Math.random()*(doc_ancho-50)
        yp[i] = Math.random()*doc_alto
        am[i] = Math.random()*20
        stx[i] = 0.02 + Math.random()/10
        sty[i] = 0.7 + Math.random()
        if (document.layers) {
                 if (i == 0) {
                document.write("<layer name=\"dot"+ i +"\" left=\"15\" ")
                document.write("top=\"15\" visibility=\"show\"><img src=\"")
                document.write(imagenamor + "\" border=\"0\"></layer>")
                 } else {
                     document.write("<layer name=\"dot"+ i +"\" left=\"15\" ")
                     document.write("top=\"15\" visibility=\"show\"><img src=\"")
                     document.write(imagenamor + "\" border=\"0\"></layer>")
                 }
             } else if (document.all || document.getElementById) {
                 if (i == 0) {
                     document.write("<div id=\"dot"+ i +"\" style=\"POSITION: ")
                     document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: ")
                     document.write("visible; TOP: 15px; LEFT: 15px;\"><img src=\"")
                     document.write(imagenamor + "\" border=\"0\"></div>")
                 } else {
                     document.write("<div id=\"dot"+ i +"\" style=\"POSITION: ")
                     document.write("absolute; Z-INDEX: "+ i +"; VISIBILITY: ")
                     document.write("visible; TOP: 15px; LEFT: 15px;\"><img src=\"")
                     document.write(imagenamor + "\" border=\"0\"></div>")
                 }
             }
     }
     
    corazon()
}

function corazon() {
    for (i = 0; i < numero; ++ i) {
        yp[i] += sty[i];
        if (yp[i] > doc_alto) {
            xp[i] = Math.random()*(doc_ancho-am[i]-30)
            yp[i] = 0
            stx[i] = 0.02 + Math.random()/10
            sty[i] = 0.7 + Math.random()
            establece_dimensiones()
        }

        dx[i] += stx[i];

        
        if ( document.all ) {
            var imagen = eval("dot" + i )
            imagen.style.posLeft = xp[i] + am[i]*Math.sin(dx[i])
            imagen.style.posTop = yp[i]
        }
        
        else if ( document.layers ) {
            var imagen = eval("document.dot" + i)
            imagen.left = xp[i] + am[i]*Math.sin(dx[i])
            imagen.top = yp[i]
        }
        
        else if ( document.getElementById ) {
            var imagen = document.getElementById( "dot" + i)
            imagen.style.left = xp[i] + am[i]*Math.sin(dx[i]) + 'px'
            imagen.style.top = yp[i] + 'px'
        }
    }

    setTimeout("corazon()", velocidad)
}
function establece_dimensiones() {
    if (self.innerHeight) {
        doc_ancho = self.innerWidth - 50
        doc_alto = self.innerHeight - 21
    } else if (document.documentElement && document.documentElement.clientHeight) {
        doc_ancho = document.documentElement.clientWidth
        doc_alto = document.documentElement.clientHeight - 25
    
    } else if (document.body) {
        doc_ancho = document.body.clientWidth
        doc_alto = document.body.clientHeight - 25
    }
}
//]]>
</script>
<script language='javascript' type='text/javascript'>
amor()
</script>

Este código ha sido modificado del original de Eloy Gallés, e igual puedes cambiar la imagen del corazón por una que prefieres, solo tienes que cambiar donde dice  https://lh4.googleusercontent.com/-_DubFGB9694/TyjSYMzn48I/AAAAAAAAAIo/fQ4ArWbipE8/s40/corazon.gif por la url de tu imagen. Aquí yo he utilizado una imagen de gifmania.

Google cambiará su política de privacidad. ¿En qué nos afectará?

Google ha informado que desde este 1 de Marzo, su Política de privacidad tendrá algunos cambios -más bien unos recortes-, ya que ahora cuenta con más de 60 políticas de privacidad, a las que “eliminará” para consolidar en una sola que abarque a todos sus productos y servicios. El último cambio lo hizo en Octubre del año pasado.
 

Con esta decisión se trata –según propias versiones del mismo gigante de internet- de tener un “único usuario” para todas sus cuentas. "Trataremos al usuario como un usuario único a través de todos nuestros productos, lo que en la práctica supondrá una experiencia de Google más simple e intuitiva". Esto sucede mientras en Europa se debate una nueva disposición sobre la protección de datos y la privacidad del usuario cuando accede a internet.

Entradas populares con imágenes y efecto acordeón

Desde hace algún tiempo Blogger creó un gadget de entradas populares para poder implementarlo en el sidebar de nuestro blog, con las mismas características que Linkwithin; pero este gadget, si bien da un aspecto bastante agradable, el único “inconveniente” es que permanece estático, sin ninguna otra atribución más que de “mostrar” de manera casi impersonal las entradas anteriores que hemos publicado.

Pero gracias a Abu Farhan, aquí hay un gadget que, además de mostrar las entradas populares de nuestro blog, hace que dichas entradas se muestren de manera rotativa, con efecto de “acordeón”, lo que hace que este gadget sea más atractivo a la vista, y que de seguro, nos ayudará a tener un poco más de visitas.

Puedes ver este demo para que tengas una idea más clara de qué se trata.

Para implementarlo, solo debes hacer lo siguiente: Vas a Diseño, Añadir Gadget, HTML-javascript, y pega lo siguiente:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<style type="text/css" media="screen">
<!--

#spylist {
overflow:hidden;
margin-top:5px;
padding:0px 0px;
height:350px;
}
#spylist ul{
width:220px;
overflow:hidden;
list-style-type: none;
padding: 0px 0px;
margin:0px 0px;
}
#spylist li {
width:208px;
padding: 5px 5px;
margin:0px 0px 5px 0px;
list-style-type:none;
float:none;
height:70px;
overflow: hidden;
background:#fff url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/post.jpg) repeat-x;
border:1px solid #ddd;
}

#spylist li a {
text-decoration:none;
color:#4B545B;
font-size:11px;
height:18px;
overflow:hidden;
margin:0px 0px;
padding:0px 0px 2px 0px;
}
#spylist li img {
float:left;
margin-right:5px;
background:#EFEFEF;
border:0;
}
.spydate{
overflow:hidden;
font-size:10px;
color:#0284C2;
padding:2px 0px;
margin:1px 0px 0px 0px;
height:15px;
font-family:Tahoma,Arial,verdana, sans-serif;
}

.spycomment{
overflow:hidden;
font-family:Tahoma,Arial,verdana, sans-serif;
font-size:10px;
color:#262B2F;
padding:0px 0px;
margin:0px 0px;
}

-->
</style>

<script language='JavaScript'>

imgr = new Array();

imgr[0] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[1] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[2] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[3] = "http://i43.tinypic.com/orpg0m.jpg";

imgr[4] = "http://i43.tinypic.com/orpg0m.jpg";
showRandomImg = true;

boxwidth = 255;

cellspacing = 6;

borderColor = "#232c35";

bgTD = "#000000";

thumbwidth = 70;

thumbheight = 70;

fntsize = 12;

acolor = "#666";

aBold = true;

icon = " ";

text = "comments";

showPostDate = true;

summaryPost = 40;

summaryFontsize = 10;

summaryColor = "#666";

icon2 = " ";

numposts = 10;

home_page = "http://nombre-de-tu-blog.blogspot.com/";

limitspy=4
intervalspy=4000

</script>

<div id="spylist">
<script src='http://scriptabufarhan.googlecode.com/svn/trunk/recentpostthumbspy-min.js' type='text/javascript'></script>
</div>

Cambia lo que está en azul, el número de entradas que quieras que se muestren de acuerdo a tu preferencia, y en donde dice nombre-de-tu-blog, pones la dirección de tu blog, das en vista previa para asegurarte que todo está bien y listo, tendrás un gadget que te muestra las entradas populares bastante simpático

Imagen flotante al pie de la página con texto “deja tu comentario”.

Para muchos (si no es que para todos) es importante que los demás nos dejen su comentario o cualquier opinión de nuestro blog  o de alguna entrada en particular; y que mejor si reforzamos (más bien “forzamos” al lector) con una “recomendación” o sugerencia, ayudados por una imagen estática, de que nos deje su comentario.

Aquí puedes ver el Demo de la entrada con la imagen estática al pie de la pantalla.

Conseguir esto es muy fácil. Solo debes pegar este sencillo código en un archivo html.

Vas a Diseño, Añadir Gadget,  HTML/Javascript y pega este código:

<br /><a style="display:scroll;position:fixed;bottom:0px;right:0px;" href="nombredetublog.blogspot.com"><img src="URL de tu imagen" /></a><br />

Sustituye lo que está en azul por la dirección de tu blog y por la url de tu imagen, lo pones en cualquier lugar, das vista previa y, si todo está como lo planeaste, das en guardar cambios. Y listo. Así de sencillo es poner este truco en el blog.

P.D: Puedes poner cualquier imagen que desees, siempre que no exceda del tamaño recomendado, ya sabes, por aquello de la estética.

Cómo obtener la Url (dirección web) de una imagen

Aunque este viene siendo uno de los tópicos más sencillos en el mundo de los blogs, también es cierto que cada año hay una gran cantidad de internautas y blogeros que se inician con conocimientos casi nulos en este asunto, por lo que no está de más hacer un remember (para algunos) y una lección rápida (para los más nuevos) acerca de cómo obtener la url de una imagen, o lo que es casi lo mismo: cómo obtener la dirección web de una imagen.

Si usas Blogger para publicar tus post, el asunto es mucho más sencillo pues las imágenes que subas se almacenarán automáticamente (con su respectiva url) en tu cuenta de Picasa, que es un servicio de hosting de imágenes gratuito del mismo Google (que eso de por sí ya es  una ventaja) Pero además existen otros sitios donde puedes alojar tus imágenes, algunos también gratuitos y otros no. Te puedo mencionar  Imageshack,  imgur, solo por citar dos ejemplos. Por cuál te decidas depende de ti.

En este caso yo elegiré Picasa.

Entras allí con la misma cuenta de Blogger (esa es una de las ventajas que mencionaba, pues es una cuenta menos que crear, una contraseña menos que recordar) y eliges Seleccionar fotos de tu equipo.

 

O eliges una foto que ya tienes almacenada y le das click  para que se abra a su tamaño natural. Luego le das click derecho en la imagen y eliges con el click izquierdo Copiar la ruta de la imagen.

 

Lo llevas provisionalmente al portapapeles de tu Pc hasta que lo vayas a pegar de forma definitiva en el lugar que la necesites. Tendrás algo parecido a esto: 

Lo que está en azul es la url de tu imagen. Cuando te pidan “aquí la url de tu imagen” eso es lo que tienes que pegar, y listo.

Eso es todo. Como ves no es nada complicado, y si lo practicas algunas veces resulta súper sencillo.