7.24.2013

Efeito Bolota nas imagens + Efeito nas imagens do post!


Olá meus blogueiros, tudo bom?. Eu queria dizer antes de mais nada agradecer a todos que maram a minha foto fazendo um Sleeveface do álbum DEMI da senhorita Demi Lovato, até porque eu me esforcei muito para tirar aquela foto e receber os meus devidos valores foi tão gratificante! Mas vamos mudar de assunto, né porque aqui está muito frio e como eu sou o odiador do frio n°1 fico com uma preguiça enorme de postar no frio vocês deveria dizer graças a Deus por eu postar (ou não, você que sabe) as minhas aulas também voltaram hoje o que não me ajuda muito querer postar porque mal voltei e vem a professora de história querendo matéria nova. Mas mudando de assunto eu hoje trago 2 tutoriais simples e rápidos para seu blog o primeiro é um efeito que eu fiz e achi o resultado legal (clichê) o segundo é esse atual efeito nas imagens do blog que me pediram, vamos ver?


| 1° efeito Visualização Online |

Não é bonitinho mesmo? e muito tonto porque é básico de mais, espero que gostem e se tenham gostado aprendam a fazer aqui abaixo:
Vá no seu painel do blogger e clique em: modelo, logo abaixo de seu layout de teste ou do blog atual terá o botão Editar HTML clique nele, abriu uma nova interface clicando sobre ela aperte os botões Ctrl + f juntos e abrirá uma janelinha e nela cole essa tag: '']]></b:skin>'' e assim que achar ela cole este código abaixo dela:
.bolota{

-webkit-border-radius: 50px;
-moz-border-radius: 50px;
border-radius: 50px;
margin:1px;
padding:1px;
border: 2px solid #45c5d6;
transition:All 0.2813s ease;
-webkit-transition:All 0.2813s ease;
-moz-transition:All 0.2813s ease;
-o-transition:All 0.2813s ease;
}
.bolota:hover{
transform: translate(0px, -15px);
-webkit-transform: translate(0px, -15px);
-moz-transform: translate(0px, -15px);
-o-transform: translate(0px, -15px);
-ms-transform: translate(0px, -15px);
-moz-box-shadow: 0px 5px 12px #4d4d4d;
-webkit-box-shadow: 0px 5px 12px #4d4d4d;
box-shadow: 0px 5px 12px #4d4d4d;
}
Entenda o código: O que está em negrito é a cor da borda e o que está em itálico é acor da sombra mude elas com a ajuda dessa tabela online [www]. 
Depois de ter feito isso você vai em Layout: Adicionar GadGet e procure pelo HTML/Javascript e cole este código abaixo ele:
<a href="LINK"><img class="bolota" height="90px" src="LINK DA IMAGEM" width="90px" /></a>
 Bata mudar essas coisas que estão em negrito que é o tamanho que você desejar! Agora para aprender a fazer o efeito da imagem do blog basta adicionar esse código [www] acima de '']]></b:skin>'' e pronto!

E ai gente gostaram? dos tutoriais? Eu trouxe esses dois porque eu geralmente não curto muito postar no frio e como eu tinha esses dois tutoriais aqui e um pedido pensei assim ''porque não?'' e ai foi! Nossa eu sou sempre chato assim ou é de vez em quando (sempre), o novo layout ta quase pronto e mais uma coisa, durmam com a porta aberta do gurda roupa!

