Tutorial: Botones Redes Sociales, Facebook, twiter, Google, Printeres y Feed

  • Autor Autor elcuervito
  • Fecha de inicio Fecha de inicio
elcuervito

elcuervito

Eta
Verificación en dos pasos activada
Verificado por Whatsapp
Buenas Betas les traigo este tutorial para poner los botones sociales en vuestro blog.

Es un Gadget compacto y de facil instalacion por eso mismo vamos directo a su instalacion.

imagen tutorial.webp

Ve a Blogger > Plantilla > Editar HTML, das un clic dentro de la plantilla, presionas CTRL + F, buscas </head> y pegas justo antes este codigo:

HTML:
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js'></script>
<script src="https://sites.google.com/site/terrenoblogger/css/jquery.social.media.tabs.1.6.1.min.js" type="text/javascript"></script>
<link href="https://sites.google.com/site/terrenoblogger/css/dcsmt.css" media="all" rel="stylesheet" type="text/css"></link>

La primera linea es Jquery. Debes omitirlo si ya lo tienes en tu blog.

Después de haber guardado los cambios anteriores, ve a Diseño > Añadir un gadget > HTML/Javascript y pegas allí este código:

HTML:
<div id="social-tabs">
</div>
<script type="text/javascript">         
        jQuery(document).ready(function(jQuery)
        {
            jQuery('#social-tabs').dcSocialTabs(
            {
    method: 'slide', location: 'left', align: 'top', position: 'fixed', offset: 70, height: 400, width: 320, start: 0, rotate: { delay: 8000,direction :'down' }, loadOpen:false, autoClose:true, imagePath: 'https://sites.google.com/site/terrenoblogger/imagenes/', 

widgets: 'facebook,fblike,google,twitter,rss,pinterest',

facebookId: 'ID-PAGINA-FACEBOOK', 
fblikeId: 'PAGINA-FACEBOOK', 
googleId: 'GOOGLE-ID',
twitterId: 'USUARIO', 
rssId: 'http://feeds.feedburner.com/USUARIO', 
pinterestId: 'USUARIO',
youtubeId: 'USUARIO',
vimeoId: 'USUARIO',
deliciousId: 'USUARIO',
instagramId: '#USUARIO',
dribbbleId: 'USUARIO',
stumbleuponId: 'USUARIO',
tumblrId: 'USUARIO',
deviantartId: 'USUARIO',

twitter: {title:'Tweets Recientes',follow:'Sígueme en Twitter',thumb:true,retweets:false,replies:false,limit:10}, 
fbrec: {header:true}, 
fblike:{stream:false,header:true,limit:36}, 
facebook:{title:'Facebook',follow:'Síguenos en Facebook',text:'content',limit:10}, 
google: {title:'Google+',follow:'Agréganos a tu Círculos',limit:10,api_key: 'AIzaSyAVx2W-gR7eqIpATEgp2IMOWtxzDDDOqt0'}, 
pinterest: {title:'Pinterest',follow:'Encuentrame en Pinterest',limit:10}, 
rss: {title:'Suscribete a nuestro Feed',follow:'Subscribe',limit:10}, 
youtube: {title:'Suscribete',subscribe:true,limit:10}, 
instagram: {clientId:'',redirectUrl:'',accessToken:'',limit:10,title:'Instagram'}, 
vimeo: {title:'Vimeo',follow:'Subscribe',limit:10}, flickr: {title:'Flickr',limit:20}, 
stumbleupon: {title:'Stumbleupon',follow:'Follow',limit:10}, 
tumblr: {title:'Tumblr',follow:'Follow',limit:10}, 
delicious: {title:'Delicious',follow:'Follow on Delicious',limit:10}, 
digg: {title:'Latest Diggs',limit:10}, lastfm: {title:'Last.fm',limit:20}, 
dribbble: {title:'Dribbble',follow:'Follow on Dribbble',limit:10}, 
deviantart: {title:'deviantART',follow:'Follow',limit:10}
            });
        });

    </script>

Este gadget viene con la opción de agregar mas redes sociales como:
youtube
vimeo
delicious
instagram
dribbble
stumbleupon
tumblr
deviantart

para agregarlas solo debes ir a esta linea

HTML:
widgets: 'facebook,fblike,google,twitter,rss,pinterest',

y debes escribir después de pinterest, una coma y luego el nombre de la otra red social y luego en el codigo resaltado en azul agregaras el nombre de usuario de dicha red social.

youtubeId: 'USUARIO',
vimeoId: 'USUARIO',
deliciousId: 'USUARIO',
instagramId: '#USUARIO',
dribbbleId: 'USUARIO',
stumbleuponId: 'USUARIO',
tumblrId: 'USUARIO',
deviantartId: 'USUARIO',


Espero que les halla gustado!
 
Muchas gracias por el aporte 🙂
 
Atrás
Arriba