[TUTORIAL] Tooltip no fórum

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

[TUTORIAL] Tooltip no fórum Empty [TUTORIAL] Tooltip no fórum

Mensagem por nikka em 13.06.13 11:19


[TUTORIAL] Tooltip no fórum Gestio10
Tooltip

Com base neste tutorial poderemos adicionar um efeito tooltip em quase todo o fórum (imagens, botões, ícones, títulos, etc...).


--> Tutoriais, dicas e astúcias <--
Tooltip no fórum



- Acedendo a edição de templates:
Deveremos aceder a;
Painel de controle -> Visualização -> Templates  / Opção Geral

(carregue na imagem para aumentar)
[TUTORIAL] Tooltip no fórum Templa10

Encontre o template overall_header.tpl e em seguida, na caixa Buscar, localize o seguinte código:
Código:
</head>
E acima dele vamos colar este novo código:
Código:
<link rel="stylesheet" href="http://static.tumblr.com/yiol0h8/AXWn3atj3/tipsy.css" type="text/css" />
<script type="text/javascript" src="http://static.tumblr.com/yiol0h8/GOsn3atjv/jquery.tipsy.js"></script>

<script type='text/javascript'>
  $(function() {
    $('.tool-tip').tipsy({fade: true, gravity: 's'});
  });
</script>


- Aplicando o código Javascript:
Aceda à Painel de controle    Módulos    HTML e Javascript    Gestão dos códigos Javascript
Clique no botão "Criar um novo javascript"
[TUTORIAL] Tooltip no fórum 2u5q4212
[TUTORIAL] Tooltip no fórum 110111[TUTORIAL] Tooltip no fórum 398853 Título - Terá de colocar um título para a página, de forma a poder identifica-lo na lista de páginas JavaScript do Painel de Controle;
[TUTORIAL] Tooltip no fórum 110210[TUTORIAL] Tooltip no fórum 398853 Investimento - Escolha a opção "Em todas as páginas";
[TUTORIAL] Tooltip no fórum 110310[TUTORIAL] Tooltip no fórum 398853 Código JavaScript - Neste campo teremos de inserir o código que trabalhamos no item anterior;
[TUTORIAL] Tooltip no fórum 110410[TUTORIAL] Tooltip no fórum 398853 Confirmar - Por fim, após adicionar o código, terá de clicar neste botão para salvar a criação. Se você clicar em um outro botão ou em uma outra seção, as mudanças não serão validadas.
Em seguida, cole este código:
Código:
jQuery(document).ready(function(){
    jQuery('a, img, strong a, strong img').addClass('tool-tip');
    });
Feito isso salve.

[TUTORIAL] Tooltip no fórum D0wDyAJ|[TUTORIAL] Tooltip no fórum TlFDK0E|[TUTORIAL] Tooltip no fórum C0WT0wO
Caso tenha dúvidas, consulte um de nossos tópicos resolvidos: https://ajuda.forumeiros.com/t97059-




© Fórum dos Fóruns & King Gz;, Shek

[TUTORIAL] Tooltip no fórum Act_bottom Se tiver alguma dúvida relacionada com este tópico crie um tópico com o seguinte título:
Tooltip em quase todo o fórum
nikka

nikka
Membro profissional
Membro profissional

Feminino
Inscrito dia : 17/12/2008
Mensagens : 15621
Pontos Ativos : 19897

Ver perfil do usuário https://ajuda.forumeiros.com/ https://www.facebook.com/forumeirospt https://twitter.com/Forumeiros_PT

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