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

elcuervito Seguir

Eta
Verificación en dos pasos activada
Verificado por Whatsapp
Desde
29 Mar 2013
Mensajes
1.398
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.jpg

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!
 

Carlos Arreola

Admin
Sigma
Verificado
Verificación en dos pasos activada
Verificado por Whatsapp
Verificado por Binance
¡Excelente comerciante!
Suscripción a IA
Desde
6 Abr 2009
Mensajes
12.385
Muchas gracias por el aporte :)
 
Arriba