Lápiz y café

Vamos a implementar un widgets simple solo de imágenes de las últimas publicaciones con un efecto hover de bordes redondeados, la función es bastante simple, usando un script de JSON que leerá los feeds de nuestro sitio y hará el resumen del mismo, lo que haremos es modificar un poco los estilos para hacer una pequeña galería de solo la imágenes sin resumen de texto, para eso vamos a hacer los siguiente:

Vamos a diseño y agregamos un JavaScript HTML y pegamos el siguiente código:
<style>
#bp_recent {
width:300px;
padding: 5px;
color: #999;
font-size: 14px;
text-align:justify;
}
#bp_recent img {
width: 70px;
height: auto;
border: 3px solid #5b6569;
border-bottom-left-radius: 20px;
border-top-right-radius: 20px;
opacity: 1.0;
-webkit-box-shadow: 0px 0px 9px -1px rgba(3,142,222,1);
-moz-box-shadow: 0px 0px 9px -1px rgba(3,142,222,1);
box-shadow: 0px 0px 9px -1px rgba(3,142,222,1);
-moz-transition: all 2s;
-webkit-transition: all 2s;
-o-transition: all 2s;
}
#bp_recent img:hover{
opacity: 0.5;
border-bottom-left-radius: 3px;
border-top-right-radius: 3px;
-moz-transition: all 2s;
-webkit-transition: all 2s;
-o-transition: all 2s
}
#bp_recent a{
color: #fff;
font-size: 15px;
text-transformation: uppercase;
margin-bottom: 5px!important;
}
#bp_recent a:hover {
text-decoration: underline;
}
</style> <div id='bp_recent'></div>
<script type="text/javascript" src="https://sites.google.com/site/escribiendotrazos/JsEntradasEscribiendoT.txt"></script>
<script style='text/javascript'>
var numberOfPosts = 9;
var showPostDate = false;
var showSummary = false;
var summaryLength = 0;
var titleLength = 0;
var showCommentCount = false;
var showThumbs = true;
var showNoImage = true;
var imgDim = 55;
var imgFloat = 'left';
var myMargin = 5;
var mediaThumbsOnly = true;
var showReadMore = false;
var readMore = 'Leer más';
</script>
<script src=' http://lapizycafe.blogspot.com/feeds/posts/summary?max-results=10&orderby=published&alt=json-in-script&callback=bprecentpostswiththumbnails'></script>

Modificaciones: reemplazar el nombre por el de su sitio, el numero 9 marcado en rojo es la cantidad de imágenes de post, todos los estilos se pueden modificar, el resultado sería algo como esto.

Gadget de entradas recientes simple para blogger usando JSON, la función es sencilla lo que hace el Script es leer los últimos artículos del sitio haciendo este pequeño resumen, para implementarlo lo que hay que hacer es ir a diseño agregar un JavaScript HTML y pegar todo este código:

<div id="recientes">
<script src="https://sites.google.com/site/escribiendotrazos/JSescribiendoT.txt">
</script>
<script>
var numposts = 5;var showpostdate = false;var showpostsummary = true;var numchars = 100;var standardstyling = true;
</script>
<script src="http://lapizycafe.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentposts">
</script>
</div>
<style type="text/css">
#recientes a {
color: #3c9df5;
font-size: 15px;
font-family: "Josefin Sans",sans-serif;
}
#recientes {
color: #777;
font-size: 11px;
padding: 5px;
border: 2px solid #47657f;
border-radius: 5px;
background: #293036;
background-image: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiw2CU92QndK3VFpzu-n_t0SjRlFusrfQJ6Pd5SVG49d4UNy2TQbnfQ-usUDSALBenMY2RFkqwsW30oBA741FG0gK2z6HU1lKHoFux1McaHqA0cjyhL1FEnQKKtOuVo0hPk5swPyt6hjy0X/s1600/fonox.jpg");
}
</style>

Hay que tener en cuenta el nombre de su sitio, sustituir lo resaltado y agregar su nombre todos los estilos se puede modificar al gusto, el resultado sería algo como esto:

Widgets de imágenes de últimas entradas con efecto

Gadget de entradas recientes simple