Radio Altimiras

Todo el rock en tu radio.

Toda la musica en

Radio Altimiras

Radio Altimiras

Desde Chile al mundo .

Radio Altimiras

La musica del Mundo en tus oidos.!

En tus oídos

Radio Altimiras

jueves, 10 de diciembre de 2015

Marquesinas ( todo )

MARQUESINAS
Las marquesinas son texto en movimiento. Ya funciona con ambos navegadores (hasta hace poco Netscape no lo implementaba, el 7 ya lo hace).
La etiqueta es <MARQUEE>, un texto a desplazar y su cierre </MARQUEE>. Sin atributos quedará:

<BODY>
<MARQUEE> Aquí pongo el texto </MARQUEE>
</BODY>

Aquí pongo el texto
Así vemos los que tiene por defecto y que son: ocupa todo el ancho del cuadro, tiene la altura de la línea de texto y va de derecha a izquierda.
Podemos poner varias frases si colocamos <P> o <BR> dentro.
<BODY>
<MARQUEE> Aquí pongo un texto <P>
Y aquí otro
</MARQUEE>
</BODY>

Aquí pongo el textoY aquí otro
Vamos a empezar a meter atributos y a cambiar un poco la cosa.
Empezamos con las medidas que son las viejas conocidas WIDTH y HEIGHT que toman valores en píxeles o en porcentajes de pantalla.

<BODY>
<MARQUEE WIDTH=70% HEIGHT=40> Aquí pongo el texto
</MARQUEE>
</BODY>
Que se verá con 70% de ancho (del cuadro azul que para los efectos es como si fuera la pantalla completa) y 40 px de alto.

Aquí pongo el texto
El color de fondo quedará curioso. Echamos mano del atributo BGCOLOR.
<BODY>
<MARQUEE BGCOLOR=#7070ff> Aquí pongo el texto
</MARQUEE>
</BODY>

Aquí pongo el texto
No funciona con imágenes como fondo.
No he conseguido alinear el texto que rodea al cuadro de marquesina con la vieja ALIGN, que toma valores de top, bottom, middle, left y right. Según todos lo manuales debería funcionar como lo hacían en la etiqueta <IMG> pero no me funciona con Explorer 6 y con Netscape 7 hace cosas raras.
El atributo BEHAVIOR es el que da más juego, su valor por defecto es scroll que significa que aparece por la derecha, se va a la izquierda y de forma continuada. Si le damos el valor slide y alternate tenemos:

<BODY>
<MARQUEE BEHAVIOR=slide> Aquí pongo el texto
</MARQUEE>
</BODY>

Aquí pongo el texto
Para verlo funcionar actualiza la página ya que al pararse y funcionar sólo una vez, no lo vemos.

<BODY>
<MARQUEE BEHAVIOR=alternate> Aquí pongo el texto
</MARQUEE>
</BODY>

Aquí pongo el texto
DIRECTION servirá para definir hacia donde mando el texto que, por defecto, va hacia la izquierda. Yo puedo mandarlo a la derecha así:
<BODY>
<MARQUEE DIRECTION=right> Aquí pongo el texto
</MARQUEE>
</BODY>

Aquí pongo el texto
O hacia arriba o abajo con down y up.
<BODY>
<MARQUEE HEIGHT=50 DIRECTION=up> Aquí pongo el texto
</MARQUEE>
</BODY>

Aquí pongo el texto
La velocidad de desplazamiento varía con SCROLLAMOUNT, que marca los saltos según el valor numérico; y SCROOLDELAY que determina el retraso en el movimiento en milisegundos. Veámoslo:

<BODY>
<MARQUEE SCROLLAMOUNT=40> Aquí pongo el texto
</MARQUEE>
</BODY>

Aquí pongo el texto
Mareante...

<BODY>
<MARQUEE SCROLLDELAY=1000> Aquí pongo el texto
</MARQUEE>
</BODY>

