dicashot
Gata da vez
(+18)
DicasHot
HBO MOVIES ONLINE
TV
dicashot
Cartoon Network PT
TV
dicashot
ANI ROCHA NO FUNK
DANÇANDO MUITO



Nuvem de tags em 3D no blog


Nuvem de tags em 3D no blogHoje falarei aqui no DicasHot algo que vocês com certeza iram gostar... e é algo bem interessante, porque também chama atenção dos buscadores, como o Google, o Yahoo, o Bing, etc. Ensinarei aqui no DicasHot a como colocar uma nuvem de tags em 3D no seu blog. Veja a imagem ao lado, pois, é exatamente assim que irá ficar. 

                 

Colocando o código

1° passo: Vá até o painel do seu blog e clique em "Design"; entrando em design, clique em "Editar HTML" e em sequência clique em "";

Após feito isto, procure pelo código: (Apenas dê um Ctrl+F e procure pela primeira linha do código abaixo).
___________________________________________________________________________________
<b:widget id='Label1' locked='false' title='Categorias' type='Label'> <b:includable id='main'> <b:if cond='data:title'> <h2><img src='http://i32.tinypic.com/241wktu.jpg'/><data:title/></h2> </b:if> <div expr:class='&quot;widget-content &quot; + data:display + &quot;-label-widget-content&quot;'> <b:if cond='data:display == &quot;list&quot;'> <ul> <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> </li> </b:loop> </ul> <b:else/> <b:loop values='data:labels' var='label'> <span expr:class='&quot;label-size-&quot; + data:label.cssSize'> <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> </span> </b:loop> </b:if> <b:include name='quickedit'/> </div> </b:includable> </b:widget>
___________________________________________________________________________________

2° passo:  substitua tudo que está entre <b:includable id='main'> e </b:widget> pelo código abaixo:


<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>

&lt;object type="application/x-shockwave-flash" data="http://sites.google.com/site/bloggerustemplatus/code/tagcloud.swf"
width="250" height="200" allowscriptaccess="always" &gt;
&lt;param name="movie" value="http://sites.google.com/site/bloggerustemplatus/code/tagcloud.swf" /&gt;
&lt;param name="bgcolor" value="#
ffffff" /&gt;
&lt;param name="flashvars" value="tcolor=0x000000&amp;mode=tags&amp;distr=true&amp;tspeed=100&amp;tagcloud=&lt;tags&gt;
<b:loop values='data:labels' var='label'>
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url' style='12'><data:label.name/></a>
</b:loop>
&lt;/tags&gt;" /&gt;
&lt;p&gt;Blogumulus by &lt;a href='http://www.roytanck.com/'&gt;Roy Tanck&lt;/a&gt; and &lt;a href='http://www.bloggerbuster.com'&gt;Amanda Fazani&lt;/a&gt;&lt;/p&gt;
&lt;/object&gt;


</div>

<b:include name='quickedit'/>
</b:includable>
</b:widget>


Lembrando que o código acima já contém o <b:includable id='main'> e </b:widget> então cuidado para não repetir o mesmo código por que pode dar erro.

Colocando o código, irá aparecer no seu template um gadiget em Elementos da Página com o nome Labels.



Nuvem de tags em 3D no blog

Observação: Para que o código funcione, você precisa ter marcadores no seu blog!!!

''Quanto mais marcadores você tiver mais bonito ficará a sua nuvem de tags''.


Personalizando o básico

Largura e altura da widget: width = "240" height = "300"
apenas altere os valores 240 largura e 300 altura, cuidado para não deixar mais larga que a coluna do seu blog.

Cor de fundo &quot; #ffffff &quot;);
as letras ffffff é a cor de fundo, aqui tem o código de várias cores basta trocar as letras.

Cor do Texto: 0x333333
idêntico a cor de fundo, mas essa é a cor do texto então veja os códigos das cores acima e use a cor que desejar.

Tamanho do texto: style='12'
o número 12 é o tamanho da letra então altere como quiser.

Se inscreva e receba nossas atualizações por e-mail:





Cursos 24 Horas

Cursos Online
Nuvem de tags em 3D no blog Nuvem de tags em 3D no blog Reviewed by Muca on 8/19/2013 09:59:00 AM Rating: 5