Búsqueda en el Foro:
Buscar


Autor Mensaje
Mensaje02-03-2013, 15:16 (UTC)    
Título del mensaje: [RESUELTO-FUNCIONAL] Boton flotante de Facebook
Responder citando
*Urgente, si alguien conoce la formula mágica que logre ESTO!

*Ej= http://www.elblogdellagarto.com/

*El boton flotante del FB desplazable...supongo que es con una combinacion de facebook-plugins pero no eh encontrado la manera..

*Grax. de antemano.


Ultima edición por clanlaz el Dom Mar 03, 2013 8:03 pm; editado 1 vez
↑
Mensaje03-03-2013, 06:56 (UTC)    
Título del mensaje:
Responder citando
este es el codigo

Cita:
<style type="text/css">
/*<![CDATA[*/
#fbplikebox{display: block;padding: 0;z-index: 99999;position: fixed;background-color:#fff;}
.fbplbadge {background-color:white;display: block;height: 150px;top: 50%;margin-top: -75px;position: absolute;right: -47px;width: 47px;background-image: url("http://3.bp.blogspot.com/-bNGt6Efsz1Y/T3cRM7fgP1I/AAAAAAAAAGQ/1yvt_nrp1yY/s1600/badgefacebook.png");background-repeat: no-repeat;overflow: hidden;border-top-right-radius: 8px;border-bottom-right-radius: 8px;}
/*]]>*/
</style>
<script type="text/javascript">
/*<![CDATA[*/
(function(w2bz){
w2bz(document).ready(function(){
var $dur = "medium"; // Duration of Animation
w2bz("#fbplikebox").css({left: -250, "top" : 100 })
w2bz("#fbplikebox").hover(function () {
w2bz(this).stop().animate({
left: 0
}, $dur);
}, function () {
w2bz(this).stop().animate({
left: -250
}, $dur);
});
w2bz("#fbplikebox").show();
});
})(jQuery);
/*]]>*/
</script>
<div id="fbplikebox" style="display:none;">
<div class="fbplbadge"></div>
<!-- codigo -->
</div>


ahora vas a la siguiente pagina
http://developers.facebook.com/docs/reference/plugins/like-box/

y llenas la pagina de la siguiente manera
width
250
height
depende de cuantas caras desees ver (alrededor de 350 recomendado)
show faces
dejar marcado
color scheme
depende de su diseño si es claro light, si es oscuro dark
stream
desmarcar. esta zona muestra los post hechos en el fanpage
border color
si es posible dejar en blanco
show header
es el letrero que dice "buscanos en facebook". este es a tu antojo

ahora presionamos el boton "get code" y aparecera un cuadro. en los links de ese cuadro clickamos "IFRAME" y copiamos el codigo. ahora reresamos a nuestra pagina

en el codigo hay una zona llamada <!-- codigo --> (marcada en azul ahi arriba) eliminar y pegar el codigo de FB! ahi. guardar y listo

tambien marque un codigo css (en rojo) por si desean cambiarle el color a el box

tal vez te preguntes ¿por que a la izquierda?. la respuesta es simple. por la publicidad de la derecha

Fuente: un poco de esta pagina Link
______________
↑
Mensaje03-03-2013, 15:46 (UTC)    
Título del mensaje:
Responder citando
darknet13 escribió:
este es el codigo

Cita:
<style type="text/css">
/*<![CDATA[*/
#fbplikebox{display: block;padding: 0;z-index: 99999;position: fixed;background-color:#fff;}
.fbplbadge {background-color:white;display: block;height: 150px;top: 50%;margin-top: -75px;position: absolute;right: -47px;width: 47px;background-image: url("http://3.bp.blogspot.com/-bNGt6Efsz1Y/T3cRM7fgP1I/AAAAAAAAAGQ/1yvt_nrp1yY/s1600/badgefacebook.png");background-repeat: no-repeat;overflow: hidden;border-top-right-radius: 8px;border-bottom-right-radius: 8px;}
/*]]>*/
</style>
<script type="text/javascript">
/*<![CDATA[*/
(function(w2bz){
w2bz(document).ready(function(){
var $dur = "medium"; // Duration of Animation
w2bz("#fbplikebox").css({left: -250, "top" : 100 })
w2bz("#fbplikebox").hover(function () {
w2bz(this).stop().animate({
left: 0
}, $dur);
}, function () {
w2bz(this).stop().animate({
left: -250
}, $dur);
});
w2bz("#fbplikebox").show();
});
})(jQuery);
/*]]>*/
</script>
<div id="fbplikebox" style="display:none;">
<div class="fbplbadge"></div>
<!-- codigo -->
</div>


ahora vas a la siguiente pagina
http://developers.facebook.com/docs/reference/plugins/like-box/

y llenas la pagina de la siguiente manera
width
250
height
depende de cuantas caras desees ver (alrededor de 350 recomendado)
show faces
dejar marcado
color scheme
depende de su diseño si es claro light, si es oscuro dark
stream
desmarcar. esta zona muestra los post hechos en el fanpage
border color
si es posible dejar en blanco
show header
es el letrero que dice "buscanos en facebook". este es a tu antojo

ahora presionamos el boton "get code" y aparecera un cuadro. en los links de ese cuadro clickamos "IFRAME" y copiamos el codigo. ahora reresamos a nuestra pagina

en el codigo hay una zona llamada <!-- codigo --> (marcada en azul ahi arriba) eliminar y pegar el codigo de FB! ahi. guardar y listo

tambien marque un codigo css (en rojo) por si desean cambiarle el color a el box

tal vez te preguntes ¿por que a la izquierda?. la respuesta es simple. por la publicidad de la derecha

Fuente: un poco de esta pagina Link


