10/02/2013

Tutorial: Efeito na entrada do blog

||
http://4.bp.blogspot.com/-rjnhK0cKUus/URcYsoRtkcI/AAAAAAAAjDs/zivpLm7PH3M/s1600/289.png

Bom são ja são 1:17 da madrugada, e venho fazer a ultima postagem do dia, já que para mim o outro dia só conta quando eu durmo, meia noite só e valido como outro dia quando é ano novo, natal e meu aniversário rsrs Mas trago outro efeito de entrada no blog, eu achei ele no blog KW créditos, ele e bem bacana apesar de preferir mais o de efeito fade, o efeito dele é bem simples todo blog entrara de lado, o.o não entendeu néh? Então clique aqui para ver. O código é super pequeno é fácil de aplicar,  tem duas formas de colocar. Você opinar por no blog todo ou em apenas alguns gadgets que irei mostrar mais abaixo. Se esta curioso para aprender continue lendo.

1. Vá até o seu editar HTML e então procure por <head>. Abaixo dele, cole:

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

  Aplicar no blog inteiro

2. Depois do primeiro código adicionado, procure por <body expr:class='&quot;loading&quot; + data:blog.mobileClass'> e abaixo dele, coloque:

<div class='efeitofofo'>

3. Por ultimo procure por </body> e acima, cole:
</div>

Aplicar apenas um gadget ou uma imagem, ou outros...

Só faça a primeira etapa e então salve. Vá ate seu layout, é abra um gadget de HTML/JavaScript, e dentro dele cole:

 <div class='efeitofofo'> cole sua imagem, menu ou qualquer coisa normalmente aqui </div>

22 comentários:

  1. Gostei do efeito!Lindo!
    lembrando-carol.blogspot.com.br
    Amei o layout tá?Beijoca

    ResponderExcluir
    Respostas
    1. Fico super contente que tenha gostado *-*

      Excluir
  2. hahahahaha` aprendii esse tuto no KW muito legal xD
    BJS.<3
    http://kawaiidown.blogspot.com.br/

    ResponderExcluir
  3. Acho esse efeito tão cute , cute :3
    Vou usar no lay que irei fazer
    hoje !

    Abraços *--*

    >> Passe lá :

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

    ResponderExcluir
  4. Ah! Já vi, já vi! É super cute, o blog vem deslizando pro lado,hehehe...vou salvar o link do tuto ^_^ arigatou pelo post. Kissus...

    ResponderExcluir
    Respostas
    1. Verdade é super lindo ^^
      Nao foi nada

      Excluir
  5. Anônimo17/2/13

    Linda, arrasou como sempre!
    Há uma frase errada em seu texto ("apesar de MIM preferir"). Só falta consertar esse detalhe para seu tutorial ficar perfeito.

    XoXo

    ResponderExcluir
    Respostas
    1. Yo, fico contente que tenha gostado irei corrigir isso ^^

      Excluir
  6. aii amei viu obrigadaaa http://cupcakescoloridoscc.blogspot.com.br/

    ResponderExcluir
  7. Oque diabos o len faz voando até o cabeçalho?! Owwwwwwn fofinho, gostei! Len <3
    Adorei o efeito, super lindo!! Arigatou *-*

    worldisanime.blogspot.com

    ResponderExcluir
    Respostas
    1. Haha é de outro tutorial ai coloquei ele lá pra ficar mais engraçadinho.
      Obrigada ^^

      Excluir
  8. Amei procurei muito esse tuto aí eu aqui e amei amo seu blog é muito divo *-*
    http://mysweeet-world.blogspot.com.br/

    ResponderExcluir
    Respostas
    1. Hihi que bom que controu!!!! Obrigada por gostar do meu blog.

      Excluir
  9. Flor, o código ( body expr:class='"loading" + data:blog.mobileClass' ) não consigo encontra . O que pode ser? Beijos e obrigada

    ResponderExcluir
    Respostas
    1. Qual é se modelo? Verificou se não deixou espaço na barra de pesquisa antes de colocar o código para pesquisar? ^^

      Excluir
  10. Muito obg por seus tutoriais estou aprendendo muito e claro sempre vou comentar bjooss e obg!!! :3

    ResponderExcluir
    Respostas
    1. =3 Fico feliz em ajudar! Obrigada por comentar.

      Excluir

Hi guys!!!!
Hey aqui é Wendy, blogueira desde 2010! Viciada em animes, amante de livros e adora ver séries! Criei esse cantinho na intenção de ajudar na criação e personalização de blogs e sites.
Wattpad Facebook Tumblr Instagram