redes sociais flutuantes? alguém sabe estes códigos?

  • Autor Autor xXxGeneralxXx
  • Data de início Data de início
Tradução em andamento: em alguns minutos este tópico estará em português. Por enquanto, o conteúdo está no original em espanhol. Ver original
xXxGeneralxXx

xXxGeneralxXx

Delta
Verificado
Verificación en dos pasos activada
buenas gente.. estoy pensando en agregar unas redes flotantes en mi web

encontre una de facebook. que es flotante, una ventana en la parte derecha de la pantalla, que al darle click o poner el cursor encima, abre la fanpage para que las personas te agreguen...

CpldITu.png



tengo una duda... como podria agregar otra de estas ventanas? pero que sea de twitter?

o sea, al menos saber que codigos agregar para que sea una ventana igual.... donde yo pueda agregar codigos personales de twitter de ultima.... pero que sea una ventana similar a esa 😛



----------------------


tambien, ver si alguien sabe que tipo de plugin es este.

mbhfjT6.png


es una barrita horizontal abajo de la pagina, que dicho sea depaso, te sigue mientras ves la pagina...con redes sociales o codigos que uno deje....

alguien sabe cual es? o que codigos deberian agregarse?


Muchas gracias :encouragement:
 
Foi útil? Participe da conversa

Com sua conta grátis você pode responder, mandar mensagem privada ao autor e comprar com Saldo retido: o pagamento é liberado quando você recebe o combinado.

Leva 30 segundos · você volta a este tópico ao terminar
[MENTION=11920]Plaga9999[/MENTION]

Código flotante con twitter y facebook:

Inserir CODE, HTML ou PHP:
<style>#flotante1 {
position:fixed;
top:100px;
right:-250px;
float:right;
width:288px;
display:block;
padding:0;
z-index:1002;
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
}
#flotante2 {
position:fixed;
top:380px;
right:-250px;
float:right;
width:288px;
display:block;
padding:0;
z-index:1004;
border-radius:10px;
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
}
#flotante1:hover, #flotante2:hover, #flotante2:hover {
right:0px;
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
}
div.likeboxwrap {
margin-top:-5px;
margin-left:-45px;
width:238px; 
height:325px;
background-color:#fff;
overflow:hidden;
border-radius:10px;
}
</style>