Aquí pongo el texto
Y este desespera (le he puesto 1000, que es un segundo).
El atributo LOOP (indefinido por defecto, como ya hemos visto), define el número de veces que vamos a ver moverse el texto.

<BODY>
<MARQUEE LOOP=2> Aquí pongo el texto
</MARQUEE>
</BODY>

Aquí pongo el texto
Tendremos que actualizar la página.
Los atributos HSPACE Y VSPACE los conocemos, definirían el espacio horizontal y vertical del texto fuera de la marquesina.

<BODY>
<MARQUEE BGCOLOR=yellow VSPACE=20> Aquí pongo el texto
</MARQUEE>
Otro texto.
</BODY>

Aquí pongo el textoOtro texto
Ni que decir tiene que podemos aplicar otras etiquetas como la de centrado, por ejemplo. Le pondremos color para que se distinga del fondo.
<BODY>
<CENTER>
<MARQUEE WIDTH=50% BGCOLOR=#ffff00> Aquí pongo el texto
</MARQUEE>
</CENTER>
</BODY>

Aquí pongo el texto
Mira esto que bonito que queda con la etiqueta <FONT>:

<BODY>
<CENTER>
<MARQUEE WIDTH=70% BGCOLOR=#ffff00>
<FONT FACE=arial COLOR=red SIZE=5>
Aquí pongo el texto
</FONT>
</MARQUEE>
</CENTER>
</BODY>

Aquí pongo el texto
También la podemos meter en una tabla (ya se verán más adelante).

Aquí pongo el texto
O meter la tabla en la marquesina:

Aquí pongo el texto

Y podremos poner imágenes en vez de texto.
<MARQUEE WIDTH="80%" BEHAVIOR="alternate"> <IMG SRC="imagen.gif"> </MARQUEE>

martes, 8 de diciembre de 2015

Cómo alojar scripts en la plantilla

Cómo alojar scripts en la plantilla

26 de febrero de 2010 140 comentarios ,
El tema del alojamiento de los scripts es un tema recurrente debido a que no todos los servicios gratuitos de hosting admiten este tipo de archivos, o bien, porque pueden tardar mucho en cargar si el ancho de banda del hosting es reducido, lo que trae consigo que el blog tarde en cargar.
Si bien podemos alojarlos en Google Sites o Dropbox también podemos alojar los scripts en la propia plantilla, de este modo el tiempo de carga de la página será menor y dejaremos de estar dependiendo de un servicio externo a Blogger.

Alojar los scripts directo en la plantilla funciona para casi todos los casos, aunque es posible que haya uno u otro script que se resista y ese sí tendremos que alojarlo en un servicio independiente.

Para alojar los scripts en la plantilla hay dos formas, una es entrando a Plantilla | Edición de HTML y antes de </head> pegamos lo siguiente:
<script type='text/javascript'>
//<![CDATA[
...contenido del script...
//]]>
</script>

Habremos de agregar donde se indica el contenido del script.
¿Cómo sacar el contenido del script?
Pega la URL del script en la barra de direcciones de tu navegador, si abre una página llena de códigos ese es el contenido del script; si en su lugar descarga un archivo con extensión .js entonces abre el archivo con WordPad y copia y contenido del script.

La otra opción es entrar en Diseño | Añadir un gadget | HTML/Javascript y ahí pegar en un sólo elemento el contenido de todos los scripts que quieras. Se haría casi de la misma forma:
<script type='text/javascript'>
...contenido del script...
</script>


Con cualquiera de estas dos formas tendremos los scripts alojados en nuestra propia plantilla con lo que dejaremos de depender de otros servicios y nos ahorraremos algo de tiempo en la carga de la página al no depender del ancho de banda de los demás.


Radio para blogger o web

Radio para blogger o web


Desde el minuto 8:45
Radio en un reproductor HTML5

