Como ponerle efecto al gadget de amigas

¡Hola! Como están? espero que se encuentren muy bien el día de hoy les traigo un tutorial de como ponerle efecto al gadget de amigas empezemos



Vista previa

  • Vamos a plantilla
  • Edicion HTML
  • Ctrl + F buscamos ]]></b:skin> 
y antes de ]]></b:skin> pegamos el siguiente codigo
@-webkit-keyframes mor { 0% {filter: alpha(opacity=25); opacity: 0.15; -moz-opacity:0.15; -webkit-transform: rotate(10deg)}100%  {border-radius:50px; -webkit-transform: rotate(-10deg)}}
.mor {border-radius: 2px; border:1px double #ffaeae; margin:1px;cursor:pointer;}
.mor:hover {-webkit-animation: mor .95s alternate infinite linear;border-radius:2px;-webkit-transition: -webkit-transform 1s ease-in-out; }

y luego vamos a diseño|añadir un gadget javascrip y pegamos el siguiente codigo

<a href="Url del blog de tu amiga" target="_blank"><img class="mor" height="70" src="Url de la imagen" width="70" /></a><a href="Url del blog de tu amiga" target="_blank"><img class="mor" height="70" src="Url de la imagen" width="70" /></a><a href="Url del blog de tu amiga" target="_blank"><img class="mor" height="70" src="Url de la imagen" width="70" /></a><a href="Url del blog de tu amiga" target="_blank"><img class="mor" height="70" src="Url de la imagen" width="70" /></a>
y listo si quieres agregar más amigas solo pega este codigo

<a href="Url del blog de tu amiga" target="_blank"><img class="borzom" height="70" src="Url de la imagen" width="70" /></a>

Espero que les haya gustado el tutorial y les fuera sido de utilidad



1 comentario :

domingo, 28 de junio de 2015

Como ponerle efecto al gadget de amigas

¡Hola! Como están? espero que se encuentren muy bien el día de hoy les traigo un tutorial de como ponerle efecto al gadget de amigas empezemos



Vista previa

  • Vamos a plantilla
  • Edicion HTML
  • Ctrl + F buscamos ]]></b:skin> 
y antes de ]]></b:skin> pegamos el siguiente codigo
@-webkit-keyframes mor { 0% {filter: alpha(opacity=25); opacity: 0.15; -moz-opacity:0.15; -webkit-transform: rotate(10deg)}100%  {border-radius:50px; -webkit-transform: rotate(-10deg)}}
.mor {border-radius: 2px; border:1px double #ffaeae; margin:1px;cursor:pointer;}
.mor:hover {-webkit-animation: mor .95s alternate infinite linear;border-radius:2px;-webkit-transition: -webkit-transform 1s ease-in-out; }

y luego vamos a diseño|añadir un gadget javascrip y pegamos el siguiente codigo

<a href="Url del blog de tu amiga" target="_blank"><img class="mor" height="70" src="Url de la imagen" width="70" /></a><a href="Url del blog de tu amiga" target="_blank"><img class="mor" height="70" src="Url de la imagen" width="70" /></a><a href="Url del blog de tu amiga" target="_blank"><img class="mor" height="70" src="Url de la imagen" width="70" /></a><a href="Url del blog de tu amiga" target="_blank"><img class="mor" height="70" src="Url de la imagen" width="70" /></a>
y listo si quieres agregar más amigas solo pega este codigo

<a href="Url del blog de tu amiga" target="_blank"><img class="borzom" height="70" src="Url de la imagen" width="70" /></a>

Espero que les haya gustado el tutorial y les fuera sido de utilidad



1 comentario:

Copyright © 2015 Fiorela Kawaii - Desing by Angel P.