Enlace para post aleatorio en entradas | Oloblogger Esto me lo preguntó hace ya unos días nEjO y el asunto se quedó traspapelado entre mis marcadores, así que ese es el motivo por el que no lo...

29 de diciembre de 2010

Enlace para post aleatorio en entradas

Esto me lo preguntó hace ya unos días nEjO y el asunto se quedó traspapelado entre mis marcadores, así que ese es el motivo por el que no lo he publicado antes: sorry.

Se trata de hacer lo mismo que podeis ver actualmente al final de cada anotación de este blog, dónde se os invita a ver otro post cualquiera mediante un enlace que lleva a un post al azar. Realmente la cosa es sensilla, sensilla, sobre todo si ya tenemos el script para posts aleatorios instalado en cualquier otro sitio. Pero como nos gusta explicar las cosas, desarrollaremos un poco el porqué hay que hacerlo como se hace.

Pero vamos por el principio por si no teneis instalado este script. Lo primero es ir a Diseño ► Elementos de Página y allí buscar el lugar dónde queremos añadir el enlace que nos llevará a una entrada al azar. Pinchamos en Añadir un gadget y escogemos uno tipo HTML/JavaScript. En la ventana emergente pegamos lo siguiente:

<div id="myLuckyPost"></div>
<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">Entrada al azar</a>

No tenemos Vista Previa, así que Guardamos y comprobamos que todo va bien. Ya tenemos nuestro enlace operativo (en un menú, debajo de la cabecera, en la barra lateral...).

La mayor parte del código (en realidad todo menos lo marcado en otro color) es el script que mediante cuatro pequeñas rutinas (funciones), lee nuestro feed, escoge de manera aleatoria una de nuestras entradas y nos lleva a ella. La última línea (repito, en otro color), lo único que hace es crear un enlace que al pincharlo (onclick) llama a la función principal y ejecuta todo lo anterior.

Entonces, para colocar el enlace en otro sitio distinto, sólo tendríamos que cortar esa última línea y ponerla en otro lado. El resto del código se puede quedar en el gadget dónde lo hayamos metido sin ningún problema. Podeis comprobar que si cortamos la llamada (última línea)  y no la ponemos en ningún sitio, simplemente no se verá nada. El script seguirá en su sitio y dispuesto para ser utilizado, pero al no existir nada que le ordene comenzar, permanecerá inactivo. Es decir, se leerá, pero no se ejecutará.

Bueno y ahora que tenemos el script por un sitio y la llamada por otro (copiada en vuestro portapapeles, supongo; si no es así, la copiais de nuevo del trozo de antes) sólo tenemos que colocarla en la entrada.

Y esto es sólo una manera de hablar, porque realmente no la pondremos en la entrada. Blogger guarda lo que nosotros redactamos en cada anotación, en una variable que encontrareis en vuestra plantilla como <data:post.body/> y dicha variable no es manipulable por nosotros a posteriori desde otro sitio distinto del propio editor. Así que lo que haremos será poner nuestro código en la plantilla, justo después de esa variable, para tenga una continuidad y parezca que es parte de la entrada.

Así que ya estais editando HTML con Plantillas de artilugios expandidas y buscando (CTRL+F siempre ayuda a ello) la variable mencionada. Justo después pegamos lo que antes habíamos cortado.


<p>Vemos <a href='#ramdom' onclick='feelingLucky();' title='Entrada al azar'>otro post cualquiera</a> por si le encontraras alguna utilidad?</p>

¡Voila!

Podemos cambiar el texto que forma el enlace y el que está fuera de este por el que queramos. Sería la parte marcada en verde. Cada cual que lo haga a su estilo ▼

¿Vemos otro post al azar por si le encuentras utilidad o quizás prefieres ser más metódico y suscribirte a nuestras entradas por correo? También puedes imprimir este artículo y por supuesto compartirlo en redes sociales si fue de tu agrado.

Compartir
Copy URL

Y muchos más artículos interesantes si nos sigues en...

follow us in feedly