La gran ventaja de este reproductor es que servirá si los visitantes de nuestra página acceden a ella a través de dispositivos móviles (smartphones/tablets) usando los navegadores Firefox o Chrome, si se hace desde una PC lo pueden hacer a través de cualquier navegador. Su código es muy sencillo, solo deben agregar la url de la ip de la radio y listo. El código se debe agregar en modo HTML o en un gadget HTML-Javascript. Si no quieren que la reproducción inicie automáticamente retiren la palabra "autoplay" de la primera línea del código.
------------------------------------
<audio autoplay controls>
<source src="URL de la IP de la RADIO/;stream.nsv" type="audio/mpeg"></source>
Tu navegador no soporta audio en HTML5. Por favor usa Firefox o CHROME.
</audio>
------------------------------------
Por favor revisen luego de agregar la URL de la IP de la radio que no falte o sobre un caracter, por ejemplo que queden dos barras inclinadas al final de la URL de la ip, o falten o sobren unas comillas.
Ahora, para obtener la URL de una emisora conozco la siguiente forma, ingresa a esta página mundoXAT.com selecciona un género, y luego haz clic sobre el botón "Obtener IP", ahora, notarás que cada URL termina con un número antecedido con dos puntos, ese último número que sigue a los dos puntos es el puerto, en dado caso que quieras usar un reproductor personalizado que use Flash y necesites el puerto y la URL.
  
 
 Radio a través de MP3 Player 

 
 La forma más fácil de colocar una radio en tu página, MP3 Player es un reproductor que puedes configurar en varios aspectos, qué botones mostrar, qué colores, y qué funciones agregar. Los pasos para poner este reproductor en tu página son muy sencillos, 1º coloca el código que está más abajo ya sea en un Gadget HTML o en una entrada en modo HTML; para el Gadget la ruta sería: Diseño / Añadir un gadget / y seleccionas HTML-Javascript y 2º agrega la URL de la estación de Radio que quieras compartir, agregándole al final la extensión « /;stream.nsv » para que el código reconozca la URL como Stream; más adelante te muestro donde y cómo conseguir la URL de una Radio en la internet.
Código del Reproductor de la Radio


<object type="application/x-shockwave-flash" data="http://flash-mp3-player.net/medias/player_mp3_maxi.swf" width="200" height="20">     <param name="movie" value="http://flash-mp3-player.net/medias/player_mp3_maxi.swf" />
<param name="bgcolor" value="#000000" />
<param name="FlashVars" value="mp3=URL de tu estación de Radio/;stream.nsv&amp;showstop=1&amp;showvolume=1&amp;volumewidth=50&amp;volume=150&amp;bgcolor1=191787&amp;bgcolor2=000000" />
</object>
Si quieres que inicie automáticamente al ingresar a la página agrega: &amp;autoplay=1 después de &amp;volume=150
Si quieres cambiar el color de los botones agrega: &amp;buttoncolor=ff3805 después de los otros colores.
Si quieres cambiar el color de los botones que se muestra cuando se coloca el mouse sobre ellos, agrega: 
&amp;buttonovercolor=56ff3d después de los otros colores.
 "bgcolor" value="#000000" Define el color HTML del fondo del Reproductor (Esquinas más que todo).
&amp;volume=150 Define el nivel de volumen. Cero lo más bajo - 200 lo más alto.
 &amp;bgcolor1=191787 Define el color HTML desde la parte media del reproductor hacia arriba.
 &amp;bgcolor2=000000 Define el color HTML desde la parte media del reproductor hacia abajo.
 Si quieres puedes visitar su página principal MP3 Player y editar aún más el código del reproductor, te muestro a continuación una imagen para que te guíes más rápido.
              
  Radio a través de Dewplayer 

 Una muy buena opción, permite elegir si la radio inicia automáticamente o no al ingresar a la página, solo debes subir el archivo .swf de su reproductor a un servidor en la nube, te recomiendo hacerlo a través de DRIVE (Leer en el tema la parte del enlace público). Dropbox ya no permite crear enlaces públicos en las cuentas nuevas.
