Búsqueda personalizada

5 abr 2014

Pin It

Widgets

Como compartir fácil en Redes sociales en Blogger, caja flotante

20:30

Si QUIERES Que tus visitas puedan compartir tus Entradas en las Redes Sociales en tu Blog de Blogger y te gusta este Gadget, te voy a explicar de como lo puedes poner en tu Blog de forma fácil.

widget redes sociales blogger


Para empezar sigue estos:

1 -. Ir a Blogger

2 -. Da clic en la pestaña "Plantilla"

3 -. Y clic en "Editar HTML"

Se te abrirá el editor HTML y con el cursor Dentro del Código le das un CONTROL + F y te aparecerá algo de COMO ESTO:

Widget de compartir Sociales Redes blogger

Donde está el cuadrado rojo de la imagen Buscamos este Código:

<b:includable id='post' var='post'>

Justo Debajo de esta línea, pega el siguiente Código:

<!-- Www.cheydeveloper.blogspot.com-->                                                                                                                 <b:if cond='data:blog.pageType == &quot;item&quot;'> 
<b:if cond='data:blog.pageType != &quot;static_page&quot;'> 
<style> 
.mbt_social_floating{ 
    position:fixed; bottom:10%; margin-left:-60px; float:left;     width:60px; 
    background-color:#f7f7f7;     padding: 5px 0 0px 0px; 
     border-top:1px solid #ddd; 
border-left:1px solid #ddd; 
border-bottom:1px solid #ddd; 
z-index:9999px !important; 
border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px; 

.mbt_social_floating .mbt_side_social_button{ 
    margin-bottom:5px; 
    float:none; 
    height:auto; 
    width:60px; 

.mbt_social_floating .st_twitter_vcount, .mbt_social_floating.st_plusone_vcount, .st_email{ 
    margin-left:5px; 

.mbt_social_floating .st_fblike_vcount{ 
    margin-left:5px; 

.mbt_social_floating .stButton_gradient{ 
    background:none !important; 
    height:21px !important; 
    padding-left:0 !important; 

.mbt_social_floating .chicklets, .mbt_social_floating .stMainServices { 
    background:url(&#39;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgSpWWTtWsXyrDWrNAYKwFrNFGUQ3W8KQ-2x9POV3iBsajcCiTm65wWDX4odGlEDolJuKcW7cPm4JVdXC2Vi8NW-vvDTkWG9721LGh_AZSfNaQoo9AMMZnT1_7IFP5yVeSCN4ahWAQQt_8g/s400/gc_social_sprite.gif&#39;) no-repeat !important; 
    height:19px !important; 
    width:45px !important; 
    padding:0 !important; 

.st_email .chicklets{ 
    background-position:0 -77px !important; 
    background-image:url(&#39;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgSpWWTtWsXyrDWrNAYKwFrNFGUQ3W8KQ-2x9POV3iBsajcCiTm65wWDX4odGlEDolJuKcW7cPm4JVdXC2Vi8NW-vvDTkWG9721LGh_AZSfNaQoo9AMMZnT1_7IFP5yVeSCN4ahWAQQt_8g/s400/gc_social_sprite.gif&#39;) !important; 

.mbt_social_floating .st_twitter_vcount .st-twitter-counter{ 
    background-position:0 -58px !important; 

.mbt_social_floating  .stButton_gradient{ 
    border:none !important; 

.mbt_social_floating .stBubble_count{ 
    width:44px !important; 
    font-size: 15px !important; 
    font-weight: normal !important; 
    padding-top:7px !important; 
    height:23px !important; 
    background:none !important; 

.mbt_social_floating .st_twitter_vcount .stBubble_count{ 
    color:#00a6df; 
    background-color:#f8fbfc !important; 


.st_fblike_vcount{ 
    margin-bottom: 0px; 
    display: block; 

.st_twitter_vcount{ 
    margin-bottom: 3px; 
    display: block; 


.st_email{ 
    margin-bottom: 5px; margin-top: 3px; 
    display: block; 

.mbt_social_floating .stBubble{ 
    background-position: 21px 31px !important; 
    height:35px !important; 

</style> 

<div class='mbt_social_floating'> 
    <script type='text/javascript'>var switchTo5x=true;</script> 
    <script src='http://w.sharethis.com/button/buttons.js' type='text/javascript'/> 
    <script type='text/javascript'>stLight.options({onhover:false});</script> 
    <span class='st_fblike_vcount' displaytext=''/> 
    <span class='st_twitter_vcount' displaytext='' st_via='ojalapudiera'/> 
<div style='margin:5px 0 0px 0;'> 
<center><a class='pin-it-button' count-layout='vertical' expr:href='&quot;http://pinterest.com/pin/create/button/?url=&quot; + data:post.url'>Pin It</a> 
<a href='javascript:void(run_pinmarklet())' style='margin-left:-46px; width:43px; height:20px; display:inline-block;'/> 
<script src='http://assets.pinterest.com/js/pinit.js' type='text/javascript'/> 
<script type='text/javascript'> 
function run_pinmarklet() { 
var e=document.createElement(&#39;script&#39;); 
e.setAttribute(&#39;type&#39;,&#39;text/javascript&#39;); 
e.setAttribute(&#39;charset&#39;,&#39;UTF-8&#39;); 
e.setAttribute(&#39;src&#39;,&#39;http://assets.pinterest.com/js/pinmarklet.js?r=&#39; + Math.random()*99999999); 
document.body.appendChild(e); 

</script> </center> 
</div> 
<div style='margin:0px 0 0 5px;'> 
    <span class='st_plusone_vcount' displaytext=''/> 
</div> 
    
<div class='addthis_toolbox addthis_default_style ' style='margin:5px 0px 5px 8px;'> 
<a class='addthis_counter'/> 
</div> 
<script src='http://s7.addthis.com/js/250/addthis_widget.js' type='text/javascript'/> 
<script type='text/javascript'> 
var addthis_config = { 
     ui_cobrand: &quot;CHEY DEVELOPER&quot;, 
ui_header_color: &quot;#ffffff&quot;, 
     ui_header_background: &quot;#0080FF&quot; 

</script> 
<span class='st_email' displaytext=''/> 
<p style=' line-height:0px; font-size:10px; font-weight:bold; text-align:center;'><a href='http://cheydeveloper.blogspot.com/' style='color:#CAC8C8;'>Widgets</a></p> 
</div> 
</b:if></b:if>
Ahora SÓLO Tienes Que cambiar to Lo Que está en amarillo y PONER tu id de Twitter.

Guardar Plantilla.

Si Tienes Alguna Duda o QUIERES sable Algo Más, no dudes en DEJAR tu comentario.

Si te gusto no Olvides ayudarme a Seguir Creciendo compartiéndolo En Tus Redes Sociales Favoritas. ¡Gracias!

Escrito por

Si tienes alguna otra duda, o quieres comentar algo sobre el tema, te animo a que dejes un comentario. También puedes visitar nuestro foro. ¡Un saludo!

0 comentarios:

Publicar un comentario

 

© 2014 Aplicaciones ...---Chey---.... All rights resevered. Designed by Chey Developer

Back To Top
Recibe las actualizaciones directo a tu correo