Demos Entre Letras

<script type="text/javascript">
function LoadTheArchive(TotalFeed)
{
    var PostTitles = new Array();
    var PostURLs = new Array();
    var PostYears = new Array();
    var PostMonths = new Array();
    var PostDays = new Array();
    if("entry" in TotalFeed.feed)
    {
 var PostEntries=TotalFeed.feed.entry.length;
 for(var PostNum=0; PostNum<PostEntries ; PostNum++)
 {
     var ThisPost = TotalFeed.feed.entry[PostNum];
     PostTitles.push(ThisPost.title.$t);
     PostYears.push(ThisPost.published.$t.substring(0,4));
     PostMonths.push(ThisPost.published.$t.substring(5,7));
     PostDays.push(ThisPost.published.$t.substring(8,10));
     var ThisPostURL;
     for(var LinkNum=0; LinkNum < ThisPost.link.length; LinkNum++)
     {
  if(ThisPost.link[LinkNum].rel == "alternate")
  {
      ThisPostURL = ThisPost.link[LinkNum].href;
      break
  }
     }
     PostURLs.push(ThisPostURL);
 }
    }
    DisplaytheTOC(PostTitles,PostURLs,PostYears,PostMonths,PostDays);
}
function DisplaytheTOC(PostTitles,PostURLs,PostYears,PostMonths,PostDays)
{
    var MonthNames=["Enero de","Febrero de","Marzo de","Abril de","Mayo de","Junio de","Julio de","Agosto de","Septiembre de","Octubre de","Noviembre de","Diciembre de"];
    var NumberOfEntries=PostTitles.length;
    var currentMonth = "";
    var currentYear = "";
    for(var EntryNum = 0; EntryNum < NumberOfEntries; EntryNum++)
    {
 NameOfMonth = MonthNames[parseInt(PostMonths[EntryNum],10)-1]
 if (currentMonth != NameOfMonth || currentYear != PostYears[EntryNum]) {
  currentMonth = NameOfMonth;
  currentYear = PostYears[EntryNum];
  document.write("<div class='dateStyle'>" + currentMonth+" "+currentYear+" </div>");
 }
  document.write('<a href ="'+PostURLs[EntryNum]+'"><span class=dayStyle>'+parseInt(PostDays[EntryNum],10)+":&nbsp;&nbsp;</span><span class='entryStyle'> "+PostTitles[EntryNum]+"</span></a><br/>");
    }
}
</script>
<script src="http://entrelettras.blogspot.com/feeds/posts/default?max-results=500&amp;alt=json-in-script&amp;callback=LoadTheArchive" />
</script>
<!--CUSTOMIZATION-->
<style type="text/css">
.dateStyle {
     margin-top: 20px;
     color: #000; /* color de los meses*/
     font: normal 15px futura book; /*tipografía y tamaño de fuente de los meses*/
     text-transform: uppercase; /*indica que el texto está la letra en mayúscula*/
     letter-spacing: 2px; /*espacio entre caracteres*/
     text-align: center;
     padding: 15px;
     background: #FCFAFA;
     border-top: 7px solid white;
}
.dayStyle {
     display: inline-block;
     padding-left: 20px;
     color: #000; /*color del texto*/
     font: normal 14px futura book; /*tipografía y tamaño de fuente de los números (días)*/
     letter-spacing: 2px; /*espacio entre caracteres*/
     color: #9f8484;
}
.entryStyle {
     text-transform: uppercase; /*indica que el texto está con sólo la primera letra en mayúscula*/
     font-size: 90%;
}
</style>