dicas blog
Home » , , » Como colocar gadget de parceiros efeito terremoto

Como colocar gadget de parceiros efeito terremoto

9
Esse  efeito  é  bem  divertido  e  acontece com  um  conjunto  de  códigos  HTML. dando as  imagens  dos  parceiros  no  blog   ou  blogger  um efeito  bem  divertido  e   atraente,   como  se  estivesse  tremendo  tudo. você  pode  colocar  onde   desejar   esse   gadget  com   as  imagens   que  preferir como  propaganda   ou  amigos  blogs   que  gosta   e  visita.  tudo  que  você   precisa   é de  um gadget  java   scripit  e colocar  tudo  La  dentro o  efeito  acontece   ao  passar  o  mouse  por  cima   das
  imagens,   você  também  vai  precisar   de  um  editor  de  imagens  para criar   as  suas  de  a  seu  gosto.  existem  vários  tipos  de  editores  de  imagens  como  o photochop cs5 ou cs6  e  o photoscape etc. você  também  pode optar por utilizar  esse   código  com botões  de   rede social,  e   dar  uma visual  bem  diferente   a  sua pagina   fica   a  seu  gosto  siga o  tutorial  abaixo  e   vamos  lá.
Demo



tutorial

O código      vai  com  imagens  para  você  logo visualizar o efeito, veja  os  locais certos no exemplo  abaixo para colocar  imagens e links  destino.

<div class="parceiros"> <a title="seu testo" href="URL DESTINO" target="_blank" rel="nofollow"><img src="https://lh6.googleusercontent.com/-otoStxo96IE/UTCqw5uexhI/AAAAAAAAB7k/OczVX-h2REE/h84/blog+imagem+md.PNG" alt="parceiro 1" class="shake" /></a><a title="seu testo" href="URL DESTINO" target="_blank" rel="nofollow">
<img src="https://lh5.googleusercontent.com/-coT5x-mJsN8/UTCqMduPECI/AAAAAAAAB7Y/9PsZxnH2zJw/h120/blog-imagem.PNG" width="137" height="112" alt="parceiro  2" class="shake" /></a><a title="seu testo" href="URL DESTINO" target="_blank" rel="nofollow"><img src="https://lh5.googleusercontent.com/-coT5x-mJsN8/UTCqMduPECI/AAAAAAAAB7Y/9PsZxnH2zJw/h120/blog-imagem.PNG" alt="parceiro 3" class="shake" /></a><a title="seu testo" href="URL DESTINO" target="_blank" rel="nofollow"><img src="https://lh5.googleusercontent.com/-coT5x-mJsN8/UTCqMduPECI/AAAAAAAAB7Y/9PsZxnH2zJw/h120/blog-imagem.PNG" alt="parceiro 4" class="shake" /></a><a title="seu testo" href="URL DESTINO" target="_blank" rel="nofollow"><img src="https://lh5.googleusercontent.com/-coT5x-mJsN8/UTCqMduPECI/AAAAAAAAB7Y/9PsZxnH2zJw/h120/blog-imagem.PNG" alt="parceiro 5" class="shake" /><a title="seu testo" href="URL DESTINO" target="_blank" rel="nofollow"><img src="https://lh6.googleusercontent.com/-otoStxo96IE/UTCqw5uexhI/AAAAAAAAB7k/OczVX-h2REE/h84/blog+imagem+md.PNG" alt="parceiro 6" class="shake" /></a>
</a></div>
<!--/*final do  código*/-->
Copie  o  código  abaixo  e  cole   dentro  de  um   gadget javascript.


De  um CTRL+F e procure pelos locais  mostrados  no código acima e  adicione  seus  links
E  imagens dos  parceiros.

Cor  azul vai os links destinos
Cor  vermelha vai suas  imagens convertidas código
Cor  verde  vai  o texto  ao  passar  o  mouse  por cima 
Cor rosa  indica  cada parceiro  como primeira  segunda  etc.

9 comentários:

  1. Cara tem como voce postar um tutorial igual os parceiros aqui do seu blog, 50x50 com um espaco e ficando colorido, se tiver como obrigado.

    ResponderExcluir
    Respostas
    1. Tem sim Abraão vou fazer esse tutorial e postar nos próximos dias .
      Não entendi a parte que você fala para ficar colorido se é a borda, ou a troca da cores das imagens do preto e branco para o colorido?

      Excluir
    2. A parte que falo colorido igual do seu blog aqui, que fica amarelo, mais no meu caso azul.

      Excluir
    3. Entendi mano vou fazer esse tutorial para você hoje.

      Excluir
  2. Respostas
    1. O código esta funcionando, não sei o que pode ter dado errado!

      Excluir
  3. em seu blog teste sim, mas este script que vc tem ai para copiar e aplicar em determinado blog não funciona

    ResponderExcluir
    Respostas
    1. Entendi, vou colocar em outro blog e te envio o URL para copiar, volte no domingo!

      Excluir