Pagina 1 van 1
speciale Facebook button
Geplaatst: 17 jan 2014, 19:13
door petjes
Op de website van forum gebruiker
Yomi, staat een hele leuke facebook button.
Zijn website is :
http://www.witvisforum.nl
Nu ben ik op zoek naar de code van deze facebook button en hoe kan ik deze op de hoofdpagina plaatsen zoals
Yomi heeft gedaan ?
Voeg er nog 2 foto's bij hoe het eruitziet.
Iemand enig idee.
MVG Patrick
http://www.twinsite.nl
Re: speciale Facebook button
Geplaatst: 17 jan 2014, 22:10
door Solidjeuh
Kijk naar de bron code.. Daar vind je de meeste info
Code: Selecteer alles
<style type='text/css'>
/*<![CDATA[*/
#fbplikebox{display: block;padding: 0;z-index: 99999;position: fixed;}
.fbplbadge {background-color:#3B5998;display: block;height: 150px;top: 50%;margin-top: -75px;position: absolute;left: -47px;width: 47px;background-image: url('http://1.bp.blogspot.com/-PUYBb2326SY/T13eXFv1sPI/AAAAAAAABdE/VOqfHVMXhWk/s1600/w2b_vertical-right.png');background-repeat: no-repeat;overflow: hidden;-webkit-border-top-left-radius: 8px;-webkit-border-bottom-left-radius: 8px;-moz-border-radius-topleft: 8px;-moz-border-radius-bottomleft: 8px;border-top-left-radius: 8px;border-bottom-left-radius: 8px;}
/*]]>*/
</style>
<script type='text/javascript'>
/*<![CDATA[*/
(function(w2b){
w2b(document).ready(function(){
var $dur = 'medium'; // Duration of Animation
w2b('#fbplikebox').css({right: -250, 'top' : 350 })
w2b('#fbplikebox').hover(function () {
w2b(this).stop().animate({
right: 0
}, $dur);
}, function () {
w2b(this).stop().animate({
right: -250
}, $dur);
});
w2b('#fbplikebox').show();
});
})(jQuery);
/*]]>*/
</script>
<div id='fbplikebox' style='display:none;'>
<div class='fbplbadge'></div>
<iframe src='http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Ffacebook.com%2FSportvistotaal&width=250&height=260&colorscheme=light&show_faces=true&border_color=%23C4C4C4&stream=false&header=false' scrolling='no' frameborder='0' style='border:none; overflow:hidden; width:250px; height:260px;background:#FFFFFF;' allowtransparency='true'></iframe>
</div>
Re: speciale Facebook button
Geplaatst: 17 jan 2014, 22:23
door Theriddler
Re: speciale Facebook button
Geplaatst: 17 jan 2014, 22:31
door Solidjeuh
Je bent beter om de css apart te plaatsen.
Open: JE_STYL/theme/common.css
Plaats helemaal onderaan op een nieuwe lijn:
Code: Selecteer alles
#fbplikebox{display: block;padding: 0;z-index: 99999;position: fixed;}
.fbplbadge {background-color:#3B5998;display: block;height: 150px;top: 50%;margin-top: -75px;position: absolute;left: -47px;width: 47px;background-image: url('http://1.bp.blogspot.com/-PUYBb2326SY/T13eXFv1sPI/AAAAAAAABdE/VOqfHVMXhWk/s1600/w2b_vertical-right.png');background-repeat: no-repeat;overflow: hidden;-webkit-border-top-left-radius: 8px;-webkit-border-bottom-left-radius: 8px;-moz-border-radius-topleft: 8px;-moz-border-radius-bottomleft: 8px;border-top-left-radius: 8px;border-bottom-left-radius: 8px;
}
Open: overal-header.html
zoek:
Plaats boven:
Code: Selecteer alles
<script type='text/javascript'>
/*<![CDATA[*/
(function(w2b){
w2b(document).ready(function(){
var $dur = 'medium'; // Duration of Animation
w2b('#fbplikebox').css({right: -250, 'top' : 350 })
w2b('#fbplikebox').hover(function () {
w2b(this).stop().animate({
right: 0
}, $dur);
}, function () {
w2b(this).stop().animate({
right: -250
}, $dur);
});
w2b('#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%2Froddelkwartier&width=250&height=258&colorscheme=light&show_faces=true&header=false&stream=false&show_border=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:250px; height:258px;background:#FFFFFF;' allowTransparency="true"></iframe>
</div>
Je moet enkel de naam van je facebook pagina veranderen in de overal_header.html
Re: speciale Facebook button
Geplaatst: 18 jan 2014, 09:49
door petjes
Bedankt voor de snelle reactie.
Het is inmiddels gelukt met bovenstaande code.
MVG Patrick
http://www.twinsite.nl
Best wel leuk / handig deze buttons aan de zijkant van het scherm, waar kan je nog meer van dit soort scripts vinden.
Eventueel zelf aan te passen met bijvoorbeeld buienradar / nieuwslinks oid.
uiteraard dat je de positie kan aanpassen.
Berichten samengevoegd. Dubbelposten is niet toegestaan, zie de algemene voorwaarden #3.5.
- PhilipvD