Gadget Últimas Entradas

El gadget para mostrar las últimas entradas permite que los visitantes puedan visualizar de una forma más fácil los últimos temas publicados en nuestro blog (en Charkleons.com lo pueden visualizar en la columna de la izquierda en la parte de abajo). Este gadget permite configurarlo en varios aspectos, como visualizar una miniatura, el inicio del texto de la entrada, la fecha, etc. Es importante tener en cuenta que si alguna de nuestras entradas no cuenta con una imagen que el gadget pueda usar como miniatura, podría no visualizarse en la página. Para agregarlo a Blogger solo debemos ir a la parte de Diseño / Añadir un Gadget / HTML-Javascript y agregar el código que está al final (es muy largo).

 Las partes que pueden configurar son las siguientes: 

■ En el inicio pueden defirnir el alto y ancho de las miniaturas desde la parte que dice: width:65px;height:65px;

■ Pueden definir si quieren dejar un borde y su color para cada tema desde la parte que dice: border: 0px solid #ccc; en border pueden dejar 1px y en solid dejar el color de su elección. Cuando se agrega un borde a los temas del gadget se pierde la alineación, y se irá visualizando un tema a un extremo de la columna, y el siguiente en el otro extremo, y así sucesivamente con los demás temas, en algunas páginas dejar definido un borde en el código podría quedar bien con su diseño.

■ Las siguientes partes que están al final se definen dejando True para Sí o False para No, y hay dos que se definen con un valor numérico:

var numposts = 10; » Muestra el número de entradas que se visualizarán.
var showpostthumbnails = true; » Mostrar la miniatura de la primera imagen del tema.
var displaymore = false; » Mostrar la palabra "Más" para ir al tema.
var displayseparator = false; » Mostrar una línea que separa los temas del gadget.
var showcommentnum = false; » Mostrar el número de comentarios.
var showpostdate = false; » Mostrar la fecha de publicación del tema.
var showpostsummary = true; » Mostrar el texto del inicio del tema.
var numchars = 60; » Muestra el número de caracteres que incluirá el texto.

 Código del gadget (Seleccionar y copiar de abajo hacia arriba)  
---------------------------------------------------------
<style type='text/css'>

