Mil Trucos Blogger

Iconos sociales con efecto opacidad (2015)

Deja tu Reacción sobre el artículo
Me Gusta Dichoso Feliz Admirado Triste Enojado

Hola amigos de Mil Trucos Blogger, en el día de hoy voy a compartir un set de iconos sociales con efecto opacidad (esto es que al poner el cursos sobre esto iconos se desvanecen levemente).

Iconos sociales con efecto opacidad (2015)

Los iconos son los siguientes:

Facebook
Google Plus
Twitter
Twitter

 

Para agregar este truco a tu blog debes ir (en el caso de Blogger) a Diseño, Añadir gadget, HTML/JavaScript, en el caso de WordPress debes ir a Apariencia, Widgets, Texto y añadir el siguiente código:

<div id='social'>
<a href='URL FACEBOOK' target="_blank"><img alt='Facebook' src='http://3.bp.blogspot.com/-HRQm_NMU9r0/VghxmfVhExI/AAAAAAAAGMk/Ar4b5StYeB4/s1600/flat_facebook.png' title='Facebook'/></a>
<a href='URL GOOGLE+' target="_blank"><img alt='Google Plus' src='http://3.bp.blogspot.com/-0Uaxeb7MKSU/VghxtVcoioI/AAAAAAAAGM4/BkO6cjD3UEI/s1600/flat_google.png' title='Google Plus'/></a>
<a href='URL TWITTER' target="_blank"><img alt='Twitter' src='http://2.bp.blogspot.com/-_WzUtScrvzE/VghxtatkoII/AAAAAAAAGMs/-YScVw6rNQk/s1600/flat_twitter.png' title='Twitter'/></a>
<a href='URL Pinterest' target="_blank"><img alt='Twitter' src='http://2.bp.blogspot.com/-fbNB0fy2ryc/VghxteYg98I/AAAAAAAAGMw/-S5iucUF52s/s1600/flat_pinterest.png' title='Pinterest'/></a>
</div>
<style type='text/css'>
#social img:hover {
opacity: 0.6;
}
</style>

Ahora solo reemplaza lo resaltado en color verde por lo que se indica en cada caso y guarda los cambios.

No olvides compartir este truco en tus redes sociales y volver a visitarnos.

0
Shares
Deja tu Reacción sobre el artículo
Me Gusta Dichoso Feliz Admirado Triste Enojado

2 Comentarios

  1. Septiembre 27, 2015    

    mmm son un poco simples estaria mejor algo de animacion con translate y que en ves de ir a las redes sociales que compartiera automaticamente la url en la respactiva red social del icono

    • Juvinao Juvinao
      Septiembre 28, 2015    

      Estimado estos iconos los hice un poco a la carrera por la falta de tiempo pero seguro para la próxima vez diseñaré un mejor pack de iconos.

      Saludos cordiales 😉

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Categorías

Síguenos en Facebook

Suscribete por Email

Introduce tu Correo:

Recibiras nuestros últimos posts en tu correo