Como hacer grande una imagen sin hacer click con el ratón, bastara con poner este código, en
edición HTML

<img src="URL de la imagen" onmouseover="this.width=400;this.height=300;" onmouseout="this.width=100;this.height=80;" width="100" height="80" />

Bastara con cambiar:  URL de la imagen por la imagen que queramos.

Nuevo gadget en el blog, por si alguien quiere ponerme en su blog, estaría muy contenta. 

Copiaremos el código de la cajita y añadiremos un gadget HTML lo pegas y lo guardas. Así estaré en tu blog.

<div align="center">
<a href="http://lasredesteayudaran.blogspot.com.es/" title="La Red Te Ayudara" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEio1aWZAgzBb0gPqmkcQJPOe0_06UJe85s-JyHmv1KN2NkrssOHUO_OX48XTq211yz8YqX5C2OD6J3dcWcFLNb_ssr71VDMhDvXfam6HzALWcjbubdlfXOlx6KpzyvnEXe-w6F5v1F1blQ/w177-h105-no/la+red+peque%25C3%25B1a.png" alt="La Red Te Ayudara" style="border:none;" /></a></div>

Vamos a ver:;

Como poner un botón de blog con cajita de código

Lo primero sera diseñar la imagen que queremos que nos represente y segundo será tenerlo alojado para tener la URL . Con esto ya podremos acceder a esta herramienta y segur los pasos.

Grab My Button

Como he puesto el enlace a la página en español, bastara con seguir y rellenar los datos y luego darle a vista previa y si todo está bien, copiar y pegar, el código que nos dan, en un gadget.

Diseño, añadir gadget, HTML vista previa y si todo esta correcto,

guardar.

Como agradecimiento, nos piden que pongamos algún enlace o articulo a esta  herramienta.

Entradas  populares sin comentarios.

[1] En nuestro panel desde Diseño, añadimos un nuevo gadget HTML.

[2] Copiamos este código y lo pegamos en el nuevo gadget:

<div id="popular-posts">

<script language="JavaScript">

aBold = false;

numposts=300;

maxshowresult=10;

home_page = "http://lasredesteayudaran.blogspot.com.es/";

</script>

<script type="text/javascript">

//<![CDATA[

var postTitlear=new Array();var postUrlar=new Array();var postCommentar=new Array();var totalpost;document.write("<ul>");function showrecentposts(j){var a=j.feed.entry.length;totalpost=a;for(var f=0;f<a;f++){var h=j.feed.entry[f];var c=h.title.$t;var b;var g;if(f==j.feed.entry.length){break}for(var d=0;d<h.link.length;d++){if(h.link[d].rel=="alternate"){g=h.link[d].href;break}}for(var d=0;d<h.link.length;d++){if(h.link[d].rel=="replies"&&h.link[d].type=="text/html"){b=h.link[d].title.split(" ")[0];break}}c=(aBold)?"<b>"+c+"</b>":c;postTitlear.push(c);postUrlar.push(g);postCommentar.push(b)}sortPosts();for(var f=0;f<maxshowresult;f++){var e='<li><a href="'+postUrlar[f]+'" class="recent-link">'+postTitlear[f]+"</a>";document.write(e)}}function sortPosts(){function c(d,f){var e=postTitlear[d];postTitlear[d]=postTitlear[f];postTitlear[f]=e;var e=postUrlar[d];postUrlar[d]=postUrlar[f];postUrlar[f]=e;var e=postCommentar[d];postCommentar[d]=postCommentar[f];postCommentar[f]=e}for(var b=0;b<postTitlear.length-1;b++){for(var a=b+1;a<postTitlear.length;a++){if(parseInt(postCommentar[b])<parseInt(postCommentar[a])){c(b,a)}}}}document.write('<script src="'+home_page+"feeds/posts/default?max-results="+numposts+'&orderby=published&alt=json-in-script&callback=showrecentposts"><\/script>');

//]]>

</script>

</div>

Guardamos los cambios.

