Pon tus Redes Sociales en tu Blog

Hola! Feliz Jueves  Les traigo este fácil tutorial. Este consiste en poner los iconos de tus redes sociales en tu blog. Es bastante sencillo, solo deben seguir los pasos al pie de la letra y poner atención en lo que deben hacer.  Espero les guste este tutorial y les sirva para enchular tu blog ;) Si les queda alguna duda me pueden dejar un comentario y les ayudaré Besos 

El tutorial es para poner los iconos así:

Este código deja los iconos fijos, pero al subir o bajar en tu blog se mueven.

1. En tu blog das click en Diseño

o

Te debe aparecer una pantalla como esta:

2. Das click en Añadir un Gadget

Te aparece un recuadro como este:

3. Buscas donde dice HTML/Javascript y das click en el +

Te aparece un recuadro así: 

4. En titulo lo dejan en blanco, agregan el código y dan guardar.

Este es el CÓDIGO:

<style type='text/css'>
a.linkopacity img {
filter:alpha(opacity=50);
-moz-opacity: 0.5;
opacity: 0.5;
-khtml-opacity: 0.5;}
a.linkopacity:hover img {
filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
-khtml-opacity: 1.0; }
</style>
<div style='display:scroll; position:fixed; top:140px; left:-12px;'>
<a class='linkopacity' href='LINK RED SOCIAL' imageanchor='1' rel='nofollow'
style='margin-left: 1em; margin-right: 1em;' target='_blank' title='NOMBRE RED SOCIAL'><img
border="0" src="LINK DEL ICONO/IMAGEN" /></a><br />
</div>

Deben reemplazar donde dice LINK RED SOCIAL por el link directo a tu red social, en NOMBRE RED SOCIAL ponen si es Twitter, Facebook, etc... y en LINK DEL ICONO/IMAGEN ponen el link del icono que quieren ahí. 

Si quieren agregar varias redes sociales solo deben agregar otra vez 

<a class='linkopacity' href='LINK RED SOCIAL' imageanchor='1' rel='nofollow'
style='margin-left: 1em; margin-right: 1em;' target='_blank' title='NOMBRE RED SOCIAL'><img
border="0" src="LINK DEL ICONO/IMAGEN" /></a><br />

y al final del código deben terminar con </div>
EJEMPLO:

<style type='text/css'> a.linkopacity img { filter:alpha(opacity=50); -moz-opacity: 0.5; opacity: 0.5; -khtml-opacity: 0.5;} a.linkopacity:hover img { filter:alpha(opacity=100); -moz-opacity: 1.0; opacity: 1.0; -khtml-opacity: 1.0; } </style> <div style='display:scroll; position:fixed; top:140px; left:-12px;'> <a class='linkopacity' href='LinkTUTwitter' imageanchor='1' rel='nofollow'  style='margin-left: 1em; margin-right: 1em;' target='_blank' title='Twitter'><img  border="0" src="LinkImagenIconoTwitter" /></a><br /> <a class='linkopacity' href='LinkTUFacebook' imageanchor='1' rel='nofollow'  style='margin-left: 1em; margin-right: 1em;' target='_blank' title='Facebook'><img  border="0" src="LinkImagenIconoFacebook" /></a><br /> <a class='linkopacity' href='LinkTUTumblr' imageanchor='1' rel='nofollow'  style='margin-left: 1em; margin-right: 1em;' target='_blank' title='Tumblr'><img  border="0" src="LinkImagenIconoTumblr" /></a><br /></div>

Si desean más redes agregan el pedazo anterior y no deben olvidar el </div> al  final de todo el código y LISTO! Ya tienes tus iconos de redes sociales en tu blog.
Para iconos que puedes utilizar