Fórum dos Bloggers
Participe do melhor fórum de ajuda!


Venha participar do melhor fórum de suporte do Blogger na internet. FAQs & tutoriais feitos para personalizar seu blog! Registre-se e faça parte desta comunidade que só cresce a cada dia!


Cliques Rápidos
Blogger e afins
Suporte Blogger
Serviço para usuários
Miscelânea
Links importântes

Desfrute dos melhores serviços de criação de blogs da internet. Crie seu blog sem pagar nada, com serviço de hospedagem e suporte grátis! Crie seu blog, chame os amigos e mostre suas idéias para o mundo!

Link-Nos


Últimos assuntos
» [TUTORIAL] Ícones de redes sociais
Seg 30 Abr 2012 - 11:29 por Shek

» [TUTORIAL] Alterar "disse/escreveu" dos artigos do blog
Seg 30 Abr 2012 - 11:09 por Shek

» Modificação do nome de usuário (apelido)
Seg 30 Abr 2012 - 10:53 por Shek

» [TUTORIAL] Estrelas acompanhando o cursor do mouse
Seg 30 Abr 2012 - 10:29 por Shek

» 1º Pacotão de tutoriais e temas de 2012
Ter 31 Jan 2012 - 11:11 por Jaff

» [TUTORIAL] Estrelas seguindo o mouse
Sex 27 Jan 2012 - 12:37 por Jaff

» Modificações na staff - Entrada e saída de membros
Ter 17 Jan 2012 - 11:08 por Jaff

» Quais os melhores blogs de moda?
Qui 15 Dez 2011 - 16:47 por elephant gun

» [TUTORIAL] Ícones de Redes Sociais
Seg 12 Dez 2011 - 17:04 por Pezzi

Login

Esqueci minha senha

Maio 2012
DomSegTerQuaQuiSexSab
  12345
6789101112
13141516171819
20212223242526
2728293031  

Calendário Calendário

Quem está conectado
2 usuários online :: Nenhum usuário registrado, Nenhum Invisível e 2 Visitantes :: 1 Motor de busca

Nenhum

[ Ver toda a lista ]


O recorde de usuários online foi de 36 em Seg 13 Jun 2011 - 17:17

[TUTORIAL] Ícones de Redes Sociais

Ver o tópico anterior Ver o tópico seguinte Ir em baixo

[TUTORIAL] Ícones de Redes Sociais

Mensagem por Pezzi em Seg 12 Dez 2011 - 17:04

Ícones de Redes Sociais


Tenha mais leitores em seu blog! Aumente o SEO de seu blog divulgando em mais redes sociais as suas mensagens!


--> Tutoriais Especiais <--
Ícones de Redes Sociais



- Entre em seu Painel de Controle:
Entre em seu painel de Controle a Seção de Edição de HTML;



Arrow Guia Design - Clique na guia denominada 'Design' ara editar o Design do blog.
Arrow Aba Editar HTML - Clique nesta aba para podermos editar o HTML base do blog.


- Códigos a serem Adicionados:
Teremos de dicionar 2 códigos em diferentes partes do código HTML base de nosso blog, prestem atenção;

Código CSS


procure por ]]></b:skin> e cole o código CSS abaixo antes dele:

Código:
/* BOOKMARKS */

.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;
}


este código não precisa de alteração. Salve esta alteração.

Código HTML


Marque a opção Expandir modelos de widgets.
Procure por <div class='post-footer-line post-footer-line-3'> e cole o código abaixo antes:

Código:
<b:if cond='data:blog.pageType == "item"'>
<div class='bookmarks'>
<a expr:href='"http://digg.com/submit?phase=2&amp;url=" + data:post.url + "/&amp;title=" + data:post.title' rel='nofollow' target='_blank' title='Digg'><img alt='Digg' class='sociable-hovers' src='http://img443.imageshack.us/img443/2451/diggq.png' title='Digg'/></a>
<a expr:href='"http://del.icio.us/post?url=" + data:post.url + "/&amp;title=" + data:post.title' rel='nofollow' target='_blank' title='del.icio.us'><img alt='del.icio.us' class='sociable-hovers' src='http://img163.imageshack.us/img163/8637/deliciousn.png' title='del.icio.us'/></a>
<a expr:href='"http://www.facebook.com/share.php?u=" + data:post.url + "/&amp;t=" + data:post.title' rel='nofollow' target='_blank' title='Facebook'><img alt='Facebook' class='sociable-hovers' src='http://img338.imageshack.us/img338/6397/facebookiconqf.gif' title='Facebook'/></a>
<a expr:href='"http://www.google.com/bookmarks/mark?op=edit&amp;bkmk=" + data:post.url + "/&amp;title=" + data:post.title' rel='nofollow' target='_blank' title='Google'><img alt='Google' class='sociable-hovers' src='http://img87.imageshack.us/img87/1899/googlei.gif' title='Google'/></a>
<a expr:href='"http://www.blinklist.com/index.php?Action=Blink/addblink.php&amp;=" + data:post.url + "/&amp;title=" + data:post.title' rel='nofollow' target='_blank' title='BlinkList'><img alt='BlinkList' class='sociable-hovers' src='http://img338.imageshack.us/img338/8854/blinklist.png' title='BlinkList'/></a>
<a expr:href='"http://www.myspace.com/Modules/PostTo/Pages/?u=" + data:post.url + "/&amp;t=" + data:post.title' rel='nofollow' target='_blank' title='MySpace'><img alt='MySpace' class='sociable-hovers' src='http://img338.imageshack.us/img338/707/bookmarksitemyspace.gif' title='MySpace'/></a>
<a expr:href='"http://www.newsvine.com/_tools/seed&amp;save?u=" + data:post.url + "/&amp;h=" + data:post.title' rel='nofollow' target='_blank' title='NewsVine'><img alt='NewsVine' class='sociable-hovers' src='http://img217.imageshack.us/img217/3537/iconnewsvine.gif' title='NewsVine'/></a>
<a expr:href='"http://www.syxt.com.br/rec6/link.php?url=" + data:post.url + "/&amp;=" + data:post.title' rel='nofollow' target='_blank' title='Rec6'><img alt='Rec6' class='sociable-hovers' src='http://img580.imageshack.us/img580/7093/rec6.png' title='Rec6'/></a>
<a expr:href='"http://reddit.com/submit?url=" + data:post.url + "/&amp;title=" + data:post.title' rel='nofollow' target='_blank' title='Reddit'><img alt='Reddit' class='sociable-hovers' src='http://img217.imageshack.us/img217/921/ssiconreddit.jpg' title='Reddit'/></a>
<a expr:href='"http://www.spurl.net/spurl.php?url=" + data:post.url + "/&amp;title=" + data:post.title' rel='nofollow' target='_blank' title='Spurl'><img alt='Spurl' class='sociable-hovers' src='http://img217.imageshack.us/img217/9018/spurl.gif' title='Spurl'/></a>
<a expr:href='"http://www.stumbleupon.com/submit?url=" + data:post.url + "/&amp;title=" + data:post.title' rel='nofollow' target='_blank' title='StumbleUpon'><img alt='StumbleUpon' class='sociable-hovers' src='http://img87.imageshack.us/img87/3241/stumbleupon.gif' title='StumbleUpon'/></a>
<a expr:href='"http://twitthis.com/twit?url=" + data:post.url + "/&amp;title=" + data:post.title' rel='nofollow' target='_blank' title='TwitThis'><img alt='TwitThis' class='sociable-hovers' src='http://img87.imageshack.us/img87/9946/icotwitter.jpg' title='TwitThis'/></a>
<a expr:href='"http://myweb2.search.yahoo.com/myresults/bookmarklet?u=" + data:post.url + "&amp;title=" + data:post.title' target='_blank'><img alt='Agregar a Yahoo!' class='rsociales-sobre' src='http://img188.imageshack.us/img188/41/yahoou.png'/></a>
<a expr:href='"http://www.technorati.com/faves?add=" + data:post.url + "&amp;title=" + data:post.title' target='_blank'><img alt='Agregar a Technorati' class='rsociales-sobre' src='http://img188.imageshack.us/img188/4666/technorati.gif'/></a>
<a expr:href='"http://dihitt.com.br?botao=enviar&amp;url=" + data:post.url + "&amp;titulo=" + data:post.title' target='_blank' title='Incluir no diHITT'><img class='rsociales-sobre' src='http://img192.imageshack.us/img192/29/dihitt.png'/></a>
<a expr:href='"http://ueba.com.br/NovoLink?url=" + data:post.url + "&amp;titulo=" + data:post.title' target='_blank' title='Incluir no Uêba'><img class='rsociales-sobre' src='http://img204.imageshack.us/img204/9272/ueba.png'/></a>
<a expr:href='"http://blogmarks.net/my/new.php?mini=1&amp;simple=1&amp;url=" + data:post.url + "&amp;title=" + data:post.title' target='_blank'><img alt='Agregar a Blogmarks' class='rsociales-sobre' src='http://img293.imageshack.us/img293/4683/blogmarks.gif'/></a>
<a expr:href='data:post.emailPostUrl' target='_blank' title='Enviar por Email'><img class='rsociales-sobre' src='http://img87.imageshack.us/img87/923/mail2.png'/></a>
<a expr:href='"http://www.linkk.com.br/submit.php?url=" + data:post.url + "&amp;title=" + data:post.title' target='_blank' title='Incluir no LinkK'><img class='rsociales-sobre' src='http://img580.imageshack.us/img580/8496/linkk.png'/></a>
<a href='http://SEUBLOG.blogspot.com/feeds/posts/default'><img alt='Assinar feed' class='rsociales-sobre' src='http://img62.imageshack.us/img62/3664/ffeediconmd7f6717.gif'/></a>
</div>
</b:if>


Ao final do código, têm escrito 'SEUBLOG' troque pelo endereço do seu blog e Salve.

- Resultado:

Imagens
Antes
Depois




© Fórum dos Bloggers


Se tiver alguma dúvida relacionada com este tópico crie um tópico com o seguinte título:
[Dúvida] Ícones de Redes Sociais

Pezzi
Sou Membro do fórum

Masculino
Idade: 14
Atividade: 28
Reputação: 3
Mensagens: 75
Registrado dia: 04/12/2011
100%
Brasil Google Chrome

Ver perfil do usuário http://ajuda.foruns.com.pt/

Voltar ao Topo Ir em baixo

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo


Permissão deste fórum:
Você não pode responder aos tópicos neste fórum