13 junho 2012

Afiliados personalizado

Bom dia amores, eu vou postar o tutorial dos afiliados bem legal, quem quiser fazer só seguir direitinho. Mais antes quero falar uma coisa, está tendo festa aqui na minha cidade, minha irmã foi, só eu fiquei em casa sozinha, mas tudo bem eu adoro ficar só em casa, primeiro porque eu me concentro no que eu estou fazendo e segundo porque eu coloco as minhas musicas loucas que eu adoro. enfim me chamaram pra eu ir também mais recusei o convite, estou dando um tempo sobre sair pra festas sakas? porque cidade pequena sabe como é né! o povo não cuidam da sua vida e sim da dos outros, e mais uma coisa o próximo post vai ser sobre plágio, eu acho, eu tenho tanta coisa pra falar, sobre essa pura safadeza! então é isso, fiquem com o tutorial agora, cliquem em Leia mais para ver.

Primeiro vá em Designer >> Editar HTML >> aperte  F3 no teclado e procure por:
]]></b:skin>
e depois acima dela coloque esse código aqui:

.afiliados {
opacity: 0.7;
-webkit-transition: 0.5s;
border-radius:10px;
width: 60px;
height: 60px;
text-align: center;
}
.afiliados:hover {
opacity: 1.0;
border-radius:15px;
}.mycs {
opacity: 0.6 ;
-webkit-transition: 0.5s;
border-radius:0px;
width: 290px;
height: 100px;
text-align: center;
}
.mycs:hover {
opacity: 1.0;
border-radius:10px;
}

* Em vermelho é o tamanho da imagem que irá ficar nos afiliados. modifique o tamanho que você quer!
depois salve e vá em designer >> Elementos da página e adicione um Gadget e coloque esse código:
<a href="http://URL.com" title="Título da imagem"><img src="LINK_DA_IMAGEM" class="afiliados"/></a>
Adicione o código de acordo com o tanto de afiliados que você tiver.

Aqui é outro modelo.

Vá em ]]></b:skin> e antes dela acrescente esse código aqui:

.afiliados {
opacity: 0.7;
box-shadow: 2px 1px 3px #909090;
border-radius: 50px;
-moz-border-radius: 50px;
-webkit-border-radius: 50px;
transition-duration: 3s;
-moz-transition-duration: 3s;
-webkit-transition-duration: 3s;
width: 60px;
height: 60px;
}
.afiliados:hover {
opacity: 1.0;
transform: rotate(-360deg) scale(1) skew(0deg);
-moz-transform: rotate(-360deg) scale(1) skew(0deg);
-webkit-transform: rotate(-360deg) scale(1) skew(0deg);
-o-transform: rotate(-360deg) scale(1) skew(0deg);
border-radius: 50px;
-moz-border-radius: 50px;
-webkit-border-radius: 50px;
transition-duration: 3s;
-moz-transition-duration: 3s;
-webkit-transition-duration: 3s;
width: 60px;
height: 60px;
}
* Em vermelho é o tamanho da imagem que irá ficar nos afiliados. modifique o tamanho que você quer!
depois salve e vá em designer >> Elementos da página e adicione um Gadget e coloque esse código:
<center><a href="Link afiliado 1" title=" Nome afiliado 1 "><img src=" Imagem afiliado 1 " class="afiliados"/></a> </center>
Pronto, repita a quantidade de códigos para o número de afiliados que você tiver. Agora vou dormir, até daqui a dois dias, estou morrendo de sono, mais também eu quase não largo o computador quando não é aqui é no facebook. ;/  Mil Besos
créditos: Sweet Bomb
Comentários
17 Comentários

