Con la tecnología de Blogger.

viernes, 14 de junio de 2013

Blogger Posts al azar






Una forma de mantener por más tiempo a los lectores en el blog es poderles ofrecer más contenido que puedan disfrutar.
Gracias a Oloblogger vamos a ver dos formas de poner entradas al azar, uno es un enlace que al presionarlo mostrará una entrada al azar, y el otro es una lista de entradas aleatorias y siempre que se recargue la página aparecerán entradas distintas en la lista.Ambos funcionan con un script y son sencillos de instalar en la plantilla.



Enlace de entradas al azar


Entra en Diseño > Elementos de la página > Añadir gadget > HTML/Javascript y pega esto:

<script type='text/javascript'>
function showLucky(root){
var feed = root.feed;
var entries = feed.entry || [];
var entry = feed.entry[0];
for (var j = 0; j < entry.link.length; ++j) {
if (entry.link[j].rel == "alternate") {
window.location = entry.link[j].href;
}
}
}
function fetchLuck(luck){
script = document.createElement('script');
script.src = '/feeds/posts/summary?start-index='+luck+'&max-results=1&alt=json-in-script&callback=showLucky';
script.type = 'text/javascript';
document.getElementsByTagName('head')[0].appendChild(script);
}
function readLucky(root){
var feed = root.feed;
var total = parseInt(feed.openSearch$totalResults.$t,10);
var luckyNumber = Math.floor(Math.random()*total);
luckyNumber++;
fetchLuck(luckyNumber);
}
function feelingLucky(){
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = '/feeds/posts/summary?max-results=0&alt=json-in-script&callback=readLucky';
document.getElementsByTagName('head')[0].appendChild(script);
}
</script>
<a href="#random" onclick="feelingLucky()" title="Entrada al azar"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi659imJBvQ8-8aLM15EsoujwmDeByw5FZGQFcRwEQFQkQJLfCw7PD7GfLJitd7ifKONV1jZEUuqR923WxFH9VhimLbAepCTJhXJGp994RWZvebDGUpHkTZ3-F9T2JYWeAXhpy65s-VbrrT/s1600/2edma7d.png" valign="middle" border="0" /> Ver una entrada al azar</a>


 Ver una entrada al azar


Puedes cambiar la URL que está en rojo por la de otra imagen, de igual modo puedes modificar el texto que se encuentra al lado o eliminarlo.

Lista de entradas al azar


Entra en Diseño > Elementos de la página > Añadir gadget > HTML/Javascript y pega lo siguiente:

<div id="random-posts">
<script type="text/javascript">
function getRandomPosts(json) {
var maxEntries = 5;
var numPosts = json.feed.openSearch$totalResults.$t;
var indexPosts = new Array();
for (var i = 0; i < numPosts; ++i) {
indexPosts[i] = i;
}
indexPosts.sort(function() {return 0.5 - Math.random()});
if (maxEntries > numPosts) {
maxEntries = numPosts;
}
var container = document.getElementById('random-posts');
var ul = document.createElement('ul');
for (i = 0; i < maxEntries; ++i) {
var entry = json.feed.entry[indexPosts[i]];
var li = document.createElement('li');
var a = document.createElement('a');
a.title = entry.title.$t;
for (var j = 0; j < entry.link.length; ++j) {
if (entry.link[j].rel == 'alternate') {
a.href = entry.link[j].href;
break;
}
}
a.appendChild(document.createTextNode(entry.title.$t));
li.appendChild(a);
ul.appendChild(li);
}
container.appendChild(ul);
}
</script>
<script src="http://nombre-de-mi-blog.blogspot.com/feeds/posts/summary?alt=json-in-script&callback=getRandomPosts&max-results=999" type="text/javascript"></script>
</div>

El resultado será este:



Cambia el nombre de tu blog donde se indica. El número en color rojo es el número de entradas que se mostrarán en la lista, puedes modificarlo por otro número si lo deseas.