Los pasos son muy sencillos, 1º subes el archivo dewplayer-vol.swf a DRIVE para tener su URL o link pública, 2º coloca el código que está más abajo ya sea en un Gadget HTML o en una entrada en modo HTML; para el Gadget la ruta sería: Diseño / Añadir un gadget / y seleccionas HTML-Javascript y 3º agrega la URL de la estación de Radio que quieras compartir, agregándole al final la extensión « /;stream.nsv » para que el código reconozca la URL como Stream, y también coloca la url pública del archivo .swf.

Descargar Archivo dewplayer-vol.swf 
  
  
Código del Reproductor de la Radio

<object type="application/x-shockwave-flash" data="URL del archivo dewplayer-vol.swf" width="240" height="20" id="dewplayer-vol"> <param name="movie" value="URL del archivo dewplayer-vol.swf" />
<param name="flashvars" value="mp3=URL de tu estación de Radio/;stream.nsv" />
<param name="wmode" value="transparent" />
</object>
Si quieres que la Radio inicie automáticamente al ingresar a la página agrega lo siguiente al final del link/URL de la Radio « &amp;autostart=1 » si también quieres ajustar el volumen agrega lo siguiente « &amp;volume=50 » siendo 0 lo más bajo y 100 lo más alto.
 Un ejemplo del código con autostart y volume.
<object type="application/x-shockwave-flash" data="URL del archivo dewplayer-vol.swf" width="240" height="20" id="dewplayer-vol"> <param name="movie" value="URL del archivo dewplayer-vol.swf" />
<param name="flashvars" value="mp3=URL de tu estación de Radio/;stream.nsv&amp;autostart=1&amp;volume=50" />
<param name="wmode" value="transparent" />
</object>
Desde la página de Dewplayer también puedes descargar el archivo.swf, la diferencia es que en el zip que ellos tienen disponible para la descarga vienen muchos archivos y te podrías confundir, de todas maneras la puedes visitar y ver todo lo que ofrecen (página en inglés y francés). 
  Radio a través del reproductor de Microsoft 

 
 No publico un ejemplo ya que este reproductor inicia automáticamente aunque se coloque en su código que no lo haga, eso sí, su gran ventaja es que es muy fácil de usar. En pruebas que realicé (4-4-2012) en el único navegador que no se visualizó fue en Opera. Para usarlo solo debes colocar el siguiente código siguiendo los mismos pasos del reproductor anterior.
<embed pluginspage="http://www.microsoft.com/Windows/MediaPlayer/" showgotobar="false" transparentatstart="true" autostart="true" showstatusbar="true" src="URL de tu estación de Radio" type="application/x-mplayer2" height="45" width="250" bbclient="0" name="MC1"></embed>
Puedes modificar su ancho desde "width". 
  Radio a través de Cadenatop 

 
 Esta es una radio que ya viene lista, es decir, ya viene con cuatro opciones musicales para que los visitantes de tu página elijan la que quieran. Tiene en contra que inicia automáticamente, aunque en su página principal brindan un código para que no lo haga, en las pruebas que realicé (4-4-2012) ese código no funciona y la radio inicia de todas maneras.
Top Latino Radio: Lo más escuchado en el mundo latino, en español e inglés. 
Radio Reggae: Solo música reggae, en español y en inglés. 
Top Urbano: Música urbana, hip hop y reggaeton. 
Top-x: Música de los 90′s en inglés.
Para usar este reproductor solo debes colocar el siguiente código siguiendo los mismos pasos del primer reproductor.
<embed pluginspage="http://www.adobe.com/go/getflashplayer"src="http://cadenatop.com/cadenatop_mini.swf" width="200" height="228" wmode="transparent"type="application/x-shockwave-flash" allowscriptaccess="always"></embed>

Actualizar página automáticamente (sin botones)

Actualizar página automáticamente (sin botones)

25 de julio de 2009 70 comentarios ,
Si tienes un blog de noticias con muchos colaboradores seguro publicarás más de cinco post al día, por lo que actualizar la página principal del blog es básico para el lector.
Este script hace que la página se actualice automáticamente cada determinado tiempo, sin necesidad de presionar ningún botón de "Actualizar".

