Colocar ícone RSS Feed nos Marcadores

14 setembro, 2009

Logo após o Blogger liberar "Marcadores em forma de nuvem", não vejo mais utilidade para usar a anterior forma de uma coluna vertical na sidebar ocupando um bom espaço na página. Como estou fazendo umas alterações aqui no blog, e vou retirar esta coluna de marcadores, resolvi fazer esta postagem explicando como fiz para colocar um ícone Rss Feed em cada um marcador, permitindo aos seus leitores se inscrever especificamente em um marcador apenas.

Encontrei este tutorial navegando pela Net, e, até agora, não me lembro aonde foi para dar o devido crédito. Mesmo assim, taí para você experimentar se quiser. Acredito que só servirá para quem essa função no seu blog.

É só fazer com atenção e calma, seguindo as instruções abaixo:

1 - Em "Editar HTML" salve uma cópia de segurança do seu template clicando em "Baixar Modelo Completo".

2 - Depois, vá em Personalizar > Layout > Editar HTML > Expandir Widgets.

3 - Localize por esses códigos abaixo:

<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>
<span dir='ltr'/>
</li>
</b:loop>
4 - Agora, preste bastante atenção e adicione a parte em vermelho como está nos exemplos abaixo.

*Para colocar o ícone antes
<b:loop values='data:labels' var='label'>
<li>

<a expr:href='data:blog.homepageUrl + &quot;feeds/posts/default/-/&quot; + data:label.name'><img alt='Subscribe' src=' URL da sua imagem hospedada ' 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>
<span dir='ltr'/>
</li>
</b:loop>



*Para colocar o ícone depois
<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>
<span dir='ltr'/>

<a expr:href='data:blog.homepageUrl + &quot;feeds/posts/default/-/&quot; + data:label.name'><img alt='Subscribe' src=' URL da sua imagem hospedada ' style='vertical-align:middle;border:0'/></a>

</li>
</b:loop>


5 - Na parte em azul, colocar o link da sua imagem hospedada. Se ainda não souber hospedar imagens... veja aqui ou aqui, como se faz.

6 - Clique em Visualizar, para ver se está funcionando corretamente. Se estiver tudo OK, clique em Salvar Modelo.

Para pesquisar ícones RSS, clique nos links aí abaixo. Bom usar imagens de 16x16 ou 18x18 pxs.

feedicons - deviantartrssicon - deviantartrssicons


Carregando imagem
Clique em qualquer lugar para cancelar
Imagem indisponível




blog comments powered by Disqus
 
Tema para Blogger por :: BloggerSPhera :: Imagens, conteúdo, calibragens, etc... Por :: Burity ::