Hack para Posts Resumidos

Como vocês já devem ter percebido, instalei no Dicas Blogger o famoso e tão desejado hack para exibir os posts resumidos na página inicial. À princípio eu não gostava de chegar em um blog e não poder ler, imediatamente, o artigo completo. Entretanto, com o tempo, os meus próprios artigos ficaram extensos e isto fazia com que a página inicial aparecesse muito longa, o que me inibia a criar tutoriais mais detalhados.

Vou ensiná-los como colocar este hack em seus blogs, mas os créditos são inteiramente do Compulsivo e da Amanda, do BloggerBuster.

Hack “Continue lendo”

Entre no html do seu blog, mas lembre-se de fazer antes um backup do template.

Marque a caixa expandir modelos de widgets, localize (Ctrl + F) a tag </head> e cole, antes dela, o seguinte código:

<script language='javascript' src='http://halotemplates.s3.amazonaws.com/jquery-truncator/jquery-1.2.3.pack.js' type='text/javascript'/>
<script language='javascript' src='http://halotemplates.s3.amazonaws.com/jquery-truncator/jquery.extractor.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function() {
$('.excerpt').expander({
slicePoint: 280, // default is 100
expandEffect: 'fadeIn',
expandText: '[...]', // default is 'read more...'
userCollapseText: '[^]' // default is '[collapse expanded text]'
});
});
</script>

O destaque representa a quantidade de caracteres html que será exibida na página inicial.

Procure agora por este código:

<div class='post-body entry-content'>
<data:post.body/>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>

Substitua tudo por:

<b:if cond='data:blog.pageType != "item"'>
<div class='excerpt post-body entry-content'>
<data:post.body/>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
<p><a expr:href='data:post.url'>Continue lendo...</a></p>
<b:else/>
<div class='post-body entry-content'>
<data:post.body/>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
</b:if>

E está pronto!