20 de fev de 2012

Resumir postagens no blogger automaticamente

Esse recurso é muito utilizado por vários sites/blogs, pois ao exibir posts resumidos, muito além de um resultado estético bonito, há muito mais vantagens.

O recurso diminui o tempo de abertura da página principal, inclusive facilitando a leitura pelos motores de busca, oferece uma espécie de lista ao leitor que poderá se interessar por mais de um artigo e permanecer mais tempo em sua página.

Esta é uma opção bem simples e que está disponível para o Blogger, caso você utilize o Wordpress sugiro que leia esse artigo.

O script desenvolvido por Vietwebguide, resume as postagens sempre com o mesmo número de caracteres e exibe uma miniatura da imagem (tipo thumbnails) que estiver no post. Depois de instalado o script, você só precisa continuar postando normalmente. Os posts anteriores também serão automaticamente ajustados.
Como inserir o <script>
1. Acesse o Painel do Blog > Modelo (Design, pra quem usa a interface antiga do blogger) > Editar HTML;
ATENÇÃO: Faça o backup do seu modelo atual, para o caso de ter algum problema.

2. Feito os procedimento anteriores, dentro do HTML procure pelo trecho (Ctrl+F) </head> e cole o código (script) logo abaixo dele.
<script type='text/javascript'>
summary_noimg = 330;
summary_img = 300;
img_thumb_height = 125;
img_thumb_width = 125;
</script>
<script src='http://vietwebguide2.googlepages.com/summary-post-v20-test.js' type='text/javascript'/>

3. Salve. Depois clique na caixa "Expandir modelos de widgets" e procure pelo trecho:
<data:post.body/>

4. Substitua o código acima por esse:
<p><b:if cond='data:blog.pageType != "item"'>
<div expr:id='"summary" + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb ("summary<data:post.id/>");</script>
<span class='rmlink' style='float:right'><a expr:href='data:post.url'> + Leia mais...</a>
</span></b:if>
<b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if></p>

5. Visualize, se estiver tudo bem, salve!
Configurando o <script> (opcional)
summary_noimg - Número de caracteres caso não haja imagens;
summary_img - Número de caracteres a mostrar no caso de post com imagens;
img_thumb_height - Altura da imagem (thumbnail);
img_thumb_width - Largura da imagem (thumbnail);

Os valores utilizados parecem apropriados para template com 480px de largura do main-wrapper (coluna dos posts), e a maioria dos thumbnails são de 125×125 píxels.
Você pode alterar a seu critério.

Até a próxima!

a Comentários