Posts aleatorios

Mostrar una entrada al azar es un tema recurrente y, lo confieso, nunca me ha parecido demasiado útil pero, como siguen preguntando, primero que nada, debo decirles que pueden verlo explicado acá, acá y acá así que, lo que sigue no aportará nada nuevo.

Es muy fácil de implementar, sólo necesitamos un pequeño script y un botón con un enlace donde hacer click.

Vamos al Diseño de la plantilla y en la solapa Edición HTML, sin expandir los artilugios agregamos el código justo antes de </head>:

<script type="text/javascript">
//<![CDATA[
var _yourBlogUrl = "URL_blog";
function randomPost() {
  var script = document.createElement("script");
  script.setAttribute("type", "text/javascript");
  var theUrl = _yourBlogUrl +"/feeds/posts/summary?alt=json-in-script &callback=getTotalPostsCallback&start-index=1&max-results=1";
  script.setAttribute("src", theUrl);
  document.documentElement.firstChild.appendChild(script);
}
function getTotalPostsCallback(json) {
  var totalResults = json.feed.openSearch$totalResults.$t;
  if (totalResults > 0) {
    getRandomPostNumber(totalResults);
  }
}
function getRandomPostNumber(totalResults) {
  var randomNumber = Math.floor((Math.random() * totalResults) + 1);
  getRandomUrl(randomNumber);
}
function getRandomUrl(randomNumber) {
  var script = document.createElement("script");
  script.setAttribute("type", "text/javascript");
  var theUrl = _yourBlogUrl +"/feeds/posts/summary?alt=json-in-script&callback=getTheUrlCallback&start-index=" 
+ randomNumber + "&max-results=1";
  script.setAttribute("src", theUrl);
  document.documentElement.firstChild.appendChild(script);
}
function getTheUrlCallback(json) {
  var theUrl;
  for(var i = 0; i < json.feed.entry[0].link.length; i++) {
    if (json.feed.entry[0].link[i].rel == "alternate") {
      theUrl = json.feed.entry[0].link[i].href;
      break;
  }
}
if(theUrl) { window.location.href = theUrl; }
}
//]]>
</script>

Donde, lo único que debemos cambiar el la dirección del blog. Ahora falta agregar el enlace. Creamos entonces un elemento HTML y allí colocamos el texto o la imagen que nos servirá de botón:

<a href="javascript:randomPost();"> TEXTO/IMAGEN </a>