Como criar posts expansíveis no Blogger sem javascript

Aprenda como criar posts que apresentam um resumo do post na página principal do blog e mostram o conteúdo completo em uma página separada c...

Aprenda como criar posts que apresentam um resumo do post na página principal do blog e mostram o conteúdo completo em uma página separada clicando em um link tipo: "Leia mais...". Dica para o Blogger. Primeiramente é necessário fazer backup de seu template pois vão ser necessárias pequenas alterações e se algo der errado você terá como recuperar o estado original do seu blog.

Vá em Layout >> Clique em Editar HTML e depois em Baixar Modelo Completo para salvar o seu template.

Agora que a brincadeira começa:

Ainda em Editar HTML marque a opção Expandir modelos de widgets e espere até seu template ser totalmente expandido. Depois procure esta linha de código:

<div class="'post-body'">

E logo em seguida coloque (cole) as seguinte linhas de código.

<!-- Inicio do Codigo -->
<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style>
<!-- Fim do Codigo -->

em seguida busque essa linha de código, deve estar logo em seguida ao código que você postou no passo anterior:

<p><data:post.body/></p>

E coloque mais estas linha imediatamente após:

<!-- Inicio do Codigo -->
<a expr:href='data:post.url'>Clique para ler mais...</a>
</b:if>
<!-- Fim do Codigo -->

No final, esse trecho de código deve estar parecido com isto:

<div class='post-body'>
<!-- Inicio do Codigo -->
<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style>
<!-- Fim do Codigo -->
<p><data:post.body/></p>
<!-- Inicio do Codigo -->
<a expr:href='data:post.url'>Clique para ler mais...</a>
</b:if>
<!-- Fim do Codigo -->
<div style='clear: both;'/> <!-- clear for photos floats --></div>

Sendo que a parte em preto é o que já deveria estar no template e em verde são as linhas de código inseridas.

O que você deverá fazer quando editar seu post:

Você deverá colocar o resumo (que aparecerá na página principal do blog. O resto do post deverá ficar entre as tags:
<span class="fullpost">
e
</span>

Assim seu post terá a seguinte estrutura:

Digite seu resumo aqui.
<span class="fullpost">
Digite o resto do post aqui.
</span>

Qualquer dúvida basta comentar.

Traduzido de Blogger Tips and Tricks.