Agregar botones de redes sociales en el blog

Entra a Plantilla > Edición de html >y antes de ]]></b:skin> agrega lo siguiente:

/* Botones de Redes Sociales
----------------------------------------------- */
.BotonesSociales li {
border:1px solid #6E6E6E !important; /* Color del borde */
padding:5px !important;
margin:0 5px 6px 5px;
background:#ccc; /* Color de fondo */
list-style:none;
}
.BotonesSociales li a {
font-weight:bold; /* Texto en negrita */
text-decoration:none;
color:#1C1C1C !important; /* Color del texto */
}
.BotonesSociales li a:hover {
color:#2E9AFE !important; /* Color del texto al pasar el cursor */
position:relative;
top:1px;
left:1px;
}
.BotonesSociales span {
padding-left:10px;
}
.BotonesSociales img {
vertical-align:middle;
border:0;
}

Ahora entra en Diseño | Elementos de la página | Añadir un gadget | HTML/Javascript, y pega lo siguiente:

<ul class="BotonesSociales">
<li><a href="https://plus.google.com/u/0/usuario"><img src="https://lh4.googleusercontent.com/-Jgd9rk6kRYM/TkC3KlKR6YI/AAAAAAAABl0/26vANOtT7LI/google_plus.png" /> <span>Agrégame en tus círculos</span></a></li>
<li><a href="http://www.facebook.com/usuario"><img src="https://lh3.googleusercontent.com/-cEItxWOllgk/TkC3K99nKrI/AAAAAAAABl8/vS3V49UFD2o/facebook.png" /> <span>Hazte fan en Facebook</span></a></li>
<li><a href="http://twitter.com/usuario"><img src="https://lh3.googleusercontent.com/-jchNp-BEnME/TkC3Kxs3yuI/AAAAAAAABl4/c2Z8_KkFWTs/twitter.png" /> <span>Sígueme en Twitter</span></a></li>

</ul>

 Ahora solo les queda reemplazar lo que está en rosa y listo.

  

0 comentarios:

Publicar un comentario