Neste tutorial estarei ensinando a como colocar um sistema de Barra de Parceiros no final da página.

--> Tutoriais, dicas e astúcias <--
[TUTORIAL]Barra de Parceiros

[Tens de ter uma conta e sessão iniciada para poderes visualizar esta imagem]

Créditos :seta2: HugoP.,[F]lames e SH-Design

1º - Adicionando o Código CSS
Aceda em :

Painel de Controle :seta2: Visualização :seta2: Imagens e Cores :seta2: Cores :seta2: Folha de Estilo CSS

E copie e cole este código dentro de sua folha de estilo:

Código:


#secondary_navigation:hover {top: 83.4% !important;height: 148px !important;-webkit-transition: all .5s;}
#secondary_navigation .wrapper marquee * {cursor: pointer;margin-right: 6px;}


2º - Adicionando o Código JavaScript
Aceda em:

Painel de Controle :seta2: Módulos :seta2: JavaScript * HTML's :seta2: Gestão dos códigos javascripts

Título :seta2: Qualquer um
Investimento :seta2: Em todas as páginas
Código :seta2:

Código:


jQuery(document).ready(function() {
  var parc='<a href="http://shdesign.ativoforum.com/forum"><img src="http://i15.servimg.com/u/f15/17/71/75/73/115.png"></a>';
  jQuery('body').prepend('<div id="secondary_navigation" class="clearfix stickyTop" style="background: rgba(0, 0, 0, 0.8); position: fixed; width: 100%; top: 95.4%; left: 0; z-index: 9999999;font-size: 11px; text-shadow: rgba(0, 0, 0, 0.8) 0px 1px 1px; line-height: 37px; box-shadow: rgba(255, 255, 255, 0.05) 0px 1px 0px; border-bottom: 1px solid #0D0D0D; overflow: hidden; color: #4E565E; font: normal 11px "Trebuchet MS",tahoma,helvetica,arial,sans-serif; -webkit-transition: all .5s; height: 41px;"><div class="wrapper" style="margin: 0 auto; min-width: 980px; max-width: 1600px; width: 90%; padding: 11px; text-align: center; color: white; font-size: 14px;"><span style="">Parceiros</span><br><br><br><marquee direction="right" speed="5">'+parc+'</marquee></div></div>');
});


3º - Adicionando o banner
Para adicionar mais parceiros ou editar um banner, localize isto no código:

Código:


  var parc='<a href="http://shdesign.ativoforum.com/forum"><img src="http://i15.servimg.com/u/f15/17/71/75/73/115.png"></a>';


E antes da aspa simples seguida do ponto e vírgula ( '; ) adicione este formulário:

Código:


<a href="LINK_DO_FÓRUM_DO_BANNER"><img src="LINK_DO_BANNER"></a>


Exemplo:

Código:


  var parc='<a href="http://shdesign.ativoforum.com/forum"><img src="http://i15.servimg.com/u/f15/17/71/75/73/115.png"></a><a href="LINK_DO_FÓRUM_DO_BANNER"><img src="LINK_DO_BANNER"></a>';


Para visualização online, clique aqui.


4º - Resultado
[Tens de ter uma conta e sessão iniciada para poderes visualizar esta imagem]

---

© SH-Design & Best Skins

[Tens de ter uma conta e sessão iniciada para poderes visualizar esta imagem]

Se tiver alguma dúvida relacionada com este tópico crie um tópico com o seguinte título: [TUTORIAL]Barra de Parceiros