Fórum dos Fóruns

Fórum dos Fóruns Forumeiros

Welcome FdF Bem-vindo ao fórum de suporte Forumeiros  Muito feliz


Para aproveitar tudo o que o nosso fórum lhe oferece, agradecemos que se identifique, se já é nosso membro, ou que se junte à nossa comunidade, fazendo o seu registo.
Acesso rápido

Fóruns de suporte oficiais


Pesquisa de Satisfação
Queremos saber a sua opinião sobre os nossos serviços. Clique nesta vinheta e preencha este inquérito.

Login

Esqueci minha senha

Últimos assuntos
» [Logo] Musculação
Hoje à(s) 4:33 por P.H

» [Logo] Pássaros
Hoje à(s) 3:45 por P.H

» Problemas na ativação do Formulario
Hoje à(s) 1:59 por Harleen

» Mudar pre-visualização do formulário
Hoje à(s) 0:29 por YouTube3

» Personalizar SCEditor
Hoje à(s) 0:29 por YouTube3

» Personalizar Widget
Ontem à(s) 23:39 por YuriGama

» Bug na Pagina HTML
Ontem à(s) 23:37 por xBreninho_.

LiveStream TV Forumeiros - #Forumeiros
Perdi minha senha!
Obter senha

Nota: use se tiver perdido acesso ao seu painel de controle.

Parceiros Forumeiros
Quem está conectado
73 usuários online :: 1 usuário cadastrado, Nenhum Invisível e 72 Visitantes :: 1 Motor de busca

Lincoln

[ Ver toda a lista ]


O recorde de usuários online foi de 3131 em Qui 24 Dez 2009 - 15:05

Botoões redes sociais

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

Resolvido Botoões redes sociais

Mensagem por Fatalisss em Sab 15 Ago 2015 - 18:00

Detalhes da questão


Endereço do fórum: http://infostyle.forumbrasil.net/
Versão do fórum: PunBB

Descrição


Olá! Como na imagem abaixo:



  • Quero que tenha somente os botões de: Facebook, Twitter, Youtube e Changelog. (Icone de changelog pode ser o ultimo icone, só muda o link)


Links:

Facebook: https://www.facebook.com/pages/Info-Style/1664400833779192?ref=hl
Twitter: https://twitter.com/@infostyle_
Changelog: http://infostyle.forumbrasil.net/t190-changelog-oficial
Youtube: https://www.youtube.com/user/victornehs

Até mais!

Fatalisss
Usuário avançado

Masculino
Inscrito dia : 31/01/2014
Mensagens : 357
Pontos Ativos : 1584

http://infostyle.forumbrasil.net/ https://www.facebook.com/https://www.facebook.com/victor.vuzziikii https://twitter.com/https://twitter.com/@infostyle_

Resolvido Re: Botoões redes sociais

Mensagem por Sennior em Sab 15 Ago 2015 - 22:27

Saudações,

Adicione este código JavaScript com investimento em todas as páginas:
Código:
jQuery(function(){var facebook="https://www.facebook.com/pages/Info-Style/1664400833779192?ref=hl";var twitter="https://twitter.com/@infostyle_";var google="http://infostyle.forumbrasil.net/t190-changelog-oficial";var youtube="https://www.youtube.com/user/victornehs";jQuery('#search-box').before('<div id="siga_fdf"><a class="social-button fb-but" href="'+facebook+'" target="_blank" title="Facebook"></a><a class="social-button tw-but" href="'+twitter+'" target="_blank" title="Twitter"></a><a class="social-button gp-but" href="'+google+'" target="_blank" title="Google+"></a><a class="social-button yt-but" href="'+youtube+'" target="_blank" title="Youtube"></a><a class="social-button rs-but" href="/feed/?f=1" target="_blank" title="Feed de Anúncios e Atualizações"></a></div>')});

Logo depois, este CSS:
Código:
/* PERSONALIZAR REDES SOCIAIS */
#siga_fdf { background: url(http://i.imgur.com/oW7B8sP.png) no-repeat scroll 10px 5px transparent; float: left; padding-left: 170px; }

