ícones para redes socias - By: Guia Blogger
Autor: WebWaysS | Publicado: 2010-09-23T16:21:00-07:00

Nesse tutorial eu vou ensinar a colocar ícones para redes sociais no rodapé dos posts. O código já possui algumas das novidades do CSS3.
Para começar, procure por ]]&gt;&lt;/b:skin&gt; e cole o código abaixo antes dele:
/* BOOKMARKS by GB */

.bookmarks {
text-align: center;
}
.bookmarks img {
border: none;
opacity:0.4;
filter:alpha(opacity=40);
border: 2px solid silver;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
padding: 2px;
width: 18px;
height: 18px;
}
.bookmarks img:hover {
opacity:1;
filter:alpha(opacity=1);
border: 2px solid silver;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
padding: 2px;
}Salve.
Depois, marque a opção Expandir modelos de widgets e cole o código abaixo antes de &lt;div class='post-footer-line post-footer-line-3'/&gt;.
&lt;b:if cond='data:blog.pageType == &amp;quot;item&amp;quot;'&gt;
&lt;div class='bookmarks'&gt;
&lt;a  expr:href='&amp;quot;http://digg.com/submit?phase=2&amp;amp;url=&amp;quot;  + data:post.url + &amp;quot;/&amp;amp;title=&amp;quot; +  data:post.title' rel='nofollow' target='_blank' title='Digg'&gt;&lt;img  alt='Digg' class='sociable-hovers'  src='http://img443.imageshack.us/img443/2451/diggq.png'  title='Digg'/&gt;&lt;/a&gt;
&lt;a expr:href='&amp;quot;http://del.icio.us/post?url=&amp;quot; +  data:post.url + &amp;quot;/&amp;amp;title=&amp;quot; + data:post.title'  rel='nofollow' target='_blank' title='del.icio.us'&gt;&lt;img  alt='del.icio.us' class='sociable-hovers'  src='http://img163.imageshack.us/img163/8637/deliciousn.png'  title='del.icio.us'/&gt;&lt;/a&gt;
&lt;a  expr:href='&amp;quot;http://www.facebook.com/share.php?u=&amp;quot; +  data:post.url + &amp;quot;/&amp;amp;t=&amp;quot; + data:post.title'  rel='nofollow' target='_blank' title='Facebook'&gt;&lt;img  alt='Facebook' class='sociable-hovers'  src='http://img338.imageshack.us/img338/6397/facebookiconqf.gif'  title='Facebook'/&gt;&lt;/a&gt;
&lt;a  expr:href='&amp;quot;http://www.google.com/bookmarks/mark?op=edit&amp;amp;bkmk=&amp;quot;  + data:post.url + &amp;quot;/&amp;amp;title=&amp;quot; +  data:post.title' rel='nofollow' target='_blank'  title='Google'&gt;&lt;img alt='Google' class='sociable-hovers'  src='http://img87.imageshack.us/img87/1899/googlei.gif'  title='Google'/&gt;&lt;/a&gt;
&lt;a  expr:href='&amp;quot;http://www.blinklist.com/index.php?Action=Blink/addblink.php&amp;amp;=&amp;quot;  + data:post.url + &amp;quot;/&amp;amp;title=&amp;quot; +  data:post.title' rel='nofollow' target='_blank'  title='BlinkList'&gt;&lt;img alt='BlinkList' class='sociable-hovers'  src='http://img338.imageshack.us/img338/8854/blinklist.png'  title='BlinkList'/&gt;&lt;/a&gt;
&lt;a  expr:href='&amp;quot;http://www.myspace.com/Modules/PostTo/Pages/?u=&amp;quot;  + data:post.url + &amp;quot;/&amp;amp;t=&amp;quot; + data:post.title'  rel='nofollow' target='_blank' title='MySpace'&gt;&lt;img alt='MySpace'  class='sociable-hovers'  src='http://img338.imageshack.us/img338/707/bookmarksitemyspace.gif'  title='MySpace'/&gt;&lt;/a&gt;
&lt;a  expr:href='&amp;quot;http://www.newsvine.com/_tools/seed&amp;amp;save?u=&amp;quot;  + data:post.url + &amp;quot;/&amp;amp;h=&amp;quot; + data:post.title'  rel='nofollow' target='_blank' title='NewsVine'&gt;&lt;img  alt='NewsVine' class='sociable-hovers'  src='http://img217.imageshack.us/img217/3537/iconnewsvine.gif'  title='NewsVine'/&gt;&lt;/a&gt;
&lt;a  expr:href='&amp;quot;http://www.syxt.com.br/rec6/link.php?url=&amp;quot;  + data:post.url + &amp;quot;/&amp;amp;=&amp;quot; + data:post.title'  rel='nofollow' target='_blank' title='Rec6'&gt;&lt;img alt='Rec6'  class='sociable-hovers'  src='http://img580.imageshack.us/img580/7093/rec6.png'  title='Rec6'/&gt;&lt;/a&gt;
&lt;a expr:href='&amp;quot;http://reddit.com/submit?url=&amp;quot; +  data:post.url + &amp;quot;/&amp;amp;title=&amp;quot; + data:post.title'  rel='nofollow' target='_blank' title='Reddit'&gt;&lt;img alt='Reddit'  class='sociable-hovers'  src='http://img217.imageshack.us/img217/921/ssiconreddit.jpg'  title='Reddit'/&gt;&lt;/a&gt;
&lt;a expr:href='&amp;quot;http://www.spurl.net/spurl.php?url=&amp;quot;  + data:post.url + &amp;quot;/&amp;amp;title=&amp;quot; +  data:post.title' rel='nofollow' target='_blank' title='Spurl'&gt;&lt;img  alt='Spurl' class='sociable-hovers'  src='http://img217.imageshack.us/img217/9018/spurl.gif'  title='Spurl'/&gt;&lt;/a&gt;
&lt;a  expr:href='&amp;quot;http://www.stumbleupon.com/submit?url=&amp;quot; +  data:post.url + &amp;quot;/&amp;amp;title=&amp;quot; + data:post.title'  rel='nofollow' target='_blank' title='StumbleUpon'&gt;&lt;img  alt='StumbleUpon' class='sociable-hovers'  src='http://img87.imageshack.us/img87/3241/stumbleupon.gif'  title='StumbleUpon'/&gt;&lt;/a&gt;
&lt;a expr:href='&amp;quot;http://twitthis.com/twit?url=&amp;quot; +  data:post.url + &amp;quot;/&amp;amp;title=&amp;quot; + data:post.title'  rel='nofollow' target='_blank' title='TwitThis'&gt;&lt;img  alt='TwitThis' class='sociable-hovers'  src='http://img87.imageshack.us/img87/9946/icotwitter.jpg'  title='TwitThis'/&gt;&lt;/a&gt;
&lt;a  expr:href='&amp;quot;http://myweb2.search.yahoo.com/myresults/bookmarklet?u=&amp;quot;  + data:post.url + &amp;quot;&amp;amp;title=&amp;quot; +  data:post.title' target='_blank'&gt;&lt;img alt='Agregar a Yahoo!'  class='rsociales-sobre'  src='http://img188.imageshack.us/img188/41/yahoou.png'/&gt;&lt;/a&gt;
&lt;a  expr:href='&amp;quot;http://www.technorati.com/faves?add=&amp;quot; +  data:post.url + &amp;quot;&amp;amp;title=&amp;quot; + data:post.title'  target='_blank'&gt;&lt;img alt='Agregar a Technorati'  class='rsociales-sobre'  src='http://img188.imageshack.us/img188/4666/technorati.gif'/&gt;&lt;/a&gt;
&lt;a  expr:href='&amp;quot;http://dihitt.com.br?botao=enviar&amp;amp;url=&amp;quot;  + data:post.url + &amp;quot;&amp;amp;titulo=&amp;quot; +  data:post.title' target='_blank' title='Incluir no diHITT'&gt;&lt;img  class='rsociales-sobre'  src='http://img192.imageshack.us/img192/29/dihitt.png'/&gt;&lt;/a&gt;
&lt;a expr:href='&amp;quot;http://ueba.com.br/NovoLink?url=&amp;quot; +  data:post.url + &amp;quot;&amp;amp;titulo=&amp;quot; + data:post.title'  target='_blank' title='Incluir no Uêba'&gt;&lt;img  class='rsociales-sobre'  src='http://img204.imageshack.us/img204/9272/ueba.png'/&gt;&lt;/a&gt;
&lt;a  expr:href='&amp;quot;http://blogmarks.net/my/new.php?mini=1&amp;amp;simple=1&amp;amp;url=&amp;quot;  + data:post.url + &amp;quot;&amp;amp;title=&amp;quot; +  data:post.title' target='_blank'&gt;&lt;img alt='Agregar a Blogmarks'  class='rsociales-sobre'  src='http://img293.imageshack.us/img293/4683/blogmarks.gif'/&gt;&lt;/a&gt;
&lt;a expr:href='data:post.emailPostUrl' target='_blank' title='Enviar  por Email'&gt;&lt;img class='rsociales-sobre'  src='http://img87.imageshack.us/img87/923/mail2.png'/&gt;&lt;/a&gt;
&lt;a  expr:href='&amp;quot;http://www.linkk.com.br/submit.php?url=&amp;quot; +  data:post.url + &amp;quot;&amp;amp;title=&amp;quot; + data:post.title'  target='_blank' title='Incluir no LinkK'&gt;&lt;img  class='rsociales-sobre'  src='http://img580.imageshack.us/img580/8496/linkk.png'/&gt;&lt;/a&gt;
&lt;a href='http://SEUBLOG.blogspot.com/feeds/posts/default'&gt;&lt;img  alt='Assinar feed' class='rsociales-sobre'  src='http://img62.imageshack.us/img62/3664/ffeediconmd7f6717.gif'/&gt;&lt;/a&gt;
&lt;/div&gt;
&lt;/b:if&gt;No lugar da URL em azul, você deve colocar o endereço do seu feed.Visualize para ver se está tudo certo, se estiver, clique em salvar e pronto.
Ficou alguma dúvida? Deixe um comentário!
Até a próxima...