*Gracias por la respuesta campeón...pero este seria mi Code:
Cita:
<style type="text/css">
/*<![CDATA[*/
#fbplikebox{display: block;padding: 0;z-index: 99999;position: fixed;background-color:#fff;}
.fbplbadge {background-color:white;display: block;height: 150px;top: 50%;margin-top: -75px;position: absolute;right: -47px;width: 47px;background-image: url("http://3.bp.blogspot.com/-bNGt6Efsz1Y/T3cRM7fgP1I/AAAAAAAAAGQ/1yvt_nrp1yY/s1600/badgefacebook.png");background-repeat: no-repeat;overflow: hidden;border-top-right-radius: 8px;border-bottom-right-radius: 8px;}
/*]]>*/
</style>
<script type="text/javascript">
/*<![CDATA[*/
(function(w2bz){
w2bz(document).ready(function(){
var $dur = "medium"; // Duration of Animation
w2bz("#fbplikebox").css({left: -250, "top" : 100 })
w2bz("#fbplikebox").hover(function () {
w2bz(this).stop().animate({
left: 0
}, $dur);
}, function () {
w2bz(this).stop().animate({
left: -250
}, $dur);
});
w2bz("#fbplikebox").show();
});
})(jQuery);
/*]]>*/
</script>
<div id="fbplikebox" style="display:none;">
<div class="fbplbadge"></div>
<iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fplatform&amp;width=250&amp;height=590&amp;show_faces=true&amp;colorscheme=light&amp;stream=true&amp;border_color=red&amp;header=true" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:250px; height:590px;" allowTransparency="true"></iframe></div>


*Ya intente pegarlo por encima de la página y no me aparece...¿DONDE IRIA? :/
↑
Mensaje03-03-2013, 19:44 (UTC)    
Título del mensaje:
Responder citando
es extraño solo puedo asumir que no esta utilizando Jquery por lo que el codigo no se mostraria seria nada mas agregar de la siguiente manera

Cita:
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<style type="text/css">
/*<![CDATA[*/
#fbplikebox{display: block;padding: 0;z-index: 99999;position: fixed;background-color:#fff;}
.fbplbadge {background-color:white;display: block;height: 150px;top: 50%;margin-top: -75px;position: absolute;right: -47px;width: 47px;background-image: url("http://3.bp.blogspot.com/-bNGt6Efsz1Y/T3cRM7fgP1I/AAAAAAAAAGQ/1yvt_nrp1yY/s1600/badgefacebook.png");background-repeat: no-repeat;overflow: hidden;border-top-right-radius: 8px;border-bottom-right-radius: 8px;}
/*]]>*/
</style>
<script type="text/javascript">
/*<![CDATA[*/
(function(w2bz){
w2bz(document).ready(function(){
var $dur = "medium"; // Duration of Animation
w2bz("#fbplikebox").css({left: -250, "top" : 100 })
w2bz("#fbplikebox").hover(function () {
w2bz(this).stop().animate({
left: 0
}, $dur);
}, function () {
w2bz(this).stop().animate({
left: -250
}, $dur);
});
w2bz("#fbplikebox").show();
});
})(jQuery);
/*]]>*/
</script>
<div id="fbplikebox" style="display:none;">
<div class="fbplbadge"></div>
<iframe src="//www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/ClanLaz&amp;width=250&amp;height=258&amp;show_faces=true&amp;colorscheme=light&amp;stream=false&amp;border_color&amp;header=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:250px; height:258px;" allowTransparency="true"></iframe></div>

______________
↑
Mensaje04-03-2013, 00:00 (UTC)    
Título del mensaje:
Responder citando
darknet13 escribió:
es extraño solo puedo asumir que no esta utilizando Jquery por lo que el codigo no se mostraria seria nada mas agregar de la siguiente manera

Cita:
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<style type="text/css">
/*<![CDATA[*/
#fbplikebox{display: block;padding: 0;z-index: 99999;position: fixed;background-color:#fff;}
.fbplbadge {background-color:white;display: block;height: 150px;top: 50%;margin-top: -75px;position: absolute;right: -47px;width: 47px;background-image: url("http://3.bp.blogspot.com/-bNGt6Efsz1Y/T3cRM7fgP1I/AAAAAAAAAGQ/1yvt_nrp1yY/s1600/badgefacebook.png");background-repeat: no-repeat;overflow: hidden;border-top-right-radius: 8px;border-bottom-right-radius: 8px;}
/*]]>*/
</style>
<script type="text/javascript">
/*<![CDATA[*/
(function(w2bz){
w2bz(document).ready(function(){
var $dur = "medium"; // Duration of Animation
w2bz("#fbplikebox").css({left: -250, "top" : 100 })
w2bz("#fbplikebox").hover(function () {
w2bz(this).stop().animate({
left: 0
}, $dur);
}, function () {
w2bz(this).stop().animate({
left: -250
}, $dur);
});
w2bz("#fbplikebox").show();
});
})(jQuery);
/*]]>*/
</script>
<div id="fbplikebox" style="display:none;">
<div class="fbplbadge"></div>
<iframe src="//www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/ClanLaz&amp;width=250&amp;height=258&amp;show_faces=true&amp;colorscheme=light&amp;stream=false&amp;border_color&amp;header=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:250px; height:258px;" allowTransparency="true"></iframe></div>


*AHHHHHHHH NOOOOOOOO SOS UN GE-NIO! FUNCIONÓ!...gracias...gente como vos vale la pena conocer...y muchas gracias por despejarme la duda y tomarte la molestia .
*Abrazo.
↑
Mostrar mensajes anteriores:   
  • Página 1 de 1

  •  
    • Saltar a:  


Powered by phpBB © 2001, 2005 phpBB Group

© 2025 webme GmbH, Alemania. Todos los derechos reservados.