Tabela com todas as postagens do seu blog que se expande (BLOG TOC)

Encontrei uma dica bem legal para colocar uma tabela expandivel com todas as postagens do blog.




Para coloca-la em seu blog é fácil, só um pouco trabalhoso, mas então vamos lá...
Veja o exemplo clicando AQUI. Note que fiz um blog a parte só com a tabela, mas você poderá incorporar esta tabela em seu próprio blog.

Não se esqueça de antes de começar salvar uma cópia de seu template, caso não dê certo, é só reinstalá-lo.

Vá até o HTML de seu blog e clique em "Expandir Modelos de widget"


Agora procure pelo trecho:

<b:section class='main' id='main' showaddelement='no'>

E substitua pelo código abaixo salvando depois.

<b:section class='main' id='main' maxwidgets='2' showaddelement='yes'>

Agora procure pelo código:

]]></b:skin>

E cole o código abaixo acima dele.

<style type="text/css">
#toc {
border: 0px solid #000000;
background: #ffffff;
padding: 5px;
width:500px;
margin-top:10px;
}
.toc-header-col1, .toc-header-col2, .toc-header-col3 {
background: #cccccc;
color: #000000;
padding-left: 5px;
width:250px;
}
.toc-header-col2 {
width:75px;
}
.toc-header-col3 {
width:125px;
}
.toc-header-col1 a:link, .toc-header-col1 a:visited, .toc-header-col2 a:link, .toc-header-col2 a:visited, .toc-header-col3 a:link, .toc-header-col3 a:visited {
font-size:80%;
text-decoration:none;
}
.toc-header-col1 a:hover, .toc-header-col2 a:hover, .toc-header-col3 a:hover {
font-size:80%;
text-decoration:underline;
}
.toc-entry-col1, .toc-entry-col2, .toc-entry-col3 {
padding-left: 5px;
font-size:100%;
}
</style>

Vá até "Elementos de página". Note que agora há a opção de colocar Gadgets acima das postagens do blog. Clique então e adicione um HTML/Javascript e cole o próximo código dentro dele. Salve !

<div id="toc"> </div>

Agora, dentro de outro HTML/Javascript, cole o código abaixo.
*Não se esqueça de colocar o nome de seu blog no local em vermelho.

<div id="toclink"><a href="javascript:showToc();">Conteudo do Blog</a></div>

<script style="text/javascript" src="http://templateseacessorios5.googlepages.com/tocdoblogparaleitores.JS">

</script>

<script src="http://NOMEDOSEUBLOG.blogspot.com/feeds/posts/default?alt=json-in-script&max-results=999&callback=loadtoc"></script>

Créditos: Linkduzão