<!-- Primera pestaña -->
<div id='flotante1'>
<img src='http://lh3.googleusercontent.com/-vq69jjHi_aA/UKxnEYWptDI/AAAAAAAADdU/1bjiSBYnRSo/fb_tab.png' style='float:left;'/>
<div style='background: #3c5a98; height:325px; margin-left:38px;padding: 8px 5px 0pt 50px;border-radius: 0px 0px 0px 10px;'><span><div class='likeboxwrap'>[COLOR=#ff0000]AQUI VA EL IFRAME DE FACEBOOK[/COLOR]
</div></span></div></div>


<!--Segunda Pestaña -->
<div id='flotante2'>
<img src='http://lh3.googleusercontent.com/-RhKk8PrLf6Q/UKxmjhdUHAI/AAAAAAAADdI/wUbRpY6XfiQ/tw_tab.png' style='float:left;'/>
<div style='background: #00a0e8; height:325px; margin-left:38px;padding: 8px 5px 0pt 50px;border-radius: 0px 0px 0px 10px;'><span><div class='likeboxwrap'>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js' type='text/javascript'></script>
<style>
.follow_box_widget{overflow: hidden; padding-left: 5px; padding-right: 5px; padding-top: 5px; background-color: #fff transparent; position: relative; margin: auto;}
.follow_box{font-size: 11px; font-family: "lucida grande",tahoma,verdana,arial,sans-serif; color: #333; line-height: 1.28; text-align: left; direction: ltr;}
.follow_box .follow_top{padding: 5px 10px 0px 5px; margin-bottom: 8px; min-width: 230px; overflow: hidden;}
.follow_box .profileimage{float: left; width: 40px; height: 40px; padding: 0px; margin: 0 10px 4px 0;}
.follow_box img{border: 0;}
.follow_box a{cursor: pointer; color: #3B5998; text-decoration: none;}
.follow_box a:hover{text-decoration: underline;}
.follow_action{padding: 0 0 0 8px;}
.follow_box .follow_action .name{line-height: 15px; font-size: 14px; font-weight: bold;}
.follow_box .follow_button{margin: 5px 0 0;}
.follow_box .total{min-width: 230px; overflow: hidden; display: block;}
.follow_box .connections{padding: 5px 0 4px 0px; border-top: solid 1px #D8DFEA; border-bottom: 1px solid #CCC; min-height: 150px;}
.follow_box .connections .connections_grid{padding-top: 5px; overflow: hidden;}
.follow_box .clearfix{zoom: 1;}
.follow_box .connections .connections_grid .grid_item{float: left; margin:0px; margin-right: 5px; margin-bottom: 8px; overflow: hidden; width: 50px;}
.follow_box .connections .connections_grid .grid_item .name{font-size: 9px; color: gray; overflow: hidden; padding-top: 2px; text-align: center; white-space: nowrap;}
.follow_box .connections .connections_grid .grid_item img{width: 48px; height: 48px;}
.follow_box .follow_widget_footer{ cursor: default; width: 100%; min-width: 230px; overflow: hidden;}
.follow_box .footer_border{ margin-top: 5px;}
.follow_box .uiImageBlock{line-height: 14px;}
.follow_box .follow_widget_footer .footer_logo{float: left; margin-right: 5px;}
.follow_box .follow_widget_footer .footer_text{cursor: default; color: #808080; font-size: 9px; float: left;}
.follow_box .follow_widget_footer .footer_text a.footer_text_link{color: #808080;}
.follow_box .titlecase{text-transform:capitalize;}
</style>
[COLOR=#ff0000]<div id="twitter-box"></div>[/COLOR]
[COLOR=#ff0000]<script>[/COLOR]
[COLOR=#ff0000]var tw_user = 'TWITTER';[/COLOR]
[COLOR=#ff0000]var tw_width = 240;[/COLOR]
[COLOR=#ff0000]var tw_height = 325;[/COLOR]
[COLOR=#ff0000]var no_face = 9;[/COLOR]
[COLOR=#ff0000](function() {[/COLOR]
[COLOR=#ff0000]var tw_box = document.createElement('script'); tw_box.type = 'text/javascript'; tw_box.async = true;[/COLOR]
[COLOR=#ff0000]tw_box.src = '//www.twitter-fanbox.com/tw.js';[/COLOR]
[COLOR=#ff0000](document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(tw_box);[/COLOR]
[COLOR=#ff0000]})();[/COLOR]
[COLOR=#ff0000]</script>[/COLOR]
<div id="twitterfollowbox" class="follow-box-container"> </div>


</div></span></div></div>

Lo que esta en rojo es lo que tenes que modificar:

1. Tenes que poner el iframe de facebook de tu fanpage, ponele las mismas medidas para que te calce bien (width=240 y height=327)

2. Tenes que ir a esta web--> Fan Box Twitter for web y generar el fanbox de tu twitter, le das generar código, te lleva a twitter y aceptas la aplicación, luego cuando te regresa a la web te sale la fanbox lista para copiar o modificar el ancho y el alto, las medidas son (width=240 y height=325) y lo reemplazas por lo que esta en rojo de twitter

Creo que es todo, con eso tenes.
 
perfecto amigo, funciona :encouragement:


decime, para agregar un +1 de google..

seria igual?
 
Jajaja fijate que ese codigo tenia tambien para google plus y yo se lo quite, mañana veo para pasartelo completo

Enviado desde mi 1100 con Tapatalk
 
buenas gente.. estoy pensando en agregar unas redes flotantes en mi web

encontre una de facebook. que es flotante, una ventana en la parte derecha de la pantalla, que al darle click o poner el cursor encima, abre la fanpage para que las personas te agreguen...



tengo una duda... como podria agregar otra de estas ventanas? pero que sea de twitter?

o sea, al menos saber que codigos agregar para que sea una ventana igual.... donde yo pueda agregar codigos personales de twitter de ultima.... pero que sea una ventana similar a esa 😛



Muchas gracias :encouragement:


Colega aquí otro similar 😉

http://forobeta.com/redirect-to/?redirect=http%3A%2F%2Fwww.theblogwidgets.com%2F2013%2F11%2Ffloating-facebook-like-box-widget-for.html

Saludos :encouragement::encouragement:
 
Voltar
Topo