Hola, Bienvenidos a Sanahoria.com, Tu Pagina Informativa Y Músical.!

Siguenos en las diferentes redes sociales o suscribirte a nuestro feed de Sanahoria.com.

¡Suscríbete a nuestro blog!

Recibe en tu correo las últimas noticias del blog. Sólo ingresa tu correo para suscribirte.

 

Cajas deslizantes laterales de Facebook Fans,Twitter y Blogger


A pedido de un visitante es que decidí elaborar esta entrada. En este caso les voy a enseñar a colocarlas en el blog de ustedes y además también la de Blogger para obtener seguidores ahí también.

Es muy sencillo de implementarlo, simplemente presten atención a los pasos y en pocos minutos lo van a tener en sus blogs.

El primer paso es ir a nuestra plantilla HTML, apretamos Ctrl+F y abrimos el buscador del navegadores y buscamos lo siguiente: ]]></b:skin>

Arriba de eso colocamos los siguientes estilos:


Seguidores Blogger */
.barrightblogger { background: url('http://3.bp.blogspot.com/-M5A-TLdB58E/TpOxL5GAReI/AAAAAAAAAN0/gEa0HRqhX4k/s1600/bl_cb.png');background-repeat: no-repeat; width:39px; height:159px; position:fixed; right:0px; top:50px; z-index:1000;}
.barrightbloggerc { background: url('http://3.bp.blogspot.com/-gQ9PACjKc2I/TpOxMv4CyiI/AAAAAAAAAN8/FyEncEGNCbM/s1600/bl_cg.png');background-repeat: no-repeat; width:288px; height:345px; position:fixed; right:0px; top:50px; z-index:1100;}
.barconteblogger {margin:12px 0 0 47px}

/* Twitter */
.barrighttwitter { background: url('http://2.bp.blogspot.com/--gRMUITrjwM/TpOxLpClllI/AAAAAAAAANs/l88iteOo244/s1600/tw_cb.png');background-repeat: no-repeat; width:39px; height:159px; position:fixed; right:0px; top:210px; z-index:1000;}
.barrighttwitterc { background: url('http://2.bp.blogspot.com/-B97DZMK7wus/TpOxNSwRhPI/AAAAAAAAAOU/A-RjcC6WYjk/s1600/tw_ag.png');background-repeat: no-repeat; width:288px; height:345px; position:fixed; right:0px; top:120px; z-index:1100;}
.barcontetwitter {margin:0 0 0 47px}

/* Facebook */
.barrightfacebook { background: url('http://3.bp.blogspot.com/-3xq-Se4UF9w/TpOxNLDMYmI/AAAAAAAAAOM/yaPj4IUjnQ0/s1600/fb_cb.png');background-repeat: no-repeat; width:39px; height:159px; position:fixed; right:0px; top:370px; z-index:1000;}
.barrightfacebookc { background: url('http://2.bp.blogspot.com/-Cum28YwF4d8/TpOxM_lUKMI/AAAAAAAAAOE/L4pJ91PTVz4/s1600/fb_bg.png');background-repeat: no-repeat; width:288px; height:345px; position:fixed; right:0px; top:185px; z-index:1100;}
.barcontefacebook {margin:12px 0 0 47px}



En Rojo les dejé marcado dónde comenzaría el código de estilos de cada red social y luego en azul el enlace de las imágenes que puedan subirlas a sus propios servidores y reemplazarlas ahí mismo.

Bien, ahora buscamos lo siguiente en nuestra plantilla HTML (recuerden de abrir el buscador del navegador apretando control+F):  </body> y ARRIBA de esa etiqueta pegamos lo siguiente:


<!-- SEGUIDORES BLOGGER -->

<div class="barrightblogger" onmouseover="this.className='barrightbloggerc'" onmouseout="this.className='barrightblogger'"><div class="barconteblogger">
<!-- Include the Google Friend Connect javascript library. -->
<script type="text/javascript" src="http://www.google.com/friendconnect/script/friendconnect.js"></script>
<!-- Define the div tag where the gadget will be inserted. -->
<div id="div-3082905992843096175" style="width:240px;border:0px solid #ffffff;"></div>
<!-- Render the gadget into a div. -->
<script type="text/javascript">
var skin = {};
skin['BORDER_COLOR'] = '#ffffff';
skin['ENDCAP_BG_COLOR'] = '#e0ecff';
skin['ENDCAP_TEXT_COLOR'] = '#333333';
skin['ENDCAP_LINK_COLOR'] = '#0000cc';
skin['ALTERNATE_BG_COLOR'] = '#ffffff';
skin['CONTENT_BG_COLOR'] = '#ffffff';
skin['CONTENT_LINK_COLOR'] = '#0000cc';
skin['CONTENT_TEXT_COLOR'] = '#333333';
skin['CONTENT_SECONDARY_LINK_COLOR'] = '#7777cc';
skin['CONTENT_SECONDARY_TEXT_COLOR'] = '#666666';
skin['CONTENT_HEADLINE_COLOR'] = '#333333';
skin['NUMBER_ROWS'] = '6';
google.friendconnect.container.setParentUrl('/' /* location of rpc_relay.html and canvas.html */);
google.friendconnect.container.renderMembersGadget(
{ id: 'div-3082905992843096175',
site: '00286525615627339881' },
skin);
</script>
</div></div>
<!-- FIN SEGUIDORES BLOGGER -->

