Un estilo nuevo basado en nuevos atributos CSS, y se la da al lector la opción de cerrar la barra que contiene los marcadores sociales, lo que hace que sea menos molesto para el lector.
El truco se ve de la siguiente manera:
Puede ver un Demo de este truco en el siguiente blog de pruebas.
Para agregar este truco busca la etiqueta <body> y debajo de ella pega lo siguiente:
<div id=’fb-root’/>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = «//connect.facebook.net/es_LA/all.js#xfbml=1»;
fjs.parentNode.insertBefore(js, fjs);
}(document, ‘script’, ‘facebook-jssdk’));</script>
Ahora entra a Diseño, Añadir Gadget, HTML/JavaScript y pega allí lo siguiente:
<style type=»text/css»>
#menudesli {
background-color: #00FFFF; /* Color de fondo */
width: 75px;
padding-top:5px;
padding-bottom:25px;
text-align: center;
/* POSICION FLOTANTE */
position:fixed !important;
right:5%; /* Esto decide Izquierda o derecha 5% */
top:200px; /* Distancia de arriba para abajo */
z-index:10 !important
/* POSICION FLOTANTE */
/* REDONDEADO */
-moz-border-radius: 15px 15px 15px 15px;
-webkit-border-radius: 15px 15px 15px 15px;
border-radius: 15px 15px 15px 15px;
/* REDONDEADO */
border:-color: #000000; /* Color de borde */
border-width: 2px;
border-style: solid;
}
</style>
<div id=»light» class=»white_content»>
<div class=»menudesli» id=»menudesli»><a href = «javascript:void(0)» onclick = «document.getElementById(‘light’).style.display=’none’;document.getElementById(‘fade’).style.display=’none'»><img src=»http://3.bp.blogspot.com/-_0qFToAh1VM/UVtBehic5GI/AAAAAAAAHBE/y8k-BUg54PE/s1600/cerr.png» border=»0″/></a>
<a href=»http://blogger.el-foro.com/t2-barra-deslizante-botones-compartir-opcion-cerrar» target=»_blank»><img src=»http://1.bp.blogspot.com/-QnTbXSOlL7Y/UWHw4hJVPSI/AAAAAAAAHM0/LrRlbgyyN2M/s1600/Gadgets.png» border=»0″></a>
<div class=»fb-like» data-send=»false» data-layout=»box_count» data-width=»75″ data-show-faces=»false» data-font=»arial»></div>
<a href=»https://twitter.com/share» class=»twitter-share-button» data-lang=»es» data-count=»vertical»>Tweet</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=»https://platform.twitter.com/widgets.js»;fjs.parentNode.insertBefore(js,fjs);}}(document,»script»,»twitter-wjs»);</script>
<div class=»g-plusone» data-size=»tall»>
</div>
0 comentarios