aBold = true; Los títulos de entrada estarán en negrita, cambiamos "true" por "false" si queremos que se vean normal.

numposts=300; El número de entradas de donde el script tomará los datos.

maxshowresult=10; Resultados a mostrar en el gadget.

home_page = "http://lasredesteayudaran.blogspot.com.es/"; Cambiar la dirección del blog.

Si QUIERES Pasar El Ratón, ONU y Activar 

El enlace al Que Quieras Función esta PONER, SI activará automaticamente al pasarle el Encima Porción Ratón, El Pecado Tener Que HACER clic.
Tendremos Que ponerlo en HTML.
El Codigo sera el siguiente:

<a href="URL DE LA PAGINA "onmouseover="window.location=this.href"> NOMBRE </ a>

Ejemplo:

  Inicio 

 Sustituiremos dados de Donde:

URL DE LA PAGINA Y  NOMBRE 

Muchas veces el titulo del gadget, queda mal y es repetitivo.

Me refiero a:

GADGET

Si queremos ocultar el titulo de los gadget,de manera sencilla y fácil de recordar, bastara con poner

<h2></h2>

Y simplemente, con este código nos dejara guardarlo sin ningún titulo, quedando más estético.

En Diseño  Edición Html,Ctrol F y buscamos "Etiquetas"
Si queremos expandir y contraer etiquetas, tendremos que buscar el siguiente código:

<b:widget id='Label1' locked='false' title='Etiquetas' type='Label'>

y lo sustituiremos por:

<b:widget id='Label1' locked='false' title='Etiquetas' type='Label'>
<b:includable id='main'>
<script type='text/javascript'>
//<![CDATA[
if(typeof(rnd) == 'undefined') var rnd = '';
rnd = Math.floor(Math.random()*1000);
rnd = 'id-' + rnd;
document.write('<a href="#" onclick="tmp = document.getElementById(&quot;' + rnd + '&quot;); tmp.style.display = (tmp.style.display == &quot;none&quot;) ? &quot;block&quot; : &quot;none&quot;; return false;" style="float:left;margin-right:5px;">');
//]]>
</script>[+/-]
<script type='text/javascript'>
//<![CDATA[
document.write('<\/a>');
//]]>
</script>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<script type='text/javascript'>
//<![CDATA[
document.write('<div id="' + rnd + '" style="display:none;">');
//]]>
</script>
<ul>
<b:loop values='data:labels' var='label'>
<li>
<b:if cond='data:blog.url == data:label.url'>
<data:label.name/>
<b:else/>
<a expr:href='data:label.url'><data:label.name/></a>
</b:if>
</li>
</b:loop>
</ul>
<script type='text/javascript'>
//<![CDATA[
document.write('<\/div>');
//]]>
</script>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>

[+/-]  Este será el signo que saldrá, pero si queremos poner una imagen como en este caso, el corazón, bastara con quitarlo y poner

<img src='URL DE LA IMAGEN'/>

Cambia URL DE LA IMAGEN por la correspondiente dirección de la imagen y ten en cuenta también el tamaño de la imagen.

Vista previa y si todo va bien, guardar.

Vamos a explicar como Personalizar los links de entradas recientes, página principal, entradas antiguas,  tendremos que tener tres imágenes con los temas que nos gusten.
Las alojaremos para tener las URL.

Si queremos resaltar un texto en un recuadro para destacarlo

<div style="margin:0px auto;width:250px;text-align:left;padding:10px; #bbf2ce;border:1px solid black;"> AQUI EL TEXTO QUE QUEREMOS QUE ESTE EN EL RECUADRO </div>

AQUI EL TEXTO QUE QUEREMOS QUE ESTE EN EL RECUADRO

Para tener los últimos comentarios con fecha y título del post, lo conseguiremos con este sencillo script.

Lo primero que debemos hacer es ir a Diseño

Añadir un gadget.
Hacemos click en "HTML/Javascript" y pegamos el siguiente script:

<script type="text/javascript">
function showrecentcomments(json) {
for(var i=0; i < a_rc; i++) {
var b_rc=json.feed.entry[i];var c_rc;
if(i==json.feed.entry.length)break;
for(var k=0; k < b_rc.link.length; k++) {
if(b_rc.link[k].rel=='alternate') {
c_rc=b_rc.link[k].href;break;
}
}
c_rc=c_rc.replace("#","#comment-");
var d_rc=c_rc.split("#");
d_rc=d_rc[0];
var e_rc=d_rc.split("/");
e_rc=e_rc[5];
e_rc=e_rc.split(".html");
e_rc=e_rc[0];
var f_rc=e_rc.replace(/-/g," ");
f_rc=f_rc.link(d_rc);
var g_rc=b_rc.published.$t;
var h_rc=g_rc.substring(0,4);
var i_rc=g_rc.substring(5,7);
var j_rc=g_rc.substring(8,10);
var k_rc=new Array();
k_rc[1]="Ene"; k_rc[2]="Feb"; k_rc[3]="Mar"; k_rc[4]="Abr";
k_rc[5]="May"; k_rc[6]="Jun"; k_rc[7]="Jul"; k_rc[8]="Ago";
k_rc[9]="Sep"; k_rc[10]="Oct"; k_rc[11]="Nov"; k_rc[12]="Dic";
if("content" in b_rc){
var l_rc=b_rc.content.$t;
} else if("summary" in b_rc) {
var l_rc=b_rc.summary.$t;
} else var l_rc="";
var re=/<\S[^>]*>/g;
l_rc=l_rc.replace(re,"");
if(m_rc==true)document.write(k_rc[parseInt(i_rc,10)]+' '+j_rc+' ');
document.write('<li><b>' + b_rc.author[0].name.$t + '</b>');
if(n_rc==true)document.write(f_rc);
document.write(':<br/>');
document.write('<a href="' + c_rc + '">');
if(l_rc.length < o_rc) {
document.write(l_rc);
} else {
l_rc=l_rc.substring(0,o_rc);
var p_rc=l_rc.lastIndexOf(" ");
l_rc=l_rc.substring(0,p_rc);
document.write(l_rc+'…');
}
document.write('</a></li>');
}
}
</script>
<script type="text/javascript">
var a_rc=10;
var m_rc=true;
var n_rc=false;
var o_rc=70;
</script>
<script src="http://AQUÍ-TU-BLOG.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments"></script>

Explicación de los colores:

http://AQUÍ-TU-BLOG.blogspot.com deberemos de poner la dirección de nuestro blog

var a_rc=10; nos indica el número de coemntarios a mostrar.

var m_rc=true; para mostrar la fecha de los comentarios:
true para mostrar la fecha y
false para omitirla.

var n_rc=false mostrar el titulo del post del comentario
true para mostrar el título y
false para omitirlo.

var o_rc=70 número de letras que se mostrará por cada comentario.

Si quisiéramos poner Fotos de antes y después que cambian con el ratón que seria muy interesante para ver un cambio, por ejemplo la decoración de una habitación, o simplemente cambiar de una foto a otra, como en el ejemplo que a continuación he puesto en este post.
Bastaría con poner el siguiente código,

<img src="UNO" onmouseover="this.src='DOS';" onmouseout="this.src='UNO';"/>

remplazando donde dice UNO por la URL de la imagen  uno y donde dice DOS por la URL de la imagen Dos.
Así que tendremos que tener nuestras imágenes alojadas en un servidor y tener la url de la imagen.
Sustituir el UNO por la Url de la imagen que queramos sea la primera. y
sustituir el DOS por la Url de la imagen  que se vea al poner el ratón encima.
Esto si queremos ponerlo en una entrada lo pondremos en HTML,  guardaremos y daremos en vista previa para ver los resultados.
Si nos interesa ponerlo en un gadget,
Añadiremos en vista Diseño un gadget y lo elegiremos en HTML/Javascript: y pegaremos el codigo con los cambios antes mencionados, pudiendo ponerlo donde nos interese..