<!-- TWITTER -->

<div class="barrighttwitter" onmouseover="this.className='barrighttwitterc'" onmouseout="this.className='barrighttwitter'"><div class="barcontetwitter">
<script src="http://widgets.twimg.com/j/2/widget.js"></script>
<script>
new TWTR.Widget({
version: 2,
type: 'profile',
rpp: 3,
interval: 30000,
width: 240,
height: 250,
theme: {
shell: {
background: '#33ccff',
color: '#ffffff'
},
tweets: {
background: '#ffffff',
color: '#333333',
links: '#33ccff'
}
},
features: {
scrollbar: true,
loop: false,
live: true,
hashtags: true,
timestamp: true,
avatars: true,
behavior: 'all'
}
}).render().setUser('Hogardelblogger').start();
</script>
</div></div>
<!-- FIN TWITTER -->

<!-- FACEBOOK -->

<div class="barrightfacebook" onmouseover="this.className='barrightfacebookc'" onmouseout="this.className='barrightfacebook'"><div class="barcontefacebook">
<iframe allowtransparency="true" frameborder="0" scrolling="no" src="http://www.facebook.com/plugins/likebox.php?href=http://www.facebook.com/ElHogarDelBlogger&amp;width=240&amp;colorscheme=light&amp;connections=15&amp;stream=false&amp;header=false&amp;height=320" style="border: none; height: 320px; overflow: hidden; width: 240px;background: #fff;"></iframe>
</div></div>
<!-- FIN FACEBOOK -->





Bien, ahora sólo nos toca reemplazar. Lo que está en color violeta lo reemplazamos por la ID nuestra de blogger.

Lo que dice rpp: 3 modificamos el número 3 por la cantidad de comentarios que queremos que muestre la caja de twitter al abrirla.

Lo que dice Hogardelblogger lo reemplazamos por nuestro usuario de Twitter.


Y, por último, lo que dice http://www.facebook.com/ElHogarDelBlogger , lo reemplazamos por nuestra url de la fanpage de Facebook.

No olvides dejar tu mensaje si te gustó el post, y de igual manera si tienes alguna pregunta

Comparte este artículo con tus amigos en Facebook,y Twitter con los botones debajo de cada post.¡Gracias! ..Fuente/ hogarblogger/

0 Comenta esta nota.:

.

Información y diversión en tu correo

Registra tu e-mail en el campo de abajo y recibiras diariamente lo más destacado del de Sanahoria.com, disfruta de: Noticias, Entretenimiento, Farandulas, Música,Fotos, Videos, Deportes,y los mejores eventos del United Palace.

Entra tu email Aqui..

- Recibe las principales noticias del día a travez de Sanahoria.com

- Registrate es simple y sin costo alguno

- Tu correo no será divulgado ni usado para cualquier otro tipo de envío

- Puedes cancelar tu suscripción en cualquier momento

 
 
 
Salud
[Ultimo avance diabetes T-1]
Compartiendo la data, Dexcom G4 PLATINUM con Share. Para los que no están familiarizados con esta herramienta, el MCG cuenta con tres partes; el sensor, el transmisor y el recibidor.

Leer Más [+]
Blog Ayuda
[Como Inhabilitar el botón derecho del mouse]
Se trata de un script que se activa al usar el botón derecho del mouse y que muestra un mensaje en toda la ventana del navegador..

Leer Más [+]
[ Poner foto de Fondo al texto en cualkier post. ] Hoy les traigo un truco el cual nos ayudará a ponerle un fondo a cualquier entrada en particular del blog. El truco es en verdad sencillo.

Leer Más [+]
Tecnología
[Intel presenta el primer ordenador portátil sin cables]
Este equipo se carga de forma inalámbrica y puede conectarse a periféricos sin necesidad de hacerlo a través de cables.

Leer Más [+]
Trucos Para Tu Blog.
[Cajas deslizantes laterales de Facebook Fans]
En este caso les voy a enseñar a colocarlas en el blog de ustedes y además también la de Blogger para obtener seguidores ahí también..

Leer Más [+]
[Dos post en una misma entrada.] Hola hoy he encontrado un nuevo truco sirve para escribir un post con dos columnas, no olvides en dejar algun comentario si te gusto el truco.

Leer Más [+]
Sexología
[Trastorno del deseo sexual]
consiste en la ausencia reiterada y persistente de fantasías sexuales o interés para realizar algún tipo de actividad sexual. Tal y como explica la doctora Francisca Molero.

Leer Más [+]
Personaliza Tu Blog.
[Araña interactiva para el blog, que se mueve]
Esto es parte de la modernidad web, y se trata de una araña que se mueve por si sola dentro de su telaraña, y que podemos arrastrar con el cursor.

Leer Más [+]
[Como Cambiar el Favicon de blogger] Pues bien no es tan dificil solo bastará con agregar una linea al código para decirle lo que queremos que haga. en primer lugar ubicamos en diseño hthtml el siguiente código:.

Leer Más [+]
 
Copyright © Www.Sanahoria.Com
Diseño grafico exclusivo de Sanahoria.com Por | su Editor: Felipe Marte