Tutoriais Blogger Vanessa S.
Marcadores com Nuvem de Tags em Flash
Os marcadores no blog facilitam a vida dos visitantes, em encontrar os conteúdos de seus artigos, de acordo com o tema.
Como vocês já devem ter percebido, o proprio blogger implantou a opção de Marcadores em formato de nuvem de tags, dando um visual bem diferente.
O mais legal neste recurso é o fato de podermos selecionar quais os marcadores deverão ser exibidos e também poder retirar a numeração, o que antes era necessário ser feito manualmente
Mesmo com todas essas novidades, ainda é possivel personalizar os marcadores de várias formas, e uma delas é transformar seus marcadores em Nuvens de tags em flash, onde as listas se movimentam e flutuam quando passa o mouse em cima.
Se você quiser implementar seus Marcadores em forma de Nuvem de Tags em Flash em seu blog, veja como a seguir.
Antes de mais nada, é sempre bom fazer um backup do seu Template para evitar transtornos, se algo sair errado.
Entre na aba “design” >> “editar HTML” e NÃO clique em “Expandir modelos de widgets”, e em seguida procure pela linha abaixo:
<b:section class='sidebar' id='sidebar' preferred='yes'>
E cole o seguinte código ABAIXO dela:
<b:widget id='Label99' locked='false' title='Labels' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<object type="application/x-shockwave-flash" data="http://sites.google.com/site/bloggerustemplatus/code/tagcloud.swf" width="250" height="200" allowscriptaccess="always" >
<param name="movie" value="http://sites.google.com/site/bloggerustemplatus/code/tagcloud.swf" />
<param name="bgcolor" value="#000000" />
<param name="flashvars" value="tcolor=0xffffff&mode=tags&distr=true&tspeed=100&tagcloud=<tags>
<b:loop values='data:labels' var='label'>
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url' style='14'><data:label.name/></a>
</b:loop>
</tags>" />
<p>Blogumulus by <a href='http://www.roytanck.com/'>Roy Tanck</a> and <a href='http://www.bloggerbuster.com'>Amanda Fazani</a></p>
</object>
</div>
<b:include name='quickedit'/>
</b:includable>
</b:widget>
Visualize, e se estiver tudo ok, salve!
Se por acaso o código postado acima não funcionar, tente usar este outro código alternativo abaixo:
<b:widget id='Label99' locked='false' title='Labels' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<script src='http://sites.google.com/site/bloggerustemplatus/code/swfobject.js' type='text/javascript'/>
<div id='flashcontent'>Blogumulus by <a href='http://www.roytanck.com/'>Roy Tanck</a> and <a href='http://www.bloggerbuster.com'>Amanda Fazani</a></div>
<script type='text/javascript'>
var so = new SWFObject("http://sites.google.com/site/bloggerustemplatus/code/tagcloud.swf", "tagcloud", "240", "300", "7", "#000000");
// uncomment next line to enable transparency
//so.addParam("wmode", "transparent");
so.addVariable("tcolor", "0xffffff");
so.addVariable("mode", "tags");
so.addVariable("distr", "true");
so.addVariable("tspeed", "100");
so.addVariable("tagcloud", "<tags><b:loop values='data:labels' var='label'><a expr:href='data:label.url' style='14'><data:label.name/></a></b:loop></tags>");
so.addParam("allowScriptAccess", "always");
so.write("flashcontent");
</script>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>
Depois de instalado e salvo, você pode movê-lo posicionando-o onde preferir, é só mudar o gadget de marcadores de lugar, arrastando-o para onde desejar e para isso basta fazê-lo atráves do “Elementos de página”.
Vejamos agora os elementos que você pode modificar, configurando de acordo com as cores do seu template:
width = “250” height = “200” -> se refere a largura e altura da widget.Você deve alterar a “width” para o mesmo tamanho da sua sidebar.
bgcolor” value=”#000000″ -> se refere a cor do plano de fundo da widget (que neste exemplo está na cor preta)
tcolor=0xffffff -> se refere a cor do texto (no exemplo está definido como branco, se quiser alterar, basta incluir o código hexadecimal referente a cor que você deseja, logo após o “x”
style=’14’ -> se refere ao tamanho do texto (tags)
Se quiser visualizar o código em uso confira aqui, na sidebar, em “marcadores em flash”.
Dicas
Dica 1: marcadores que contem palavras acentuadas, o código não reconhece, não sei o porque.Então uma solução seria renomear as tags retirando os acentos das palavras.
Dica 2: Percebi que nas categorias de marcadores que possuem poucas postagens, quando se clica neste marcador, não aparece postagem alguma.
Por exemplo: se você possui um marcador onde só há 1 post refente a este marcador, ao clicar na tag deste marcador,a sua postagem não irá aparecer. Então uma solução seria incluir mais postagens referentes a este marcador.
Aquele código, sabe
O que você disse pra procurar ><
eu sou a única pessoa NO MUNDO INTEIRO que não tem no HTML do blog
Entra no teu blog em ira ver o nome dele e uns numeros copia e cola onde precisa.
Clau nenhum dos codigos funcionou !
Poxa, que legal!
Ótimo tutorial,muito obrigada!
Abraços!
Muito bom post
Vlw Clau
o nosso fica tudo preto…
nao aparecem os marcadores no meu! só os creditos pra amanda!
Ow eu estava a procura disso , muito bom , vlw.
oi gatinha!
tentei a orientação d um outro site a tarde inteira a nuvem, e não consegui até q cheguei no seu e deu certo com o segundo código,
obrigada!
detesto desistir então posso levar um tempão mas chego lá!
bj e + sucesso no seu blog!
msd
Se tem possibilidade, eu desconheço.
Home
Lamento,mas não tenho como ajudar.
ola o meu não tem essa parte
A minha plataforma de template é feita através do Artister e este código não funciona nele! tem como ter a possibilidade de ter outro código que funcione nesse tipo de template? Beijos.
A hospedagem do arquivo swf caiu. Só deu certo no meu blogue depois de muita luta para encontrar o arquivo e hospedá-lo em outra sítio. Se servir, é só trocar todos os links http://halotemplates.s3.amazonaws.com/wp-cumulus-example/tagcloud.swf pelo seguinte endereço: http://www.fileden.com/files/2010/5/12/2857215/tagcloud.swf
@Claudio Sanches:
Me parece que o código está com algum problema de hospedagem. O jeito é tentar entrar em contato com os desenvolvedores, ou aguardar para ver se o problema será solucionado.
ele parou de funcionar, sabe como arrumar?
Clau, é a primeira vez que vejo esse código como algo simples e não como um bicho de sete cabeças! rsrsrs
Faz tempo que quero colocar esse efeito, mas todas as vezes só encontro uma linguagem ou explicação tão difíceis que acabo desistindo, acredita?
Já falei que vc é 10? rsrsrsrs
Te adoro!
Valeu pela ajuda de sempre!
Bjuuuu
dani
Ashimi:
Fico feliz em estar ajudando…obrigada pelo comentário e volte sempre que quiser!
Nossa muito Legal esse Ja estou usando ele no mew Blog Obrigado! Seu Blog Me ajudo Muito e esta ajudando Parabens !!!
Acrescentei ao post um código alternativo, caso o 1º não funcione, basta tentar usar o 2º.
Acabei de testar os 2 num blog de testes e deu certo!
Jack:
Eu esqueci de citar no post que se os marcadores contiverem palavras acentuadas, o código dá erro.
Por exemplo: se vc tiver um marcador de nome: "Preferências" (a palavra é acentuada), o código não reconhece palavras acentuadas, só não sei o 'pq'..
então a dica é que retire os acentos das palavras no marcador.
Fica até melhor para buscadores google encontrarem seu conteudo tb…^^
Querida fiz tudo certo,porém quando clico em um mmarcador ele não faz o direcionamento para aquela postagem específica