26 comentários:

  1. Curti esse efeito, mas com o Layout que estou acho que efeitos na imagem do post não é muito legal (:
    Beijos < 3
    ~~ candyteen-official.blogspot.com

    ResponderExcluir
  2. Lindo o primeiro efeito.... "GURDA ROUPA?" kkkkk culpa do frio né? kkk
    onandoffoficial.blogspot.com

    ResponderExcluir
  3. O efeito é muito bom. O tutorial também ficou ótimo.
    cronicasdeumlunatico.blogspot.com.br

    ResponderExcluir
  4. Lindo o efeito* adorei o tuto
    http://fabiolucas92.blogspot.com.br/

    ResponderExcluir
  5. Muito bom, Matheus! Acho que vou usar isso no meu próximo Layout! o/
    Abraço!

    Peall
    www.bigbrigadeiro.blogspot.com.br

    ResponderExcluir
  6. Sim tá frio abeça mas adoro ♥ gostei principalmente do 1°efeito .
    amor-de-meninaa.blogspot.com.br

    ResponderExcluir
  7. Realmente está muito frio (;
    Gostei do tutorial ><

    ~ Beijos
    http://cantinhodaslovelys.blogspot.com.br/

    ResponderExcluir
  8. Adorei o tutorial, bem legal!
    Imagina voltar as aulas com esse frio =P
    Beijos, Emy!
    emelynramona.blogspot.com

    ResponderExcluir
  9. Aaaaa fica bem legal as fotos!!! Tutu mt útil parabéns (: !!!


    http://simplesmenteassimj.blogspot.com.br/

    ResponderExcluir
  10. Gostei dos efeitos, deu até vontade de fazer o primeiro.
    Ahhhh super ansiosa para ver o novo lay ><
    Beijos.

    Dearitgirl.blogspot.com.br

    ResponderExcluir
  11. Gostei do efeito bolotas, e sim! Sdds dos nomes descentes! hehe :D

    Beijos =]
    amoraazeda.blogspot.com

    ResponderExcluir
  12. Muito legal o tutorial, a sério que vai mudar o layout?. Devo confessar e acho que já disse isso, o quanto acho esse bonito. Espero que o novo seja o tão bom quanto o do momento. Feliz dia do escritor. http://realidadecaotica.blogspot.com.br/

    ResponderExcluir
  13. Amei os dois efeitos, vou usar no novo lay do GA *----*


    Kiss~
    http://garotasatrevidas-s2.blogspot.com.br/

    ResponderExcluir
  14. Amei, muito bom!
    Gatinha estou atualizando o meu canal com vídeos semanais, visite e se gostar se inscreva, é muito importante pra mim! Beijinhos.
    Canal: https://www.youtube.com/user/isabelyrogrigues
    Blog: http://fasesdegarota.blogspot.com.br/

    ResponderExcluir
  15. Adorei as dicas!
    Já uso no meu blog até haha.
    Beijos,
    www.theattitudeincluded.blogspot.com.br

    ResponderExcluir
  16. haha saudades nome decente kkkk
    gostei do tutorial, sempre quis saber como fazer isso ;o

    Adolecentro

    ResponderExcluir
  17. Mas gente, eu sou adoradora do frio kkkkk. E os efeitos são simples e bonitos, eu gostei e deixei salvo aqui o redondinho hahaha. É bem útil! Beijos! ^^

    Rediscovering Dreams

    ResponderExcluir
  18. a eu mei esse efeito, vou fazer eles espero que eu consiga !

    Beijinho >> palacefame.blogspot.com.br

    ResponderExcluir
  19. Muito legal, funciona com gif? KKK
    http://zombieesvg.blogspot.com.br/**

    ResponderExcluir
  20. Nossa que lindo, não conhecia
    xoxo
    lamourmonage.blogspot.com

    ResponderExcluir
  21. Não conhecia o primeiro efeito,adorei.
    Realmente está muuito frio,principalmente no RS.

    Beijos
    Amora R.

    ResponderExcluir
  22. Adoreiii o primeiro efeito =)
    Super legal!!!
    Beeeijos
    http://makecharme.blogspot.com/
    ♥♥♥

    ResponderExcluir
  23. Ensina como coloca esse,do afiliados do blog,por favor

    ResponderExcluir
  24. Amei o efeito, muito lindo (:
    Hey você ode ensinar como colocar esse efeito que você usa nas suas imagens ?
    Beijos Magia Teen (Reformas) | Always Dream

    ResponderExcluir

É o seguinte...
x Comente se você REALMENTE leu o post;
x NUNCA PEÇA para eu seguir deu blog de volta eu sempre visito, e seu eu gostar com certeza irei seguir;
x As tags são respondidas em um ''post'' privado geralmente anexadas em um servidor;
x Repeito os outros e eu, se quiser criticar critique!
Até e obrigado pela visita XOXO :)