.social-button {
  background:no-repeat 50% 50% #333;
  border-radius:3px;
  display:inline-block;
  margin:3px;
  height:32px;
  width:32px;
  -webkit-transition:300ms;
    -moz-transition:300ms;
      -o-transition:300ms;
          transition:300ms;
}
.social-button:hover { background-color:#000 }

/* facebook */
.social-button.fb-but { background-image:url(http://i38.servimg.com/u/f38/18/21/41/30/fb11.png) }
.social-button.fb-but:hover { background-color:#3B5998 }

/* twitter */
.social-button.tw-but { background-image:url(http://i38.servimg.com/u/f38/18/21/41/30/tw10.png) }
.social-button.tw-but:hover { background-color:#5EA9DD }

/* google plus */
.social-button.gp-but { background-image:url(http://i38.servimg.com/u/f38/18/21/41/30/gp10.png) }
.social-button.gp-but:hover { background-color:#DD4B39 }

/* pinterest */
.social-button.pi-but { background-image:url(http://i38.servimg.com/u/f38/18/21/41/30/pi10.png) }
.social-button.pi-but:hover { background-color:#BB0000 }

/* youtube */
.social-button.yt-but { background-image:url(http://i38.servimg.com/u/f38/18/21/41/30/yt10.png) }
.social-button.yt-but:hover { background-color:#E52C27 }

/* rss feed */
.social-button.rs-but { background-image:url(http://i38.servimg.com/u/f38/18/21/41/30/rs10.png) }
.social-button.rs-but:hover { background-color:#FAA21B }
/* PERSONALIZAR REDES SOCIAIS */

Até mais.
Sennior

Tópico movido de 'Questões sobre a aparência do fórum' para 'Questões sobre JavaScript & jQuery'


Admineiros Jamais forneça seus dados pessoais, tais como e-mail de fundação ou senhas pelo fórum!
Admineiros  Antes de criar um novo tópico faça uma pesquisa rápida e olhe a lista de tutoriais prontos.
Admineiros Perdeu a senha de administração? Veja o que fazer.
Admineiros Ferramentas do Administrador.

"Você será lembrado pelo que faz, e não pela cor que tens".

Sennior
Admineiro
Admineiro

Masculino
Inscrito dia : 10/06/2011
Mensagens : 16230
Pontos Ativos : 22721

http://ajuda.forumeiros.com/forum https://www.facebook.com/GlladstonHenrique

Resolvido Re: Botoões redes sociais

Mensagem por Fatalisss em Dom 16 Ago 2015 - 0:53

Excelente sennior! Porém poderia retirar "Siga as novidades da Forumeiros" e deixar os icones centralizado como na FdF? Ele em questão criou uma barra coisa que não era para ter acontecido.

Fatalisss
Usuário avançado

Masculino
Inscrito dia : 31/01/2014
Mensagens : 357
Pontos Ativos : 1584

http://infostyle.forumbrasil.net/ https://www.facebook.com/https://www.facebook.com/victor.vuzziikii https://twitter.com/https://twitter.com/@infostyle_

Resolvido Re: Botoões redes sociais

Mensagem por Sennior em Dom 16 Ago 2015 - 0:56

Saudações!

Troque apenas o código CSS pelo abaixo:
Código:
/* PERSONALIZAR REDES SOCIAIS */
#siga_fdf { padding-left: 80px; }

.social-button {
  background:no-repeat 50% 50% #333;
  border-radius:3px;
  display:inline-block;
  margin:3px;
  height:32px;
  width:32px;
  -webkit-transition:300ms;
    -moz-transition:300ms;
      -o-transition:300ms;
          transition:300ms;
}
.social-button:hover { background-color:#000 }

/* facebook */
.social-button.fb-but { background-image:url(http://i38.servimg.com/u/f38/18/21/41/30/fb11.png) }
.social-button.fb-but:hover { background-color:#3B5998 }

/* twitter */
.social-button.tw-but { background-image:url(http://i38.servimg.com/u/f38/18/21/41/30/tw10.png) }
.social-button.tw-but:hover { background-color:#5EA9DD }

/* google plus */
.social-button.gp-but { background-image:url(http://i38.servimg.com/u/f38/18/21/41/30/gp10.png) }
.social-button.gp-but:hover { background-color:#DD4B39 }

/* pinterest */
.social-button.pi-but { background-image:url(http://i38.servimg.com/u/f38/18/21/41/30/pi10.png) }
.social-button.pi-but:hover { background-color:#BB0000 }

/* youtube */
.social-button.yt-but { background-image:url(http://i38.servimg.com/u/f38/18/21/41/30/yt10.png) }
.social-button.yt-but:hover { background-color:#E52C27 }

/* rss feed */
.social-button.rs-but { background-image:url(http://i38.servimg.com/u/f38/18/21/41/30/rs10.png) }
.social-button.rs-but:hover { background-color:#FAA21B }
/* PERSONALIZAR REDES SOCIAIS */

Algo mais?
Até breve.


Admineiros Jamais forneça seus dados pessoais, tais como e-mail de fundação ou senhas pelo fórum!
Admineiros  Antes de criar um novo tópico faça uma pesquisa rápida e olhe a lista de tutoriais prontos.
Admineiros Perdeu a senha de administração? Veja o que fazer.
Admineiros Ferramentas do Administrador.

"Você será lembrado pelo que faz, e não pela cor que tens".

Sennior
Admineiro
Admineiro

Masculino
Inscrito dia : 10/06/2011
Mensagens : 16230
Pontos Ativos : 22721

http://ajuda.forumeiros.com/forum https://www.facebook.com/GlladstonHenrique

Resolvido Re: Botoões redes sociais

Mensagem por Fatalisss em Dom 16 Ago 2015 - 1:43

O erro ainda continua..;

Fatalisss
Usuário avançado

Masculino
Inscrito dia : 31/01/2014
Mensagens : 357
Pontos Ativos : 1584

http://infostyle.forumbrasil.net/ https://www.facebook.com/https://www.facebook.com/victor.vuzziikii https://twitter.com/https://twitter.com/@infostyle_

Resolvido Re: Botoões redes sociais

Mensagem por Sennior em Dom 16 Ago 2015 - 1:48

Adicione este código CSS:
Código:
div#siga_fdf {
    background: none!Important;
}

Até mais.


Admineiros Jamais forneça seus dados pessoais, tais como e-mail de fundação ou senhas pelo fórum!
Admineiros  Antes de criar um novo tópico faça uma pesquisa rápida e olhe a lista de tutoriais prontos.
Admineiros Perdeu a senha de administração? Veja o que fazer.
Admineiros Ferramentas do Administrador.

"Você será lembrado pelo que faz, e não pela cor que tens".

Sennior
Admineiro
Admineiro

Masculino
Inscrito dia : 10/06/2011
Mensagens : 16230
Pontos Ativos : 22721

http://ajuda.forumeiros.com/forum https://www.facebook.com/GlladstonHenrique

Resolvido Re: Botoões redes sociais

Mensagem por Fatalisss em Dom 16 Ago 2015 - 2:00

Funcinou perfeitamente, porém ali tem 2 barras :/

Fatalisss
Usuário avançado

Masculino
Inscrito dia : 31/01/2014
Mensagens : 357
Pontos Ativos : 1584

http://infostyle.forumbrasil.net/ https://www.facebook.com/https://www.facebook.com/victor.vuzziikii https://twitter.com/https://twitter.com/@infostyle_

Resolvido Re: Botoões redes sociais

Mensagem por Fatalisss em Seg 17 Ago 2015 - 2:13

UP

Fatalisss
Usuário avançado

Masculino
Inscrito dia : 31/01/2014
Mensagens : 357
Pontos Ativos : 1584

http://infostyle.forumbrasil.net/ https://www.facebook.com/https://www.facebook.com/victor.vuzziikii https://twitter.com/https://twitter.com/@infostyle_

Resolvido Re: Botoões redes sociais

Mensagem por RafaelS. em Seg 17 Ago 2015 - 8:28

Olá!

Troque todos os códigos fornecidos neste tópico por este:

Javascript:

Código:
jQuery(function(){var facebook="https://www.facebook.com/pages/Info-Style/1664400833779192?ref=hl";var twitter="https://twitter.com/@infostyle_";var google="http://infostyle.forumbrasil.net/t190-changelog-oficial";var youtube="https://www.youtube.com/user/victornehs";jQuery('#page-body).before('<div id="siga_fdf"><a class="social-button fb-but" href="'+facebook+'" target="_blank" title="Facebook"></a><a class="social-button tw-but" href="'+twitter+'" target="_blank" title="Twitter"></a><a class="social-button gp-but" href="'+google+'" target="_blank" title="Google+"></a><a class="social-button yt-but" href="'+youtube+'" target="_blank" title="Youtube"></a><a class="social-button rs-but" href="/feed/?f=1" target="_blank" title="Feed de Anúncios e Atualizações"></a></div>')});

CSS:

Código:
/* PERSONALIZAR REDES SOCIAIS */

.social-button {
  background:no-repeat 50% 50% #333;
  border-radius:3px;
  display:inline-block;
  margin:3px;
  height:32px;
  width:32px;
  -webkit-transition:300ms;
    -moz-transition:300ms;
      -o-transition:300ms;
          transition:300ms;
}
.social-button:hover { background-color:#000 }

/* facebook */
.social-button.fb-but { background-image:url(http://i38.servimg.com/u/f38/18/21/41/30/fb11.png) }
.social-button.fb-but:hover { background-color:#3B5998 }

/* twitter */
.social-button.tw-but { background-image:url(http://i38.servimg.com/u/f38/18/21/41/30/tw10.png) }
.social-button.tw-but:hover { background-color:#5EA9DD }

/* google plus */
.social-button.gp-but { background-image:url(http://i38.servimg.com/u/f38/18/21/41/30/gp10.png) }
.social-button.gp-but:hover { background-color:#DD4B39 }

/* pinterest */
.social-button.pi-but { background-image:url(http://i38.servimg.com/u/f38/18/21/41/30/pi10.png) }
.social-button.pi-but:hover { background-color:#BB0000 }

/* youtube */
.social-button.yt-but { background-image:url(http://i38.servimg.com/u/f38/18/21/41/30/yt10.png) }
.social-button.yt-but:hover { background-color:#E52C27 }

/* rss feed */
.social-button.rs-but { background-image:url(http://i38.servimg.com/u/f38/18/21/41/30/rs10.png) }
.social-button.rs-but:hover { background-color:#FAA21B }
/* PERSONALIZAR REDES SOCIAIS */

Atenciosamente.

RafaelS.
Hiperativo

Masculino
Inscrito dia : 26/04/2014
Mensagens : 3098
Pontos Ativos : 4947

http://maisforum.forumeiros.com

Resolvido Re: Botoões redes sociais

Mensagem por Fatalisss em Seg 17 Ago 2015 - 15:39

Não funcionou.. sumiu foi tudo kkk

Fatalisss
Usuário avançado

Masculino
Inscrito dia : 31/01/2014
Mensagens : 357
Pontos Ativos : 1584

http://infostyle.forumbrasil.net/ https://www.facebook.com/https://www.facebook.com/victor.vuzziikii https://twitter.com/https://twitter.com/@infostyle_

Resolvido Re: Botoões redes sociais

Mensagem por Fatalisss em Qua 19 Ago 2015 - 2:59

UP

Fatalisss
Usuário avançado

Masculino
Inscrito dia : 31/01/2014
Mensagens : 357
Pontos Ativos : 1584

http://infostyle.forumbrasil.net/ https://www.facebook.com/https://www.facebook.com/victor.vuzziikii https://twitter.com/https://twitter.com/@infostyle_

Resolvido Re: Botoões redes sociais

Mensagem por Shek Crowley em Sex 21 Ago 2015 - 16:57

Boa tarde.

Acesse um widget no seu painel de controle, e em seguida adicione este HTML:
Código:
<div align="center">
 <a class="social-buttonFDF fb-but" href="https://www.facebook.com/pages/Info-Style/1664400833779192?ref=hl" target="_blank" title="Facebook"> </a><a class="social-buttonFDF tw-but" href="https://twitter.com/@infostyle_" target="_blank" title="Twitter"></a><a class="social-buttonFDF yt-but" href="https://www.youtube.com/user/victornehs" target="_blank" title="Youtube"></a>
</div>
Assim que salvar, acesse PA >> Visualização >> Imagens e Cores >> Cores >> Folha de estilos CSS e cole este CSS:
Código:
/* PERSONALIZAR REDES SOCIAIS */
.social-buttonFDF {
   background: no-repeat 50% 50% #333;
   border-radius: 3px;
   display: inline-block;
   margin: 3px;
   height: 32px;
   width: 32px;
   -webkit-transition: 300ms;
   -moz-transition: 300ms;
   -o-transition: 300ms;
   transition: 300ms;
 }

   .social-buttonFDF:hover {background-color: #000}

   /* facebook */
.social-buttonFDF.fb-but {background-image: url(http://i38.servimg.com/u/f38/18/21/41/30/fb11.png)}

      .social-buttonFDF.fb-but:hover {background-color: #3B5998}

   /* twitter */
.social-buttonFDF.tw-but {background-image: url(http://i38.servimg.com/u/f38/18/21/41/30/tw10.png)}

      .social-buttonFDF.tw-but:hover {background-color: #5EA9DD}

   /* google plus */
.social-buttonFDF.gp-but {background-image: url(http://i38.servimg.com/u/f38/18/21/41/30/gp10.png)}

      .social-buttonFDF.gp-but:hover {background-color: #DD4B39}

   /* pinterest */
.social-buttonFDF.pi-but {background-image: url(http://i38.servimg.com/u/f38/18/21/41/30/pi10.png)}

      .social-buttonFDF.pi-but:hover {background-color: #BB0000}

   /* youtube */
.social-buttonFDF.yt-but {background-image: url(http://i38.servimg.com/u/f38/18/21/41/30/yt10.png)}

      .social-buttonFDF.yt-but:hover {background-color: #E52C27}

   /* rss feed */
.social-buttonFDF.rs-but {background-image: url(http://i38.servimg.com/u/f38/18/21/41/30/rs10.png)}

      .social-buttonFDF.rs-but:hover {background-color: #FAA21B}

/* PERSONALIZAR REDES SOCIAIS */
Atenciosamente,
Shek King


Seta Respeite as Regras gerais do fórum e conheça a nossa equipa.
Seta Veja a Lista de FAQs do seu Painel e Lista de tutoriais
Seta Ferramentas do Administrador
Seta Assinalar um Litígio


Shek Crowley
Admineiro
Admineiro

Masculino
Inscrito dia : 11/04/2009
Mensagens : 15139
Pontos Ativos : 22372

http://www.shiftactif.com https://www.facebook.com/shek.crowley https://twitter.com/shek_forumactif

Resolvido Re: Botoões redes sociais

Mensagem por Fatalisss em Sab 22 Ago 2015 - 16:38

Shek escreveu:Boa tarde.

Acesse um widget no seu painel de controle, e em seguida adicione este HTML:
Código:
<div align="center">
 <a class="social-buttonFDF fb-but" href="https://www.facebook.com/pages/Info-Style/1664400833779192?ref=hl" target="_blank" title="Facebook"> </a><a class="social-buttonFDF tw-but" href="https://twitter.com/@infostyle_" target="_blank" title="Twitter"></a><a class="social-buttonFDF yt-but" href="https://www.youtube.com/user/victornehs" target="_blank" title="Youtube"></a>
</div>
Assim que salvar, acesse PA >> Visualização >> Imagens e Cores >> Cores >> Folha de estilos CSS e cole este CSS:
Código:
/* PERSONALIZAR REDES SOCIAIS */
.social-buttonFDF {
   background: no-repeat 50% 50% #333;
   border-radius: 3px;
   display: inline-block;
   margin: 3px;
   height: 32px;
   width: 32px;
   -webkit-transition: 300ms;
   -moz-transition: 300ms;
   -o-transition: 300ms;
   transition: 300ms;
 }

   .social-buttonFDF:hover {background-color: #000}

   /* facebook */
.social-buttonFDF.fb-but {background-image: url(http://i38.servimg.com/u/f38/18/21/41/30/fb11.png)}

      .social-buttonFDF.fb-but:hover {background-color: #3B5998}

   /* twitter */
.social-buttonFDF.tw-but {background-image: url(http://i38.servimg.com/u/f38/18/21/41/30/tw10.png)}

      .social-buttonFDF.tw-but:hover {background-color: #5EA9DD}

   /* google plus */
.social-buttonFDF.gp-but {background-image: url(http://i38.servimg.com/u/f38/18/21/41/30/gp10.png)}

      .social-buttonFDF.gp-but:hover {background-color: #DD4B39}

   /* pinterest */
.social-buttonFDF.pi-but {background-image: url(http://i38.servimg.com/u/f38/18/21/41/30/pi10.png)}

      .social-buttonFDF.pi-but:hover {background-color: #BB0000}

   /* youtube */
.social-buttonFDF.yt-but {background-image: url(http://i38.servimg.com/u/f38/18/21/41/30/yt10.png)}

      .social-buttonFDF.yt-but:hover {background-color: #E52C27}

   /* rss feed */
.social-buttonFDF.rs-but {background-image: url(http://i38.servimg.com/u/f38/18/21/41/30/rs10.png)}

      .social-buttonFDF.rs-but:hover {background-color: #FAA21B}

/* PERSONALIZAR REDES SOCIAIS */
Atenciosamente,
Shek King

Ahhe valeu cara, funciono perfeitamente.

Fatalisss
Usuário avançado

Masculino
Inscrito dia : 31/01/2014
Mensagens : 357
Pontos Ativos : 1584

http://infostyle.forumbrasil.net/ https://www.facebook.com/https://www.facebook.com/victor.vuzziikii https://twitter.com/https://twitter.com/@infostyle_

Resolvido Re: Botoões redes sociais

Mensagem por Fraise em Sab 22 Ago 2015 - 20:19

Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada.
Tópico marcado como Resolvido e movido para Questões resolvidas.

Fraise
Super usuário

Masculino
Inscrito dia : 26/06/2015
Mensagens : 4973
Pontos Ativos : 7161

http://ajuda.forumeiros.com/ https://twitter.com/@FraiseFdF

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

- Tópicos similares

Permissão deste fórum:
Você não pode responder aos tópicos neste fórum
Fórum dos Fóruns - Ajuda mútua para usuários forumeiros
on
Fórum grátis: interajuda aos usuários forumeiros. Criar e administrar um fórum. Descubra nossos guias, tutoriais e astúcias no suporte de Forumeiros.
Votações: 5