Como mostrar las últimas entradas de una categoría especifica en la barra lateral

¡ Artículo publicado en el blog El Balcón de Jaime, que pese a ser un blog terminado, es uno de los mejores en truvos blogger. ! Ve la entrada en su blog original.

Mostrar las últimas entradas de una etiqueta específica en la barra lateral

Ya hemos visto la forma de instalar un widget para mostrar, de forma aleatoria, las últimas entradas en el blog.

Siempre viene bien informar a los lectores de un blog acerca de las novedades que han sido incluidas o los últimos artículos añadidos y, por ello, he dado con un procedimiento muy sencillo para mostrar las últimas entradas o los últimos artículos de una etiqueta (categoría / tema) específico.

Básicamente utilizaremos el gadget "Feed" que ofrece blogger y, por medio de una dirección que apunta al feed de una etiqueta cualquiera, haremos visible los últimos títulos en el blog.

Diseño>añadir gadget (elemento de página)>html-javascript

Utiliza esta URL del feed:

http://elbalcondejaime.blogspot.com/feeds/posts/default/-/Widget%20%2F%20Gadget

En donde debes reemplazar elbalcondejaime por el nombre de tu blog, así como Widget%20%2F%20Gadget por la etiqueta escogida.

Importante: Si la etiqueta escogida está formada por una única palabra, por ejemplo "Fotos" no tendrás problema alguno y bastará con seguir los pasos.

Si por el contrario, la etiqueta escogida está formada por más de una palabra y por tanto, contiene espacios (como es el caso de Widget%20%2F%20Gadget, la etiqueta escogida por mí y que viene a ser: Widget / Gadget), deberás hacer lo siguiente:

1) Localiza una entrada agrupada en esa etiqueta.

2) Ya sea en el pie del post o bajo el título del artículo, localiza el enlace a la etiqueta y, con el botón derecho sobre él, selecciona: copiar la dirección del enlace...




Seguidamente obtendrás una línea similar a esta:

http://elbalcondejaime.blogspot.com/search/label/Widget%20%2F%20Gadget

Con los carácteres %20 que ves en naranja (representan espacios).

Tan solo debes copiar la etiqueta que aparece después de label/ y pegarla en la línea que cité al principio de la entrada.

Haz clic en continuar, una vez tengas todo listo y guarda el gadget para terminar.

Read More

Como mostrar las entradas con una etiqueta esecífica

¡ Artículo publicado en el blog El Balcón de Jaime, que pese a ser un blog terminado, es uno de los mejores en truvos blogger. ! Ve la entrada en su blog original.


Mostrar las entradas con una etiqueta específica en la portada del blog

Hacía tiempo que no traía un truco novedoso, algo más completo o un tanto más complicado de instalar que los efectos, widgets o aplicaciones que tan poco nos cuesta conseguir.

Con esto no insinuo que el truco de este post sea complicado pero algo distinto si que es, sobre todo en el sentido de que hay que buscar alguna que otra etiqueta, perdernos en el código de la plantilla para conseguir que en la portada de nuestro blog únicamente se muestren las entradas de una etiqueta en particular.

Por ejemplo, si en un blog se publica sobre temas de política y al mismo tiempo sobre gastronomía (dos cosas bastante distintas...) y queremos que tan solo las nuevas entradas de gastronomía queden visibles en la portada, a pesar de que publiquemos un nuevo artículo de política, aplicaremos este truco, utilizando la etiqueta "gastronomía" en el código.

Diseño>Edición de HTML>expandimos artilugios

Busca esta línea:

<b:loop values='data:posts' var='post'>

Y elimina todo el código que aparece después y hasta la etiqueta de cierre </b:loop> (sin incluirla).

En su lugar, introduce este otro bloque:

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<b:if cond='data:post.labels'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.name == &quot;ETIQUETA&quot;'>
<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><data:post.dateHeader/></h2>
</b:if>
<b:include data='post' name='post'/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:include data='post' name='comments'/>
</b:if>
</b:if>
</b:loop>
</b:if>
<b:else/>
<b:if cond='data:post.dateHeader'>
<h2 class='date-header'><data:post.dateHeader/></h2>
</b:if>
<b:include data='post' name='post'/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:include data='post' name='comments'/>
</b:if>
</b:if>

Ahora tan solo queda reemplazar la palabra ETIQUETA del código por la etiqueta que utilizas para agrupar las entradas que quedarán visibles en la portada. Es importante que escribas la etiqueta tal cual aparece en tus posts, es decir, con mayúsculas, minúsculas, tildes, espacios...

Haz vista previa para comprobar que no hay errores y guarda la plantilla para terminar.

Read More

Como mostrar las últimas entradas de una etiqueta en particular

¡ Artículo publicado en el blog El Balcón de Jaime, que pese a ser un blog terminado, es uno de los mejores en truvos blogger. ! Ve la entrada en su blog original.

Estás leyendo Ultimas entradas de una etiqueta en particular en el blog (script), en Widget - Gadget

