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.
Conectar-se

Esqueci minha senha

Últimos assuntos
» Kit avatar e assinatura.
Hoje à(s) 01:37 am por ranzatti

» Efeito nos grupos
Hoje à(s) 12:17 am por Matt Shultz

» PAGINA HTML
Hoje à(s) 12:08 am por T1ag0

» Concurso do Dia das Bruxas: Vossas participações
Ontem à(s) 11:05 pm por iScroll

» Logo fixo
Ontem à(s) 10:50 pm por iScroll

» Logo para um fórum
Ontem à(s) 10:36 pm por Hyouran

» Rank para o meu fórum
Ontem à(s) 10:33 pm por Matt Shultz

Perdi minha senha!
Você precisa recuperar sua senha?
Clique aqui
Os membros mais ativos da semana
Luiz
 
Matt Shultz
 
iScroll
 
Harleen
 
Ketholy123
 
T1ag0
 
PlayWillian
 
zHugh
 
soldado
 
Lecxa
 

Quem está conectado
179 usuários online :: 1 usuário cadastrado, Nenhum Invisível e 178 Visitantes :: 2 Motores de busca

soldado

[ Ver toda a lista ]


O recorde de usuários online foi de 3131 em 24/12/09, 01:05 pm

Widget TeamSpeak3

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

Resolvido Widget TeamSpeak3

Mensagem por YouTube3 em 08/03/17, 04:40 pm

Detalhes da questão


Endereço do fórum: http://vgnfamily.forumais.com/
Versão do fórum: PunBB

Descrição


Boa tarde,

Gostaria de botar um widget de TeamSpeak3 em meu fórum.

Imagem do widget: http://i.imgur.com/iWIswyn.jpg
Quando passo o mouse encima: http://i.imgur.com/a1Vpe7M.jpg
Quando clico em conectar-se: http://i.imgur.com/jKNIHZS.jpg

Fórum aonde vi: http://www.brasilplaystart.com.br/forum/

Até mais.
avatar

YouTube3
Membro do Fórum

Masculino
Inscrito dia : 04/01/2015
Mensagens : 1080
Pontos Ativos : 1543

Ver perfil do usuário http://Ajuda.Forumeiros.com

Resolvido Re: Widget TeamSpeak3

Mensagem por YouTube3 em 09/03/17, 09:03 pm

#up
avatar

YouTube3
Membro do Fórum

Masculino
Inscrito dia : 04/01/2015
Mensagens : 1080
Pontos Ativos : 1543

Ver perfil do usuário http://Ajuda.Forumeiros.com
  • 0

Resolvido Re: Widget TeamSpeak3

Mensagem por Kyo Panda em 10/03/17, 02:26 pm

O senhor precisaria nos fornecer as imagens a serem usadas nesse widget para seu fórum.

o/


Bem-vindo ao Fórum dos Fóruns!
Leia as Regras do Fórum dos Fóruns. Alguns setores possuem regras específicas.
Verifique se sua questão já não foi respondida.
Seja cordial e respeite o tempo dos voluntários para atender o seu pedido.
Kyo Panda — Moderadeiro
avatar

Kyo Panda
Moderadeiro
Moderadeiro

Masculino
Inscrito dia : 08/01/2012
Mensagens : 4490
Pontos Ativos : 5784

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

Resolvido Re: Widget TeamSpeak3

Mensagem por YouTube3 em 11/03/17, 12:40 pm

Irei deixar está por enquanto: http://i.imgur.com/m1lugLN.png
Depois irei troca-lá.
avatar

YouTube3
Membro do Fórum

Masculino
Inscrito dia : 04/01/2015
Mensagens : 1080
Pontos Ativos : 1543

Ver perfil do usuário http://Ajuda.Forumeiros.com

Resolvido Re: Widget TeamSpeak3

Mensagem por Kyo Panda em 13/03/17, 08:26 am

Infelizmente eu não posso utilizar essa imagem, pois é igual a do site referido. Precisa ser algo personalizado para não violar as nossas regras.


Bem-vindo ao Fórum dos Fóruns!
Leia as Regras do Fórum dos Fóruns. Alguns setores possuem regras específicas.
Verifique se sua questão já não foi respondida.
Seja cordial e respeite o tempo dos voluntários para atender o seu pedido.
Kyo Panda — Moderadeiro
avatar

Kyo Panda
Moderadeiro
Moderadeiro

Masculino
Inscrito dia : 08/01/2012
Mensagens : 4490
Pontos Ativos : 5784

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

Resolvido Re: Widget TeamSpeak3

Mensagem por YouTube3 em 13/03/17, 02:21 pm

Sem problemas pode ser está mesmo: http://i.imgur.com/lsWPxLt.png
avatar

YouTube3
Membro do Fórum

Masculino
Inscrito dia : 04/01/2015
Mensagens : 1080
Pontos Ativos : 1543

Ver perfil do usuário http://Ajuda.Forumeiros.com

Resolvido Re: Widget TeamSpeak3

Mensagem por YouTube3 em 14/03/17, 08:45 pm

#up
avatar

YouTube3
Membro do Fórum

Masculino
Inscrito dia : 04/01/2015
Mensagens : 1080
Pontos Ativos : 1543

