quinta-feira, 25 de novembro de 2010
Como colocar botões de Feed RSS nas categorias
Ter um botão visível de Feed RSS em seu blog, é essencial para permitir que seus leitores acompanhem as novidades automaticamente. Assinando o feed, o leitor recebe o conteúdo atualizado em tempo real, sem ter que necessariamente ir até a página para ver se o blog foi atualizado.
Porém, um detalhe importante que muitos blogueiros esquecem, é de ter um botão de feed para cada categoria (marcador) do blog. Isso atrai mais a atenção dos visitantes, pois eles não precisarão assinar o feed completo, se não quiserem. Eles poderão escolher sobre qual categoria do blog eles vão querer receber o conteúdo atualizado do feed automaticamente.
Para ter uma melhor idéia do que estamos falando, observe a imagem abaixo:

Seu painel de categorias ficará deste modo, com um pequeno botão para assinar o feed ao lado de cada marcador.
Como Fazer Isso
1. Em seu blog, vá em Design > Editar HTML. Primeiramente, faça um backup de seu template clicando em Baixar modelo completo.

2. Marque a opção "Expandir modelos de widgets". Pressione as teclas Ctrl + F e procure pela seguinte linha abaixo:
<b:loop values='data:labels' var='label'> <li>
3. Abaixo de <li> insira o código a seguir:
<a expr:href='data:blog.homepageUrl + "feeds/posts/default/-/" + data:label.name'><img alt='Subscribe' src='http://www.feedburner.com/fb/images/pub/feed-icon16x16.png' style='vertical-align:middle;border:0'/></a>
See the Pen ixDKJ by Seu Tutorial (@marcelost) on CodePen
Ficará assim:
<b:loop values='data:labels' var='label'>
<li>
<a expr:href='data:blog.homepageUrl + "feeds/posts/default/-/" + data:label.name'><img alt='Subscribe' src='http://www.feedburner.com/fb/images/pub/feed-icon16x16.png' style='vertical-align:middle;border:0'/></a>
<b:if cond='data:blog.url == data:label.url'>
<span expr:dir='data:blog.languageDirection'><data:label.name/></span>
<b:else/>
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
</b:if>
<b:if cond='data:showFreqNumbers'>
<span dir='ltr'>(<data:label.count/>)</span>
</b:if>
</li>
</b:loop>
Com este código, o botão de feed ficará ao lado esquerdo das categorias.

Botão ao Lado Direito
Mas se você prefere que os botões fiquem ao lado direito das categorias, faça o seguinte.
insira o código da linha 12 abaixo como mostrado no campo:
<b:loop values='data:labels' var='label'>
<li>
<b:if cond='data:blog.url == data:label.url'>
<span expr:dir='data:blog.languageDirection'><data:label.name/></span>
<b:else/>
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
</b:if>
<b:if cond='data:showFreqNumbers'>
<span dir='ltr'>(<data:label.count/>)</span>
</b:if>
<a expr:href='data:blog.homepageUrl + "feeds/posts/default/-/" + data:label.name'><img alt='Subscribe' src='http://www.feedburner.com/fb/images/pub/feed-icon16x16.png' style='vertical-align:middle;border:0'/></a>
</li>
</b:loop>
See the Pen eiucD by Seu Tutorial (@marcelost) on CodePen
Os botões ficarão ao lado direito das categorias.


Artigo escrito por Marcelo
Sou formado em Sistemas de Informação pela UFMG e pós-graduado em Segurança da Informação. Trabalho com TI há mais de 5 anos e sou professor particular de inglês. Nas horas bem vagas costumo arranhar uma guitarra e sou fã do bom e eterno rock'n'roll.
Receba as atualizações automaticamente
Muito bem explicado, não acerta quem não quiser.
ResponderExcluirAbraços forte
Olá Principe Encantado,
ResponderExcluirSeja bem-vindo ao blog!
Muito obrigado pelo seu comentário!
Ótima tarde e um grande abraço amigo.
achei muito interessante a idéia, principalmente para blogueiros que escrevem sobre uma grande variedade de assuntos, assim cada pessoa poderá acompanhar somente aquilo que gostar.
ResponderExcluirOlá fabiano,
ResponderExcluirExatamente como você disse.
Deste jeito, facilita o acompanhamento de categorias específicas pelo leitor. Geralmente tem aquele leitor que gosta mais de uma categoria do que da outra, assim ele confere só aquilo que gosta.
Um grande abraço e obrigado pelo comentário!
Muito bem explicado, simples, coloquei no meu sem problema nenhum e achei muito prático, valeu pela dica!
ResponderExcluir