Divisor

Éste sitio web usa cookies, puedes ver la política de cookies, Aquí. ⤵ ⤵


Gadget social lateral profesional para que te sigan



Gadget social profesional lateral para que te sigan



En está pesquisa navegando por la red, me he topado con una widget social excepcional, que sé que os va a gustar, tanto cómo a mi, seguro que os gusta, no me cabe duda. Trata de un gadget social flotante, que se posiciona en la parte izquierda de tu blog en la plataforma Blogger, o también en la parte derecha, cómo lo prefieras, sólo debes de cambiar todos los "LEFT" del código CSS, por "RIGHT". Éste fantástico widget, lo he visualizado en el Blog: Digital Blog Inc, y me a parecido interesante compartirlo con todos ustedes. Se desliza mediante vayas bajando el scroll o barra de deslizamiento y sirve para que te sigan en tus redes sociales, básicamente, la barra social lateral, lleva consigo, las redes siguientes que verás escritas a continuación: Twitter, Google+, Facebook, y Feedburner. Ahora la demo:











Para añadir ésta barra social en Blogger, sigues estos pasos!




  1. Ir a Blogger
  2. Después a Diseño.
  3. Añadir un Gadget.
  4. Y ahora ir a HTML & Javascript.
  5. Y por último copiar y pegar el siguente código.
  6. Haz las modificaciones pertinentes, cambia las "#" por las URL de tus redes sociales.


<div id='social-sidebar'>
 <ul>
<li>
 <a class='entypo-twitter' href='#' target='_blank'>
 <span>Twitter</span>
 </a>
 </li>
<li>
 <a class='entypo-gplus' href='#' target='_blank'>
 <span>google+</span>
 </a>
 </li>
<li>
 <a class='entypo-facebook' href='#' target='_blank'>
 <span>facebook</span>
 </a>
 </li>
<li>
 <a class='entypo-rss' href='#' target='_blank'>
 <span>feedburner</span>
 </a>
 </li>
</ul>
</div>
<style type='text/css'>
/*<![CDATA[*/
@charset "utf-8";
/* CSS Document */
/* ---------- ENTYPO ---------- *//* ---------- Digital Hub Inc : http://www.digitalhubinc.com/---------- */
/* ---------- http://weloveiconfonts.com/ ---------- */
@import url(http://weloveiconfonts.com/api/?family=entypo);
[class*="entypo-"]:before {
font-family: 'entypo', sans-serif;
}
/* ---------- GENERAL ---------- */
#social-sidebar a { text-decoration: none; }
#social-sidebar ul {
list-style: none;
margin: 0;
padding: 0;
}
/* ---------- Social Sidebar ---------- */
#social-sidebar {
right: 0;
margin-top: -75px; /* (li * a:width) / -2 */
position: fixed;
top: 50%;
}
#social-sidebar ul li:first-child a { border-radius: 0 5px 0 0; }
#social-sidebar ul li:last-child a { border-radius: 0 0 5px 0; }
#social-sidebar ul li a {
background: #121212;
color: #fff;
display: block;
height: 50px;
font-size: 18px;
line-height: 50px;
position: relative;
text-align: center;
width: 50px;
}
#social-sidebar ul li a:hover span {
right: 130%;
opacity: 1;
}
#social-sidebar ul li a span {
border-radius: 3px;
line-height: 24px;
right: -100%;
margin-top: -16px;
 -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: alpha(opacity=0);
opacity: 0;
padding: 4px 8px;
position: absolute;
 -webkit-transition: opacity .3s, right .4s;
 -moz-transition: opacity .3s, right .4s;
 -ms-transition: opacity .3s, right .4s;
 -o-transition: opacity .3s, right .4s;
transition: opacity .3s, right .4s;
top: 50%;
z-index: -1;
}
#social-sidebar ul li a span:before {
content: "";
display: block;
height: 8px;
right: -4px;
margin-top: -4px;
position: absolute;
top: 50%;
 -webkit-transform: rotate(45deg);
 -moz-transform: rotate(45deg);
 -ms-transform: rotate(45deg);
 -o-transform: rotate(45deg);
transform: rotate(45deg);
width: 8px;
z-index: -2;
}
#social-sidebar ul li a[class*="twitter"]:hover,
#social-sidebar ul li a[class*="twitter"] span,
#social-sidebar ul li a[class*="twitter"] span:before { background: #6CDFEA; }
#social-sidebar ul li a[class*="gplus"]:hover,
#social-sidebar ul li a[class*="gplus"] span,
#social-sidebar ul li a[class*="gplus"] span:before { background: #E34429; }
#social-sidebar ul li a[class*="facebook"]:hover,
#social-sidebar ul li a[class*="facebook"] span,
#social-sidebar ul li a[class*="facebook"] span:before { background: #234999; }
#social-sidebar ul li a[class*="rss"]:hover,
#social-sidebar ul li a[class*="rss"] span,
#social-sidebar ul li a[class*="rss"] span:before { background: #f57b05; }
/*]]>*/
</style>



Digital Hub Inc!




Aizum Blog, miércoles, julio 02, 2014


Divisor Star

✏ Buscador!

En las redes ⤵

✏ Vídeos!

 

Publicidad!

Subir hacia arriba ▲ Modificated & Designed by Iván Dangerfield © 2014. Converted by Bloggertheme9