El script original hace que se recargue todo el blog, tanto la portada como las entradas individuales, yo le he hecho una modificación para que sólo se actualice la portada que es donde aparecen los post nuevos, de esta forma quién esté leyendo una entrada individual no verá interrumpida su lectura con la recarga de la página.

Sólo hay que pegar antes de </head> lo siguiente:
<b:if cond='data:blog.homepageUrl == data:blog.url'>
<script>setTimeout(&#39;document.location.reload()&#39;,60000); </script>
</b:if>

El script hará que cada minuto se recargue sola la página principal, para modificar el tiempo entre una actualización y la siguiente cambia lo que está en rojo. Ahí está en 60 segundos, si quisieras menos tiempo cambia el valor en milisegundos, por ejemplo 10 segundos sería 10000.

Si quieres que el script haga que se actualicen también las páginas individuales entonces el código que deberás pegar antes de </head> es el siguiente:
<script>setTimeout(&#39;document.location.reload()&#39;,60000); </script>

La modificación del tiempo de actualización es la misma.

Gadget para mostrar los últimos tweets de manera rotativa

Gadget para mostrar los últimos tweets de manera rotativa

Nuevo gadget Twitter
Bueno, lo prometido es deuda y aunque no siempre puedo cumplir mis promesas esta vez va a ser que sí. Aquí tenéis aquel gadget para mostrar tweets que publiqué en anteriores entradas en un par de versiones (1) (2) y que por el cambio de API de Twitter dejó de funcionar. 

Para que todo vuelva por sus fueros he echado mano de aquel código de Jason Mayes que vimos al principio de verano y que nos permitía leer el feed de Twitter y mostrarlo adaptado a nuestras necesidades, aunque para simplificar la instalación lo he alojado en Google Code y así sólo hay que hacer una llamada para que funcione.

Adicionalmente lo he combinado con el truquillo del slider jQuery más sencillo y entre una cosa y otra obtenemos un rotador de tweets que podemos personalizar tanto en contenido como en aspecto.



Y aquí lo tenemos con un primer estilo, el mismo que ya vimos y que muchos tenéis pero que no os funciona. Bueno, que no os funcionaba ;)


El código, en el caso de Blogger, hay que incluirlo dentro de un gadget tipo HTML/JavaScript y es el siguiente. Si ya tenéis jQuery en vuestra plantilla la primera línea la tenéis que suprimir:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" src="https://olobloggerblog.googlecode.com/files/Twitter-post-fetcher-7.js"></script>
<script type="text/javascript">
twitterFetcher.fetch('347086380704342017', 'rotatweet', 5, true, false, false);
$(document).ready(function() {
setInterval(function(){
$('#rotatweet ul li:first-child').fadeOut(0)
.next('li').fadeIn(1000)
.end().appendTo('#rotatweet ul');}, 4000);
});
</script>

<div id="rotatweet"></div>

<style>
#rotatweet {
position:relative;
width:335px;
height:94px;
margin:0 auto;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiuRJrlwbdV_j3yYJrYROgbLyai18nkfWyxn3LrZIbkCGaqVSIVNDS4Tcnsvg7mxNjJD3RsN2FVjvJoaJNF4GKDUDBQTrhQroYNw6Z5YMHNoXmORBiIauLUP56qdzDW-qH6DZS7R-GsF-M/s1600/twitter.png);
}
#rotatweet ul {
position:absolute;
top:12px;
left:90px;
width: 232px;
margin:0;
padding:0;
font-size: 12px;
}
#rotatweet ul li {
list-style: none;
margin: 0;
padding: 0; 
display: none;
}
</style>

¿Y qué tenemos que cambiar de ahí? Pues casi nada. Sólo la ID correspondiente a vuestro propio gadget de Twitter porque el que veis es el mío. Ahora si no se genera desde la página oficial, pues no funcionará nada. Es el número 347086380704342017 que veis en el código. 

