Tutorial: Efeito Pisca Nos Afiliados


Olá ~

Como vocês estão? Bom, eu ainda não recebi nenhuma mensagem de pessoas querendo ser postadores aqui do blog, mas ainda preciso de postadoras. Sabe, é muito difícil conduzir um blog sozinha, ainda mais que eu tenho outro blog, que aliás, vai completar 4 meses e, na quinta-feira, eu vou deixar lá um lay free, mas pode deixar que na quinta feira mesmo, eu aviso aqui para vocês e mando o link, para que todos possam pegar.

Agora vamos ao post. Foi pedido na ask, um tutorial de como colocar esse efeito nas imagens de afiliados aqui do blog. Eu achei esse tutorial no Kawaii World (créditos). Vou postar ele para vocês agora, ok?

Lets See?


1.Vá até modelo > Editar Html e procure por <head>

Quando achar, cole, abaixo, esse código:

<link href='http://static.tumblr.com/dlelfro/QJ2mh90b7/pisca2.css' media='screen' rel='stylesheet'/>

2.Ainda em editar Html, procure por ]]></b:skin>

Quando achar, cole, acima, esse código:

.efeitopisca1{padding:2px;border:1px solid #dcdbdb;}.efeitopisca1:hover{-webkit-animation-name: pisca;    -moz-animation-name: pisca;    -o-animation-name: pisca;    animation-name: pisca;-webkit-animation-duration: 1s; }


Para alterar a cor da bordinha, é só mudar o que está em negrito, para isso, use os códigos/cores dessa tabela.

3.Agora, vá em Layout > Adicionar Gadget > Html/JavaScript e cole esse código:

<a href="LINK DO BLOG" title="NOME DO BLOG"><img src="LINK DA IMAGEM" class="efeitopisca1" /></a>


Repita o código conforme queira adicionar mais imagens.

Salve.


E aí, gostaram do tuto?

9 comentários:

  1. Anw , esse efeito é bem legal :3
    Adorei o tuto!

    Kisses #

    >>> Visita : http://pensamento-jhenny.blogspot.com.br/

    ResponderExcluir
    Respostas
    1. Agradeça à Kaorii, a diva do Hmtl, haushaus

      Bejos :*

      Excluir
    2. ameiiii o efeito o/
      j conheciaa, mais ele realmente é lindoo!
      acervo-de-livros.blogspot.com

      Excluir
    3. É verdade, ele é muito lindo.

      Beijos :)

      Excluir
  2. Amei o efeito, ainda não conhecia mais é realmente lindo !
    batomdequeijo.blogspot.com.br

    ResponderExcluir
  3. Ameei o efeito! É muito lindo!
    http://meubatomdecereja.blogspot.com.br/

    ResponderExcluir
  4. Muiiito obg me ajudou bastante já estou usando lá no blog♥
    Beijos!

    ResponderExcluir
  5. Deu certinho no layout que fiz, ótimo tutorial só deveria ter um preview né amore :) bjoon
    Blog lindo, layout perfeito
    Adolescente Nerd // Oficial

    ResponderExcluir

Fique à vontade para comentar.
Peço apenas que não xinguem ou ofendam aos outros leitores.
Obrigada.