Divisor

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


Corazón con efecto deslizante para compartir tus entradas






En este post quiero enseñaros un impresionante corazón deslizante o heart, para compartir tus entradas. En concreto el efecto funciona de la siguiente manera, cuando un usuario pasa el cursor del mouse, por encima del corazón, este se divide suavemente en dos partes, enseñando una serie de botones para compartir tus entradas. Por defecto, este impresionante corazón se posiciona en la parte izquierda, del footer. Para ver una demostración, dale clic:




Demo!



  • Para añadirlo en blogger ves Blogger después plantilla y Edición Html
  • Ahora busca con las teclas (Ctrl+f) en tu plantilla, la siguiente etiqueta que hay abajo en la primera línea de código, una vez encontrada la etiqueta, añade el siguiente código que le prosigue, antes de ese tag:

</head>

<!-- Corazón deslizante para compartir http://www.aizumblog.com/ -->
<script src='http://w.sharethis.com/gallery/shareegg/shareegg.js' type='text/javascript'/>
<script src='http://w.sharethis.com/button/buttons.js' type='text/javascript'/>
<script type='text/javascript'>stLight.options({publisher: &quot;ur-98d377f-bdd3-9ad1-fbe5-2a678f0a60ee&quot;, onhover:false}); </script>
<link href='http://w.sharethis.com/gallery/shareegg/shareegg.css' media='screen' rel='stylesheet' type='text/css'/>
<!--Corazón deslizante para compartir http://www.aizumblog.com/ -->

Ahora busca de nuevo en tu plantilla la siguiente etiqueta en tu blog, y luego una vez cercada,  añades antes de dicha etiqueta el código que le prosigue de abajo:

</body>

<!-- Obtén el gadget del corazón en  http://www.aizumblog.com/ -->
<div style='position: fixed; bottom: 2%; left: 2%;'>
<div class='shareEgg' id='shareThisShareHeart'/>
</div>
<script type='text/javascript'>stlib.shareEgg.createEgg(&#39;shareThisShareHeart&#39;, [&#39;facebook&#39;,&#39;twitter&#39;,&#39;pinterest&#39;,&#39;linkedin&#39;,&#39;stumbleupon&#39;,&#39;email&#39;,&#39;sharethis&#39;], {title:&#39; <data:blog.pageTitle/>&#39;,url:&#39;<data:blog.url/>&#39;,theme:&#39;shareheart&#39;});</script><a href="http://www.aizumblog.com/">
Gadgets para Blogger</a>
<!-- Obtén el gadget del corazón en  http://www.aizumblog.com/ -->

  • Ahora, en este último código, puedes cambiar lo que te resalto, este gadget está configurado para estar en la parte inferior de la página en el lado izquierdo, puedes cambiar bottom que quiere decir abajo, por top que es arriba, y left que es izquierda por right, que es derecha.



Aizum Blog, sábado, mayo 11, 2013


Divisor Star

✏ Buscador!

En las redes ⤵

✏ Vídeos!

 

Publicidad!

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