Mini on a Big roadtrip is de digitale identiteit van Toine Branbergen Freelance Front-end Developer en Allrounder. Internet ondernemer @ Mini on a Big roadtrip en De Gebroeders T. Lifestyle designer, blogger, reiziger en levensgenieter. Hard werken en hard genieten! Bekijk mijn portfolio
De Facebook vind ik leuk button op je website of blog
Social media wordt steeds belangrijker. Facebook heeft nu de handige “vind ik leuk” button waarmee je met een druk op de knop een website of artikel die je leuk vindt op je Facebook profiel kan plaatsen. Erg handig om je website, artikel of iets anders onder de aandacht te brengen bij je vrienden. En het mooie is, het is erg makkelijk om deze te integreren. Hieronder een kleine tutorial. Veel plezier!
Javascript onder je BODY open tag opnemen
Zet onderstaande javascript code direct onder je body open tag op de pagina waar je de button wilt gebruiken.
<div id=”fb-root”></div>
<script>
window.fbAsyncInit = function() {
FB.init({appId: ‘your app id’, status: true, cookie: true,
xfbml: true});
};
(function() {
var e = document.createElement(‘script’); e.async = true;
e.src = document.location.protocol +
‘//connect.facebook.net/nl_NL/all.js’;
document.getElementById(‘fb-root’).appendChild(e);
}());
</script>
De knop toevoegen aan de pagina
Open het bronbestand van de pagina waarop je de button wilt vertonen en voeg toe:
<fb:like href=”URL naar keuze” action=”like”></fb:like>
Resultaat

Taal aanpassen
Wil je de button in een andere taal hebben? Verander dan in de javascript code de directory die nu op Nederlands staat in een van de volgende talen.
- German
de_DE - English (US)
en_US - French (France)
fr_FR




25 januari 2011 - 12:47
Als ik dit in een leeg html-bestand zet, verschijnt er geen knop… volgens mij is dit verhaal niet compleet…
25 januari 2011 - 17:40
Ik gebruik de bovenstaande code zelf ook en bij mij werkt hij prima. Ik heb wel van iemand gehoord dat hij de single quotes moest vervangen voor double quotes in de javascript code. Misschien werkt het dan wel voor jou.
1 februari 2011 - 13:55
Hoi,
Ik had hierover een tijdje terug ook een item geschreven op m’n blog, check het:
http://www.navinpoeran.com/facebook-vind-ik-leuk-like-knop-voor-je-wordpress-website/
3 februari 2011 - 11:23
Hi there!
Kan iemand het bovenstaande verhaal even in dummy taal uitleggen? Ik weet bv niet wat een Body open tag is
Heb via magento connect wat kunnen dwnldn. Onder ‘conficuratiescherm’ zie ik ook ‘template manager, facebook like button’staan. Het is ook ingeschakeld, maar ik zie het nergens op de front end. Mis ik een stap?
Alvast bedankt voor de hulp!
Gr,
An
3 februari 2011 - 11:45
Hallo An,
Helaas is het niet veel makkelijker uit te leggen. Om bovenstaande uit te voeren heb je basis kennis van websites en HTML nodig. De Body tag is een onderdeel van de HTML code.
Ik heb de facebook extension voor Magento nog niet gebruikt maar ik heb even voor je gekeken en voor deze extension moet je ook een code in je “product page template” bestand plaatsen zodat je het aan de front-end kant ook ziet.
Hier staat het een en ander uitgelegd http://www.magentocommerce.com/magento-connect/TemplatesMaster/extension/3816/facebooklb/reviews#reviews
Succes!
16 februari 2011 - 14:50
hallo,
Als ik de bovenste code kopieer en plak in dreamweaver krijg ik een foutmelding over deze lijn?
FB.init({appId: ‘your app id’, status: true, cookie: true,
maar wat?
kan iemand mij dat vertellen.
Bij voorbaat dank
16 februari 2011 - 16:02
Hallo Miranda, Ik zie/weet zo snel even niet waar het fout gaat met dreamweaver, kunnen verschillende dingen zijn. Je kunt hier eens naar kijken http://www.adobe.com/cfusion/exchange/index.cfm?event=extensionDetail&extid=2149022 of zoeken in google op bijvoorbeeld “Facebook like button dreamweaver”. Succes!
25 april 2011 - 22:19
Mooie aanvulling! Ikzelf gebruik Addthis op mijn website. Gratis en veel groter bereik, check http://www.weatherservice.be/index.php en even naar onder scrollen.