La forma de obtenerlo está detallada en Mostrar tweets tras el fin de la API 1 de Twitter, en el apartado 2. Relacionar con el gadget oficial, pero básicamente se trata de acceder a la página de gadgets Twitter, crear uno que muestre el tipo de datos que deseamos (cronología, favoritos, etc.) y copiar la identificación que se le asigna.

Otra cosa que se puede cambiar es el número de tweets a mostrar. Es ese tercer parámetro de la función twitterFetcher.fecth, o lo que es lo mismo, ese número 5.

Por último, el intervalo de tiempo entre tweets es en el ejemplo el parámetro 4000 e indica la demora en milisegundos.


Y para conseguir otro estilo distinto pues sólo se trata de ajustar la parte CSS. Este sería otro ejemplo de aspecto utilizando otras reglas de estilo. En concreto las que vienen tras la demo.


#rotatweet {
max-width: 500px;
height: 72px;
margin:0 auto;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgSoFvsryQuyO9kdNMqt-ObzbcuYT0BtjMyZhNVFnv_pYSFYgJpSnDnnkXdLti-QGnMTx0MPHC3Ow8lE-bXnZtyMTX8EwSQYrLDrxj66XyClKWZlQZn9B6vfyWwecFATw0sKx3KwxyPJ1Q/s48/twitter-logo-180.png) no-repeat top left;
}
#rotatweet ul {
margin: 0;
padding: 8px 0 0 52px;
font-size: 12px;
-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box;
}
#rotatweet ul li {
list-style: none ;
margin: 0;
padding: 0;
display: none;
}

Nota: Para no tirar todos del mismo fichero y que un día se le inflen las narices a Google Code y nos deje tirados bloqueándolo, lo mejor sería que descargarais el fichero Twitter-post-fetcher-7.js, lo alojarais bajo vuestro propio control (en el mismo Google Code o Dropbox, por ejemplo) y que sustituyerais la dirección que puse por la vuestra.
¿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 puedesimprimir este artículo y por supuesto compartirlo en redes sociales si fue de tu agrado.

Slider con las entradas

Slider sencillo con entradas recientes

No hace mucho vimos como montar un slider muy simple para mostrar una serie de imágenes fijas (con o sin enlace) que iban pasando de manera secuencial. La cosa es que esto no cubre las necesidades de algunos que quieren que esas imágenes sean extraídas de las entradas del propio blog y que al mismo tiempo sirvan de enlace para acceder directamente a las mostradas. 

Eso es lo que se viene llamando slider de entradas recientes y precisamente lo que vamos a ver a continuación para tener una variante más completa de aquel visor de imágenes que vimos.

Evidentemente el código ya no será tan simple pero tampoco es que sea muy largo, así que en lugar de cargar un fichero externo, propongo que se meta en la plantilla y que luego ya carguemos el feed desde un gadget.

En esta página de pruebas podéis ver una demostración de cómo funciona con el código que veremos a continuación.

Demo slider entradas recientes



Lo primero de todo sería colocar antes del </head> de nuestra plantilla, lo mismo que la otra vez: la librería jQuery, los estilos de la caja que forma el slider (estos también se pueden poner en la parte CSS) y el código que generaba la animación.

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js' type='text/javascript'/>
<!-- SLIDER ENTRADAS RECIENTES -->
<!-- Estilo slider -->
<style type='text/css'>
#slider { 
  position: relative;
  overflow: hidden;
  width: 550px; 
  height: 200px; 
  border:4px solid #333;
  margin: 0 auto;
  padding: 0;
}
#slider > div {
  position:absolute;
  top:0;
  left:0;
  width: 550px;
}
#slider img {
  width:100%;
  min-height:200px;
  margin:0;
  padding:0; 
  border:0;
}
#slider p {
  position: absolute;
  top: 160px;
  left: 0;
  display: block;
  overflow:hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  width: 400px;
  height: 22px;
  margin:0;
  padding:0 5px;
  color: #eee;
  background: #990000;
  font-size: 16px;
  line-height:22px;
  text-align:center;
}
</style>
<!-- Slider -->
<script type='text/javascript'>
//<![CDATA[
  $(function(){
    $('#slider div:gt(0)').hide();
    setInterval(function(){
      $('#slider div:first-child').fadeOut(2000)
      .next('div').fadeIn(2000)
      .end().appendTo('#slider');},5000);}
  );