img.recent_thumb {padding:2px;width:65px;height:65px;border:0;
float:left;margin:5px 10px 10px 0; border: 0px solid #ccc;}
.recent_posts_with_thumbs {float: left;width: 100%;min-height: 100px;margin: 0px 0px 5px 0px;padding: 0;font-size:12px;}
ul.recent_posts_with_thumbs li {padding-bottom:5px;padding-top:5px;min-height:75px;}
.recent_posts_with_thumbs a {text-decoration:none;}
.recent_posts_with_thumbs strong {font-size:10px;}
.recent_posts_with_thumbs h4 {
text-transform: uppercase;
font-size: 14px;
}
</style>
<script type='text/javascript'>
//<![CDATA[
function showrecentpostswiththumbs(json) {document.write('<ul class="recent_posts_with_thumbs">'); for (var i = 0; i < numposts; i++) {var entry = json.feed.entry[i];var posttitle = entry.title.$t;var posturl;if (i == json.feed.entry.length) break;for (var k = 0; k < entry.link.length;k++){
if(entry.link[k].rel=='replies'&&entry.link[k].type=='text/html'){var commenttext=entry.link[k].title;var commenturl=entry.link[k].href;}
if (entry.link[k].rel == 'alternate') {posturl = entry.link[k].href;break;}}var thumburl;try {thumburl=entry.media$thumbnail.url;}catch (error)

{
s=entry.content.$t;a=s.indexOf("<img");b=s.indexOf("src=\"",a);c=s.indexOf("\"",b+5);d=s.substr(b+5,c-b-5);if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")){
thumburl=d;} else thumburl='http://1.bp.blogspot.com/-jv2TKvF0WXo/UngNsifOR5I/AAAAAAAAIKI/K1vfVFPmQcg/s1600/no-image.jpg';
}

var postdate = entry.published.$t;var cdyear = postdate.substring(0,4);var cdmonth = postdate.substring(5,7);var cdday = postdate.substring(8,10);var monthnames = new Array();monthnames[1] = "Ene";monthnames[2] = "Feb";monthnames[3] = "Mar";monthnames[4] = "Abr";monthnames[5] = "May";monthnames[6] = "Jun";monthnames[7] = "Jul";monthnames[8] = "Ago";monthnames[9] = "Sep";monthnames[10] = "Oct";monthnames[11] = "Nov";monthnames[12] = "Dic";document.write('<li class="clearfix">');


if(showpostthumbnails==true) 
document.write('<img class="recent_thumb" src="'+thumburl+'"/>');
document.write('<b><h4><a href="'+posturl+'" target ="_top">'+posttitle+'</a></b></h4>');

    if ("content" in entry) {
      var postcontent = entry.content.$t;}
    else
    if ("summary" in entry) {
      var postcontent = entry.summary.$t;}
    else var postcontent = "";
    var re = /<\S[^>]*>/g; 
    postcontent = postcontent.replace(re, "");


if (showpostsummary == true) {

      if (postcontent.length < numchars) {
          document.write('<i>');
         document.write(postcontent);
          document.write('</i>');}
      else {
          document.write('<i>');
         postcontent = postcontent.substring(0, numchars);
         var quoteEnd = postcontent.lastIndexOf(" ");
         postcontent = postcontent.substring(0,quoteEnd);
         document.write(postcontent + '...');
          document.write('</i>');}
}

var towrite='';var flag=0;
document.write('<br><strong>');

if(showpostdate==true) {towrite=towrite+monthnames[parseInt(cdmonth,10)]+' - '+cdday+' - '+cdyear;flag=1;}

if(showcommentnum==true) 
{
if (flag==1) {towrite=towrite+' | ';}
if(commenttext=='0 Comments') commenttext='0 comentarios';
if(commenttext=='1 Comment') commenttext='1 comentario';
commenttext = '<a href="'+commenturl+'" target ="_top">'+commenttext+'</a>';
towrite=towrite+commenttext;
flag=1;
;
}

if(displaymore==true) 
{
if (flag==1) towrite=towrite+' | ';
towrite=towrite+'<a href="'+posturl+'" class="url" target ="_top">Más</a>';
flag=1;
;
}

document.write(towrite);

document.write('</strong></li>');
if(displayseparator==true) 
if (i!=(numposts-1))
document.write('');
}document.write('</ul>');

}
//]]>
</script>
<script style='text/javascript'>
var numposts = 10;
var showpostthumbnails = true;
var displaymore = false;
var displayseparator = false;
var showcommentnum = false;
var showpostdate = false;
var showpostsummary = true;
var numchars = 60;</script>
<script src='http://CHARKLEONS.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentpostswiththumbs'></script>

---------------------------------------------------------

Es importante que reemplacen la parte de la URL en la que sale CHARKLEONS con el título de la URL de sus blogs.

Ejemplo » http://MIBLOG.blogspot.com

 Solución al problema: No se ven las entradas en el gadget 

Esto ocurre si alguna de las imágenes (miniaturas) que toma el gadget tiene una url tipo https, la solución es dejar la url de la imagen sin la S en el http, esto se hace en modo HTML. Si esta no es la causa, lo más fácil es eliminar el gadget, volver a copiar el código y crearlo de nuevo.

Espero que esta información les sea muy útil.

Gracias.


Gadget intradas recientes en blogger, últimas entradas en blogger, cómo se agrega el gadget de últimas entradas en blogger, código del gadget de últimas entradas para blogger, cómo se edita o configura el gadget de últimas entradas para blogger, últimas entradas en blogger con imágenes, mostrar últimas entradas en blogger, gadget últimos temas en blogger, por qué no se ve el gadget de últimas entradas, por qué no se ve el gadget de entradas recientes en blogger, solución a la no visualización del gadget de últmas entradas, el gadget de últimas entradas no se ve en mi blog, gadget de entradas recientes no se ve en mi blog,