17 comentários:

  1. fica tão lindo assim né
    http://garotoonerd.blogspot.com.br

    ResponderExcluir
  2. oi Duda

    legal o tuto

    quando tiver afiliados no meu blog vou fazer

    bjs

    estilorosa.blogspot.com

    ResponderExcluir
  3. Adoro esse tuto, é muito útil, além de deixar o blog mais organizado.
    Amei seu blog e já estou seguindo, sempre que der passo por aqui.
    xoxo - http://atras-dos-sonhos.blogspot.com.br/

    ResponderExcluir
  4. Amei,eu tinha feito um é bem fácil,você explicou bem legal,e fácil para todos!Beijos gata.

    www.girlycute.blogspot.com.br

    ResponderExcluir
  5. bem legal e simples, lindo o seu blog.

    http://utilidadedeleocatia.blogspot.com.br/

    xero

    ResponderExcluir
  6. Dei um post no meu blog sobre plágio, se quiser dar sua opinião rs. Então flor, queria dizer que eu não botei lá nas regras dos afiliados, que tem que participar do blog, comentar e tal, por que afiliado é para isso não é? Bem, o post ficou ótimo mas só n entendi oq é aquele treco de "mycs" rsrs, bem thalzinho :)

    Bjs!
    www.tutoriar.com

    ResponderExcluir
  7. -Hooy adorei o blog, te comvido para seguir o meu blog, caso gostar, sigo de volta, só falar C>
    #Wallyson!
    >>> http://fatosdaminhavidinha.blogspot.com

    ResponderExcluir
  8. Amei a tutorial, vou colocar um efeito nos meus afiliados :)
    beijos
    http://lolamantovani.blogspot.com.br/

    ResponderExcluir
  9. amei, vou colocar um efeito nos meus afiliados :)
    beijos
    http://lolamantovani.blogspot.com.br/

    ResponderExcluir
  10. Super útil o tutorial adorei rs. Flor vim agradecer pela visita no blog e por ter desabafado por lá, sempre que quiser dar uma passadinha será muito bem vinda lá no blog ♥ http://evelynsousa.blogspot.com.br/

    ResponderExcluir
  11. adorei o tutorial (:
    beijinhos.

    looking-the-stars.blogspot.com

    ResponderExcluir
  12. Olá Duda! Vim retribuir a sua doce visita =) conhecer esse lugar lindo tbem *-*, o seu blog é lindo, não tem como não segui esse lugar meigo! Beeijos e ahh adorei o post debaixo, peguei ate alguns imagens para colocar na minha pasta de looks ;)

    ResponderExcluir
  13. Adorei o tutorial! Aliás adorei os outros posts mais atuais que pude dar uma olhadinha tbm! Parabéns!!
    Bjuu, Ju! XD

    http://depoisquesecresce.blogspot.com.br/

    ResponderExcluir
  14. Estava na net procurando frases para posta no meu blog e me deparei com essa e me lembrei do seu comentário....
    -->"Na vida,quando uma porta se fecha para nós, há sempre outra que nos abre. Em geral, porém, olhamos com tanto pesar e ressentimento para a porta fechada, que não apercebemos da outra que se abriu."
    Flor abre seu coração, as vezes a felicidade esta ao nosso lado e não nos damos conta disso.

    Tenha uma ótima e iluminada quinta bjos!

    http://rarosej.blogspot.com.br

    ResponderExcluir
  15. Adorei o tutorial,eu já o conhecia,mas é sempre bom relembrar.
    http://i-teenbr.net.tc

    ResponderExcluir
  16. Amei seu tutorial! *u*
    http://blogsuchan.blogspot.com.br/

    ResponderExcluir

- Fique a vontade para comentar, mas seja sempre educado(a)
- Seu comentário precisa ser relacionado com o assunto do post, caso não seja use a Cbox AQUI :)
- Não falar palavrões e não ficar criticando.
- Se for dar sugestões que seja para a melhoria do blog.
- Quer Parceria? então siga meu blog e coloque meu banner e me avise.
- Deixe a URL do seu blog para que eu possa retribuir.
- Não precisa pedir pra seguir que eu vou.
- ah e Não participo de concursos,e tags NÃO INSISTA!