//]]></script>

Como decía, esto es exactamente lo mismo que vimos en Posiblemente el slider jquery más sencillo y la diferencia radica sólo en cómo vamos a construir la lista de imágenes/enlaces. En aquel la hacíamos manualmente y ya habíamos terminado, pero en esta ocasión crearemos una función que leerá un feed y de ahí extraerá título, URL e imagen de los últimos posts, creando automáticamente esa lista.

En esa parte de arriba, lo único que habría que tener en cuenta es no duplicar la carga de jQuery que es lo que hace la primera línea. Si ya lo tenemos en nuestro plantilla esa línea hay que omitirla.

Y esta es la función que recopila los datos y crea la lista. Hay que ponerla a continuación de lo anterior:

<!-- Obtener elementos entradas recientes-->
<script type='text/javascript'>
//<![CDATA[
var numposts_gal = 6;
var salida_gal = '';
function galeriaposts(json) {
  var numPosts = json.feed.openSearch$totalResults.$t;
  var indexPosts = new Array();
  for (var i = 0; i < numPosts; ++i) {indexPosts[i] = i;}
  if (numposts_gal > numPosts) {numposts_gal = numPosts;}
  for (i = 0; i < numposts_gal; ++i) {
    var entrada = json.feed.entry[indexPosts[i]];
    var titulo = entrada.title.$t;
    for (var k = 0; k < entrada.link.length; k++) {
      if ( entrada.link[k].rel == 'alternate') {enlace = entrada.link[k].href;break;}
    }
    if ("content" in entrada) {var contenido = entrada.content.$t;}
    x = contenido;
    a = x.indexOf("<img");
    b = x.indexOf("src=\"", a);
    c = x.indexOf("\"", b + 5);
    d = x.substr(b + 5, c - b - 5);
    if ((a != -1) && (b != -1) && (c != -1) && (d != "")) {var imagen = d;}
    else {var imagen = 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgjZqyufYShPjwcefeFgbngzQBzpXTygqkY9-Bjo-GPPiEGQg8Ajchavi0Pjkvfzw8RlwnKu13iC3u6kqToeNjcgIdGK9fqXiEznbO2pD4qp0pDnIR8jbilD_GTa1Ink6409gNKmd1C4Ac/s0/sin-imagen.png';}
    salida_gal += '<div><a href="' + enlace + '"><img src="' + imagen + '" /></a>';
    salida_gal += '<p>' + titulo + '</p></div>';
  }
  document.getElementById('slider').innerHTML = salida_gal;
}
//]]>
</script>

Y ahora viene el último paso que es situar en el lugar dónde queremos que salga el slider, una caja vacía con la id #slider y la llamada a la función que generará la lista de imágenes/título/enlace. 

Tal cual viene se puede incluir en un gadget tipo HTML/JavaScript para ponerlo bajo la cabecera o encima del cuerpo de las entradas.

<!-- SLIDER HOME RECIENTES -->
<div id='slider'></div>
<script style='text/javascript'>
  var numposts_gal = 6; // Número de entradas a mostrar
</script>
<script src='http://www.oloblogger.com/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=galeriaposts&amp;max-results=10'></script>

En ese trozo es dónde personalizaremos el número de entradas a mostrar y el feed desde dónde queremos cargar las imágenes. En este mismo orden son las dos cosas marcadas en verde. Se puede poner cualquier dirección de feed y no sólo el propio.

Si por casualidad alguien quiere ver más de 10 entradas, el valor tras max-results deberá ser aumentado.