[TUTORIAL] Tooltip no fórum

[nikka]

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

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

(carregue na imagem para aumentar)

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>

2º - 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"

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;

Investimento - Escolha a opção "Em todas as páginas";

Código JavaScript - Neste campo teremos de inserir o código que trabalhamos no item anterior;

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.

|

|

Caso tenha dúvidas, consulte um de nossos tópicos resolvidos: https://ajuda.forumeiros.com/t97059-

---

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

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