Ultimas entradas de una etiqueta en particular en el blog (script)

Mostrar las últimas entradas en nuestro blog es un complemento muy útil para los lectores que desean acceder con facilidad y rapidez al contenido recientemente publicado. Son muchos los procedimientos que ya hemos visto para instalar esta herramienta. Ultimas entradas con miniatura de imagen, Últimas entradas en movimiento (widget de control manual) e incluso Mostrar las últimas entradas de una etiqueta específica.

Este último truco es el que precisamente explicaré en esta entrada. No se trata del mismo tutorial sino que he dado con otro procedimiento más simple y efectivo para mostrar lo mismo: una lista con los títulos de tus últimos artículos bajo una etiqueta en particular.

A continuación te muestro una imagen del resultado:

Diseño>Edición de HTML>expandimos artilugios

Busca la etiqueta </head> en tu plantilla y justo antes añade estas líneas:

<script src='https://sites.google.com/site/editoriosus/fds/UltimsblJtetiq.js'/><link href='https://sites.google.com/site/editoriosus/fds/blJtetik.css' media='screen' rel='stylesheet' type='text/css'/><style>#UltimblJtetiqu a {background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi7jlCxccXOlsZLYbF1k8WVJIP9JaNi-s4faQegcPQg4XE1bpp7E7HRqePESCc8LYXp1_xM3bxI_Nfaqr94bnwwpZ0D6ug42LSVQ2Tq_oVLsMx2vkVHWLtV9NkZG3NvKMNfHGLntC9K7MI/") no-repeat scroll 0 -6px transparent;}</style>

Seguidamente guarda la plantilla.

Diseño>añadir gadget (elemento de página)>html-javascript

Agrega esto en su interior:

<div id="UltimblJtetiqu"><script src="http://TUBLOG.blogspot.com/feeds/posts/default/-/ETIQUETA?max-results=10&alt=json-in-script&callback=blJtetiq"></script></div>

Reemplaza TUBLOG por la dirección de tu blog (no hace falta que incluyas el http:// o el .blogspot.com ya que tal y como puedes ver ha sido insertado).

En ETIQUETA escribe la etiqueta tal y como aparece en tus entradas (con sus mayúsculas, minúsculas, tildes, acentos...) de manera que los últimos posts puedan mostrarse.

En la línea max-results=10 puedes controlar el número de títulos que aparecerán. Aumenta o disminuye la cifra (10).

Guarda el gadget para terminar.

Read More

Cómo agregar suscripción al Feed por categorías

Artículo publicado en el blog Ciudad Blogger, uno de los sitios con más información sobre tecnología Blogger Ve la entrada en su blog original.

Cuando el blog tiene muchas temáticas también se tiene mucho tipo de público y muchas veces no se animan a suscribirse al feed porque saben que les llegará todo el contenido del blog y quizá sólo estén interesados en un tema específico.

Por ejemplo, un blog que habla de Chicas, Chicos, Amor, Relaciones, etc. puede ser interesante para todos, pero habrá quien no quiera recibir noticias de Chicos, quizá sólo entra al blog para leer las entradas sobre Chicas.

Bueno, para individualizar los feeds por categorías vamos a poner un ícono de suscripción junto a cada etiqueta para que el usuario tenga la opción de suscribirse sólo a la categoría que elija, de ese modo tendrá todas las actualizaciones de esa etiqueta.

Para ello debes tener el gadget de Etiquetas en tu blog, si aún no lo tienes entra a Diseño > Elementos de la página > Añadir gadget > Etiquetas.

(Si ya lo tienes omite el paso anterior)

Ahora entra a Diseño > Edición de HTML, marca la casilla Expandir artilugios, busca este código y agrega lo que está en color rojo:

<ul>
< b:loop values='data:labels' var='label'>
< li>


<a expr:href='data:blog.homepageUrl + &quot;feeds/posts/default/-/&quot; + data:label.name'><img alt='Suscribir' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrTa2Vq7md9rRTQ94uXzpClgBAGqYXJkzXf5SkYaqRE7D3eGB9OPiUber1-7bjISYJdN8vfyG1NyCtF-olLywX9-xp5f8bJaZRvw5xBzCWDgwKMfs31Y_lpm7eeGl0Mg3VEBHeANM7avc/s1600/feed.png' style='vertical-align:middle;border:0'/></a>


< b:if cond='data:blog.url == data:label.url'>
< span expr:dir='data:blog.languageDirection'>
< data:label.name/>
< /span>
< b:else/>
< a expr:dir='data:blog.languageDirection' expr:href='data:label.url'>
< data:label.name/>
< /a>
< /b:if>
< span dir='ltr'>(<data:label.count/>)</span>
< /li>
< /b:loop>
< /ul>

El resultado será este:

De esta forma cada etiqueta tendrá su propio feed y el lector decidirá si se suscribe a todo el contenido o sólo a las etiquetas que elija.

Si lo deseas puedes cambiar el ícono por el que tú quieras, sólo busca dentro del código rojo que agregaste la URL de la imagen y sustitúyela por la que quieras.

Read More

Autocategorías en Blogger: Muy útil para profesionalizar tu blog

Algunas veces queremos tener todo muy organizado para que nuestros lectores puedan encontrar con mayor facilidad los temas de su interés, y es ahí cuando en lugar de poner un gadget con las últimas entradas queremos poner sí las últimas entradas pero por categorías, de manera que puedas mostrar las últimas entradas por cada etiqueta que quieras y además mostrar la miniatura de dicho elemento.

 

Para poner en tu blog este gadget de últimas entradas por categorías realizaremos estos sencillos pasos:
1.- Entra en Diseño | Edición de HTML y antes de ]]></b:skin> pega lo siguiente:

/* Últimas entradas por categorías
--------------------------------- */
img.label_thumb{
float:left;
border:1px solid #8f8f8f; /* Borde de las miniaturas */
margin-right:10px !important;
height:55px; /* Alto de las miniaturas */
width:55px; /* Ancho de las miniaturas */
}
.label_with_thumbs {
float: left;
width: 100%;
min-height: 70px;
margin: 0px 10px 2px 0px;
padding: 0;
}
ul.label_with_thumbs li {
padding:8px 0;
min-height:65px;
margin-bottom:10px;
}
.label_with_thumbs a {}
.label_with_thumbs strong {padding-left:0px;}

2.- Luego antes de </head> pega este script:

<script type='text/javascript'>
//<![CDATA[
function labelthumbs(json){document.write('<ul class="label_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='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg3ew5hMCeGE3zuRVMwclMb0t0cS3oBirir2CC-S4SZnXpv2TpssVlTlge09OfiUNX1AJyizhiFHN3TNV4KeZ5VK2SjS0A4TVITbBPimHSVbaz3-R025EHENRrfZL8Ads9jvhNlg9IlTQY/';}
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('<a href="'+posturl+'" target ="_top"><img class="label_thumb" src="'+thumburl+'"/></a>');document.write('<strong><a href="'+posturl+'" target ="_top">'+posttitle+'</a></strong><br>');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('');document.write(postcontent);document.write('');}
else{document.write('');postcontent=postcontent.substring(0,numchars);var quoteEnd=postcontent.lastIndexOf(" ");postcontent=postcontent.substring(0,quoteEnd);document.write(postcontent+'...');document.write('');}}
var towrite='';var flag=0;document.write('<br>');if(showpostdate==true){towrite=towrite+monthnames[parseInt(cdmonth,10)]+'-'+cdday+' - '+cdyear;flag=1;}
if(showcommentnum==true)
{if(flag==1){towrite=towrite+' | ';}
if(commenttext=='1 Comments')commenttext='1 Comment';if(commenttext=='0 Comments')commenttext='No Comments';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('</li>');if(displayseparator==true)
if(i!=(numposts-1))
document.write('');}document.write('</ul>');}
//]]>
</script>

3.- Por último entra en Diseño | Elementos de la página | Añadir un gadget | HTML/Javascript y ahí pega esto:

<script type='text/javascript'>var numposts = 3;var showpostthumbnails = true;var displaymore = false;var displayseparator = true;var showcommentnum = false;var showpostdate = false;var showpostsummary = true;var numchars = 100;</script>
<script type="text/javascript" src="/feeds/posts/default/-/Nombre-de-la-etiqueta?published&alt=json-in-script&callback=labelthumbs"></script>

En donde dice Nombre-de-la-etiqueta va el nombre de la etiqueta que quieres mostrar, tal como es, respetando mayúsculas y minúsculas. En el caso que la etiqueta contenga espacios o acentos lo mejor es que ingreses a la etiqueta y te fijes en la URL que aparece en la barra de direcciones del navegador, al final de la URL vendrá el nombre de la etiqueta tal como debe ponerse, por ejemplo, si tuviera espacios se vería así:

http://Nombre-de-mi-blog.blogspot.com/search/label/Nombre%20etiqueta

También dentro de éste último código hay unas áreas que podemos personalizar, true significa que lo mostrará y false que no lo mostrará.

var numposts ← Número de entradas a mostrar
var showpostthumbnails ← Mostrar o no las miniaturas
var displaymore ← Mostrar o no el enlace para leer más
var displayseparator ← Mostrar o no un separador
var showcommentnum ← Mostrar o no el número de comentarios
var showpostdate ← Mostrar o no la fecha de las entradas
var showpostsummary ← Mostrar o no el resumen de las entradas
var numchars ← Número de caracteres en los resúmenes

Y en el segundo código hay una URL en color naranja, esa es la imagen que se mostrará cuando la entrada no contenga ninguna imagen, puedes cambiarla por otra imagen si lo deseas.

Recuerda que el gadget muestra las ultimas entradas de una etiqueta en particular, por lo tanto, si quieres mostrar las últimas entradas de otras etiquetas entonces sólo tienes que repetir el paso #3 por cada categoría adicional que quieras agregar.

Enlace

Read More