49 comentarios :

  1. Gracias por otra buena entrada Oloman, ya la he instalado. Espero que pronto averigües lo de la aleatoriedad por etiquetas.
    Un abrazo y feliz 2011 desde "El Universo del Mus"

    ResponderEliminar
  2. Buen truco, pero si usas el leer mas de blogger, aparece en los post antes del leer más. Lo bueno sería que apareciera sólo al final del post en las entradas individuales.

    ResponderEliminar
  3. Lluis no hay por qué ponerlo todo. Sólo aquello que se crea necesario o conveniente.

    Charly, lo cierto es que no lo he mirado. Te tengo en la lista del largo plazo, junto con otro montón de cosas más. Hay mucho todavía por aprender.

    Bucan ¿te refieres al sistema de Blogger o a otro? No lo he probado, pero supongo que en cualquier caso, con que coloques un condicional para la llamada al script, la cosa se puede solucionar:
    <b:if cond='data:blog.pageType == &quot;item&quot;'>

    <p>Vemos <a href='#ramdom' onclick='feelingLucky();' title='Entrada al azar'>otro post cualquiera</a> por si le encontraras alguna utilidad?</p>

    </b:if>

    ResponderEliminar
  4. Hola, tengo una pregunta. Hoy coloqué los botones de Me gusta a mis entradas con la ayuda de tu post. Pero ahora tengo una duda. No queda bien, ya que el título esta muy pegado. Quisiera saber como hacer para poner mi título como el tuyo, con una barra (más o menos) que separe un poco el título de la entrada, de el header de la entrada. Porque quiero hacer un header igual al tuyo. Por si queres echarle una ojeada a mi blog: notannuevo.blogspot.com

    ResponderEliminar
  5. Amigo Oloman,

    Me ha ocurrido una cosa rara con el blog, que te voy a comentar.
    Al intentar entrar en mi blog me salía esto:

    No ha sido posible encontrar el blog que buscas. Accede en caso de que seas el propietario.

    Volver a Blogger

    Le he dado a Accede y me ha salido lo siguiente:

    Cuenta
    Contraseña

    Luego me me ha salido una ventana en la que me pedía un número de móvil para que me enviasen un código. Lo he hecho y me han enviado al móvil un código, que he puesto en el lugar correspondiente.

    Entonces mi blog ha vuelto a funcionar perfectamente.

    ¿Crees que se trata de algo raro o de un timo de móviles?
    ¿Sería prudente cambiar la contraseña del blog?

    He comprobado que es lo mismo que le pasa al blog
    http://musipoemas.blogspot.com/

    Te estaré sumamente agradecido.

    Un abrazo y Felices fiestas.

    Antonio

    ResponderEliminar
  6. Que en estas fiestas, la magia sea tu mejor traje, tu sonrisa el mejor regalo, tus ojos el mejor destino, y tu felicidad mi mejor deseo.

    Este año no esperes regalos. Estoy de copas con los Reyes Magos y la cosa se nos ha ido de las manos.

    Feliz 2011 ..muakksssss

    ResponderEliminar
  7. Paso a desearte un feliz año nuevo y aprovecho para comentar que aunque no suelo comentar en este blog, sí lo sigo con asiduidad porque me resulta muy útil!

    Un abrazo enorme,
    Manu UC.

    ResponderEliminar
  8. ¡Feliz año nuevo Oloman! Mis deseos más sinceros para que este año que comienza te traiga muchas satisfacciones y salud para ti y tus seres queridos.
    Y hablando de salud... ¡Salud!

    ¡Un abrazo!

    ResponderEliminar
  9. Mark la forma más fácil y rápida de separar título y contenido, es añadiendo un margen inferior (o superior)a la clase post-header-line-1. Si en lugar de alterar el CSS, buscas eso mismo en la parte HTML, entonces podrás añadir un HR/ para que te coloque una línea divisoria.

    Antonio, en este caso creo que puedes estar tranquilo. No lo recuerdo del todo, pero me suena que tuve que hacr lo mismo hace un tiempo. Felices fiestas.

    Balovega, Manuel, El Potro, un poco tarde, pero yo también os deseo un estupendo 2011.

    ResponderEliminar
  10. Muchas gracias Oloman :) Saludos desde Paraguay.

    ResponderEliminar
  11. hola, y si en ves de poner el texto que diga "entrada al azar" quiero una imagen como seria el codigo, porque intente poner el html normal e invocar la funcion pero no se veia nada, gracias.

    ResponderEliminar
  12. Dreamare, sólo tendrías que cambiar...
    Entrada al azar
    ...por...
    <img src="URL_IMAGEN"/>

    ResponderEliminar
  13. jaja era bastante fácil, pero no lo ponía en el lugar que era, muchas gracias

    ResponderEliminar
  14. Muchísimas gracias, ya lo he puesto en mi blog y también lo he explicado en el mío, remitiendo por supuesto a tu página, a la que he añadido también como enlace de interés. Para mí, que estoy empezando con esto del blog, me resultan de mucha ayuda tus artículos, y por eso quiere darte UN MILLÓN DE GRACIAS.

    ResponderEliminar
  15. Hola acabo de ponermo en mi blog y me lleva a otr pagina y me dice "SUSCRIBIRSE A ESTE CANAL USANDO MARCADORES DINAMICOS" asique lo saque tenes idea cual puede ser el error ya que el tuyo si anda y en mi blog no. Saludos
    http://librenaturalezasangre.blogspot.com

    ResponderEliminar
  16. Me confundi de post te comento en de los dados tb

    ResponderEliminar
  17. Pero yo keria poner una imagen en ves de link

    ResponderEliminar
  18. Meneco, para eso, en el último trozo sólo tienes que sustituir el texto del enlace por el código de una imagen (IMG):

    <p><a href='#ramdom' onclick='feelingLucky();' title='Entrada al azar'><img src='DIRECCION_IMAGEN'/></a></p>

    ResponderEliminar
  19. Hola Oloman

    Estaba buscando una variación de el enlace que presentas aquí, por si podías orientarme: un código para que te seleccionara la entrada aleatoria al cargar la página y que te incluyese una imagen del mismo (cuando estuviera disponible). Sería el equivalente al widget de las entradas más vistas pero para una entrada al azar.

    ¿Te suena algo así?

    Un saludo
    Malapata

    ResponderEliminar
  20. Se de un sistema para obtener una lista de enlaces aleatorios, Malapata, pero faltaría averiguar cómo conseguir la posible miniatura. De todas formas, eso que buscas se parece muchísimo a lo que se explica en esta entrada. Por lo que cuentas, pienso que te puede servir.

    ResponderEliminar
  21. Oloman: Ciertamente, no había pensado en algo de ese tipo. Yo utilizo uno de esos sistemas y la verdad es que en lo de "relacionadas" no afinan mucho.

    Me queda la duda de si estos sistemas funcionan sólo al final de una entrada o también pueden ir en la barra lateral y salir en la portada del blog. Será cuestión de probarlo.

    Saludos

    ResponderEliminar
  22. Esos sistemas se basan simplemente en buscar entre posts con la misma etiqueta y por eso no están demasiado bien relacionados Malapata. Personalmente y mientras funcione, uso Linkwithin, que me da la impresión que usa otro algoritmo más acertado.

    Creo recordar que el sistema del enlace sí funciona en portada pero no lo recuerdo a ciencia cierta. Sin embargo, ten en cuenta que la relación con un solo post (en una entrada individual) será más razonable porque no habrá múltiples etiquetas. Para eso casi mejor presentarlos al azar.

    Si pruebas algo de eso, encantado de leer por aquí los resultados.

    ResponderEliminar
  23. Hey, gracias hermano por este gadget ;)

    ya lo instalé en mi blog pero no me funciona en las entradas :(

    realicé todos los pasos que aqui mostraste, solo funciona en un gadget que puse en la página principal pero no en las entradas, este es mi blog:

    malcolmlatino.blogspot.com

    ResponderEliminar
    Respuestas
    1. Tienes que meter el segundo trozo de código dentro de post-body tal y como se explica en el post. Tú lo pusiste en el footer, dentro del apartado de entradas relacionadas.

      Eliminar
    2. claro, es que ahí lo quería meter jeje..
      ¿entonces si lo pongo ahí no funciona?

      Eliminar
    3. No lo he probado, pero ya que coincide el contenido de este post con lo que quieres hacer, lo mejor es que lo hagas tal cual es indica.

      Eliminar
    4. bueno, gracias por el dato :)

      toca ponerlo en el body nomas jeje

      Eliminar
  24. Hola Oloman, te quiero decir que me decidí por probar este script, y unos segundos después de implementarlo (en mis vagos recuerdos de ese fatídico momento puedo contar 30 segundos como máximo) Apareció el apartado de que mi blog había sido eliminado, pensé que había entrado mal al blog, comprobe infi-milesimas de veces la url, hasta que pude decir "como rayos paso esto", hice todo los pasos para recuperarlo.. (comprobación por móvil y tal) me dijeron que en menos de 20 horas me respondían al correo, y pues vi la luz inalcanzable para poder recuperar el blog, pero cuando voy a revisar mi correo efectivamente tenia un mensaje nuevo que decia que mi blog se ha eliminado, abro el mensaje y dice las profundas, terrorificas y sombrias palabras que nunca queras leer como bloguero:

    "Hola: Se ha revisado tu blog (http://d-nets.blogspot.com/) y se ha confirmado que infringe nuestras Condiciones de servicio en lo que respecta a MALICIOUS_JAVASCRIPT. Hemos borrado el blog según lo estipulado en estas condiciones, por lo que ya no se puede acceder a la URL."

    La verdad es que fue mucho tiempo dedicado, y casi perdido al 100% con este blog, ya que no había ni publicado una entrada, en estas 2 ultimas semanas lo venia personalizando. No quisiera pensar que fue este script, pero la coincidencia es enormemente alta. ya que la eliminación del blog fue por el uso de algún código JavaScript.

    Si se pudiera revisar de nuevo el código seria excelente, así a nadie mas le pasara o no se si este código y algún otro que tenia conjugaron para hacerme esta mala pasada.

    (si ya se que debía de utilizar mi blog de pruebas, pero como excusa dejo que el script era bastante sencillo y solo era de ponerlo en un gadget)

    Saludos!

    ResponderEliminar
    Respuestas
    1. Hola !
      volvi a enviar una solicitud de recuperacion y ya esta todo bien dicen que fue un error.

      "Hola: Hemos recibido tu apelación en relación con tu blog http://d-nets.blogspot.com/. Después de revisarla en detalle, hemos determinado que nuestro sistema automatizado había señalado por error que tu blog incumplía las Condiciones de servicio y, por tanto, lo hemos restablecido. Lamentamos las molestias que este proceso te haya podido causar y agradecemos tu paciencia mientras llevábamos a cabo la revisión. Gracias por tu comprensión. Un saludo, El equipo de Blogger"

      Eliminar
    2. Hola. Ayer vi tu comentario en mi correo pero no tuve tiempo de contestarte. En primer lugar gracias por ponernos sobre aviso.

      Suponía que no tenía nada que ver con este código porque es de los que yo mismo tengo tengo puestos en este blog desde hace tiempo sin problemas. Al final de cada post lo puedes ver.

      Ahora parece que confirmas que fue una coincidencia y que sólo fue un error puntual de Blogger. Pues me alegro, tanto por no tener nada que ver en el susto, como porque hayas recuperado tu blog :)

      Y segundo agradecimiento por avisar de que se solucionó el asunto antes de que me volviera loco buscando el fallo en el script ;)

      Eliminar
    3. Si bueno al pareces los robots de google que analizan el spam, al analizar este blog pues determinaron que era spam por utilizar algún código javascript, pero al yo enviar una solicitud al soporte comentaron que todo era un error. así que el script es 100% funcional. Gracias por compartirlo !

      Eliminar
  25. Que tal Oloman, aunque estoy muy interesada en incluir el gadget de entradas aleatorias en mi blog http://nocturna-scarlett.blogspot.mx/ aún lo estoy pensando porque me encontré que en un post similar de ciudad blogger el potro dice que google percibe dicho script (el que él recomendaba) como malicioso, incluso tachó todo el post y pues el comentario de Alexander Ortiz R. me ha echo dudar todavía más ¿a qué crees que se deba que este gadget en particular cree tantos problemas?

    Y otra duda que tengo ¿Google penaliza el uso de widgets para intercambio de enlaces como BlogRush o BlogUpp?

    Sé que parece que peco de precavida pero es que como en realidad soy autodidacta, no sé nada de lenguaje HTML y le he dedicado mucho tiempo a mi blog, prefiero irme por técnicas de SEO completamente seguras. Y bueno, no está de más agradecerte porque siempre resuelves mis dudas, de verdad muchas gracias.

    ResponderEliminar
    Respuestas
    1. Lo dije en 26.2, pero yo nunca he tenido ningún problema con este código. Es más, si ves el comentario anterior al tuyo parece ser que el problema venía de otro sitio pero como se ve que estáis muy susceptibles con lo de los posts aleatorios, pues ya pensais en primer lugar que cualquier problema viene de ahí. Yo no voy a ser quién te anime a ponerlo, pero si puedo afirmar que nunca tuve problemas.

      Los widgets esos que comentas no los conozco pero lo que si te puedo confirmar es que actualmente Google penaliza el intercambio de enlaces, pero esto es como en la vida real: si no te pillan puede ser que te escapes. Si quieres mi opinión, yo creo que no deberías hacer intercambio de enlaces de ninguna manera. Hacer unos pocos enlaces recíprocos con blogs amigos es normal, pero todo lo que pase de ahí yo creo que penaliza y que actualmente, bastante.

      Y para terminar, el SEO de toda la vida es cada vez es menos efectivo con los nuevos algoritmos de Google. O al menos eso pretenden.

      Eliminar
  26. A mi Blogger me eliminó el blog en cuanto puse el gadget ese de ver post al azar. En cuanto le dí a ejecutar para probar, bloqueó el blog y lo eliminó. Escribí a Google en el foro para que lo reconsideraran pero a los dos días me contestaron que el blog se eliminaba porque ese script era spam, sin más explicaciones. ¿Porqué lo consideraran spam?.

    Así que ojo. Si alguien lo ha puesto sin problema que diga como.

    ResponderEliminar
    Respuestas
    1. Algo así me lo dijeron varios, pero en la mayoría de casos quedó acreditado que fue casualidad y coincidencia con otros cambios. Mira el comentario 26.3, por ejemplo.

      Eliminar
  27. Hola Oloman
    Yo he puesto el enlace a la entrada aleatoria pero cuando cambio el tamaño de la letra o el texto el enlace se rompe y se va a la página de blogger en donde editamos las entras etc.
    Si no cambio nada y corto y pego el código con tu frase funciona correctamente.
    ¿Dónde me equivoco? es por que elimino algún espacio o que no se puede cambiar?

    ResponderEliminar
    Respuestas
    1. Hola
      Me resulta imposible saberlo con los datos que me das, pues el tamaño de fuente no debe afectar para nada el funcionamiento del script. Igualmente con el texto del enlace.
      Efectivamente debe ser que quitas algo de más pero no se me ocurre qué puede ser porque sólo se trata de cambiar los caracteres "otro post cualquiera" que están dentro del enlace.

      Eliminar
    2. Gracias por tu ayuda. No te doy más datos porque lo único que hago es cambiar el texto que se va a ver así que no se lo que puedo hacer mal porque son mínimos los cambios que hago.
      De todas maneras decirte que las voy poniendo y a mi me funcionan. Por si quieres ver el blog y decirme algo es POmOdOrO music Co (http://pomodoromusicco.blogspot.com.es/)

      Eliminar
    3. Una vez más gracias por tu ayuda.
      P.D. me encanta tu blog que da ideas y enseña nuevas funciones para el blog

      Eliminar
    4. Ahora he logrado adivinar qué es lo que me decías... creo :)
      Si es lo que pienso, cuando pones código en una entrada y le das a Vista Previa desde la pestaña Redactar del editor, Blogger a veces te cambia cosas. Por ejemplo, en un enlace con una almohadilla (#) es muy frecuente que pase eso que dices y precisamente este código la lleva (#random). Eso no tiene arreglo.

      Pero si quieres que no te pase, no pongas el enlace en la entrada, sino dónde dije en este post, tras el data:post.body. Así te ahorrarás tenerlo que arreglar tras cada edición.

      Eliminar
    5. Si igual no me explique bien.
      El problema era cuando al final de la entrada cambiaba el tamaño de la letra de normal que es como lo escribe a grande que es como quiero que se vea en el post, pero cambie el tamaño de la letra en el diseño general pasandola a 20 y ya no tengo que cambiar la en el codigo y ya me va bien.
      gracias seguire consultando tu blog

      Eliminar
    6. Yo prefiero añadir el mínimo código posible a las entradas, así que mi recomendación seguirá siendo que pases eso del enlace al azar a la plantilla... pero como gustes.

      Eliminar
    7. He tenido que releerlo varias veces pero al fin he entendido como hacerlo de forma correcta.
      Lo que pasa es que poniendolo en la plantilla queda muy abajo en mi blog.
      De todas maneras ya lo hago funcionar poco a poco.
      Muchas gracias Oloman

      Eliminar
  28. Es cierto que ese codigo blogger lo puede detetar como virus

    ResponderEliminar
  29. No entendí nada, pero igual funcionó. Muchas gracias, casi que te debo la construcción de mi blog, he hecho muchas cosas en él, gracias a tus aportes. Gracias :* :* :*

    ResponderEliminar
  30. Muy bueno!, lo he agregado, estuve cacharreando y solucione la velocidad y algunos datos más para el SEO de mi blog, ya que contiene y habrán más imágenes es lo que la hace más pesada. Gracias por todo. Algún día deberías visitar Cartagena de Colombia, hay playas y mujeres hermosas, jajajajja Te dejo mi web por si deseas pasarte a ojear: www.kangutingo.com

    ResponderEliminar
    Respuestas
    1. Gracias, pero me conformo de momento con "mi Cartagena"... la de España. También hay de ambas ;)

      Eliminar