Adicionar thumbnail do post (sem javascript)

Maior parte das soluções que você vai encontrar para colocar uma thumbnail nos posts do Blogger vão utilizar um script (em javascript) para criar um resumo do texto e colocar um link de leia mais automaticamente em todo post. Embora isso seja útil, não era exatamente o que eu queria fazer, então tive que achar outros meios de colocar a thumbnail no post, pois prefiro fazer o corte do post manualmente ao invés de deixar automático.

A única maneira que consegui de fazer isso é através do seguinte código:

<b:if cond='data:view.isMultipleItems'>
<span class='posts-thumb'><a expr:href='data:post.link ? data:post.link : data:post.url'><img expr:src='resizeImage(data:post.thumbnailUrl, 1080)'/></a></span>
</b:if>

Esse código pode ser colocado onde você quiser, desde que esteja após esse código:

<b:includable id='post' var='post'>
  <div class='post hentry uncustomized-post-template' itemprop='blogPost' itemscope='itemscope' itemtype='http://schema.org/BlogPosting'>
    <b:if cond='data:post.firstImageUrl'>
      <meta expr:content='data:post.firstImageUrl' itemprop='image_url'/>
    </b:if>
    <meta expr:content='data:blog.blogId' itemprop='blogId'/>
    <meta expr:content='data:post.id' itemprop='postId'/>

Você pode colocar ele antes do título de post e da data, por exemplo, ou depois, antes do corpo do post. A escolha é sua. Não esqueça de visualizar antes de salvar para ter certeza que não prejudicou nada no seu design!

Nenhum comentário

Postar um comentário