Ver perfil do usuário http://Ajuda.Forumeiros.com
  • 0

Resolvido Re: Widget TeamSpeak3

Mensagem por Kyo Panda em 15/03/17, 11:38 am

Utilize esse código em um widget personalizado:

Código:
<a href="ts3server://IP-do-seu-servidor/?port=porta-do-servidor" class="fa-custom-widget-teamspeak">
  <span class="fa-custom-widget-teamspeak-background"></span>
  <span class="fa-custom-widget-teamspeak-default">TEAMSPEAK 3</span>
  <span class="fa-custom-widget-teamspeak-hover">CONECTAR-SE</span>
</a>

<style>
  .fa-custom-widget-teamspeak {
    display: block;
    height: 200px;
    position: relative;
    border: 1px #fff solid;
    width: 100%;
    overflow: hidden;
  }

  .fa-custom-widget-teamspeak-background {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -1;
    background: url(http://i.imgur.com/lsWPxLt.png) no-repeat center center;
    background-size: 70% auto;
    transition: .5s ease filter;
  }

  .fa-custom-widget-teamspeak-default,
  .fa-custom-widget-teamspeak-hover {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    text-align: center;
    font-size: 14px;
    transform: translate(0%, -10%);
    display: block;
    line-height: 30px;
    margin-top: -15px;
    background-color: #333;
    color: #fff;
    opacity: 1;
    transition: .5s ease;
    transition-property: transform, opacity;
  }

  .fa-custom-widget-teamspeak-hover {
    background-color: #fff;
    color: #333;
    opacity: 0;
  }

  .fa-custom-widget-teamspeak:hover .fa-custom-widget-teamspeak-default,
  .fa-custom-widget-teamspeak:hover .fa-custom-widget-teamspeak-hover {
    transform: translate(0%, 10%);
  }
 
  .fa-custom-widget-teamspeak:hover .fa-custom-widget-teamspeak-default {
    opacity: 0;
  }

  .fa-custom-widget-teamspeak:hover .fa-custom-widget-teamspeak-hover{
    opacity: 1;
  }

  .fa-custom-widget-teamspeak:hover .fa-custom-widget-teamspeak-background {
    filter: blur(10px);
  }
</style>



Bem-vindo ao Fórum dos Fóruns!
Leia as Regras do Fórum dos Fóruns. Alguns setores possuem regras específicas.
Verifique se sua questão já não foi respondida.
Seja cordial e respeite o tempo dos voluntários para atender o seu pedido.
Kyo Panda — Moderadeiro
avatar

Kyo Panda
Moderadeiro
Moderadeiro

Masculino
Inscrito dia : 08/01/2012
Mensagens : 4490
Pontos Ativos : 5784

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

Resolvido Re: Widget TeamSpeak3

Mensagem por YouTube3 em 15/03/17, 02:21 pm

A Imagem não aparece fica assim: http://i.imgur.com/m3ifFBu.jpg
avatar

YouTube3
Membro do Fórum

Masculino
Inscrito dia : 04/01/2015
Mensagens : 1080
Pontos Ativos : 1543

Ver perfil do usuário http://Ajuda.Forumeiros.com
  • 0

Resolvido Re: Widget TeamSpeak3

Mensagem por Kyo Panda em 15/03/17, 02:24 pm

Nessa parte do CSS:

Código:
.fa-custom-widget-teamspeak-background {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -1;
    background: url(http://i.imgur.com/lsWPxLt.png) no-repeat center center;
    background-size: 70% auto;
    transition: .5s ease filter;
}

Remova o z-index: -1;.


Bem-vindo ao Fórum dos Fóruns!
Leia as Regras do Fórum dos Fóruns. Alguns setores possuem regras específicas.
Verifique se sua questão já não foi respondida.
Seja cordial e respeite o tempo dos voluntários para atender o seu pedido.
Kyo Panda — Moderadeiro
avatar

Kyo Panda
Moderadeiro
Moderadeiro

Masculino
Inscrito dia : 08/01/2012
Mensagens : 4490
Pontos Ativos : 5784

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

Resolvido Re: Widget TeamSpeak3

Mensagem por YouTube3 em 15/03/17, 02:42 pm

Fico perfeito só mais uma coisa, tem como deixar a barra do widget igual a está? 
http://i.imgur.com/nPl6RNP.jpg
Fórum, em que vi: http://familyjns.net/forum/
avatar

YouTube3
Membro do Fórum

Masculino
Inscrito dia : 04/01/2015
Mensagens : 1080
Pontos Ativos : 1543

Ver perfil do usuário http://Ajuda.Forumeiros.com

Resolvido Re: Widget TeamSpeak3

Mensagem por while em 15/03/17, 02:48 pm

Para isto peço que crie um novo tópico visto que foge um pouco do contexto, mesmo sendo questão de aparência do widget, mas uma é interno (código e estrutura) o outro já se trata do externo, ou seja, é questões diferentes.

Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada.

Tópico marcado como Resolvido e movido para "Questões resolvidas".
avatar

while
Hiperativo

Masculino
Inscrito dia : 24/04/2016
Mensagens : 3107
Pontos Ativos : 4515

Ver perfil do usuário http://www.ajuda.forumeiros.com https://www.facebook.com/profile.php?id=100012157981279

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