Hoe kan ik de Facebook Like widget gebruiken op mijn eigen website?

Gisteren lanceerde de immens populaire sociale netwerksite Facebook hun nieuwe Facebook Like widget. Met behulp van deze widget kunnen website bezoekers die een Facebook account hebben op een eenvoudige manier jouw website aanraden aan hun vrienden op Facebook. En het enige wat jij nodig hebt is een beetje HTML kennis om ook deze widget toe te voegen aan jouw website!

De Facebook Like widget in detail

Hieronder een voorbeeld van de nieuwe widget op CNN:

Facebook Like widget op CNN

Nog een beter voorbeeld van een passend gebruik van deze widget is te vinden op IMDb.com waar bezoekers zaken als films, acteurs en actrices met een druk op de knop kunnen aanraden aan hun Facebook vrienden:

Facebook Like widget op IMDb

Op de profiel pagina van de bezoeker is dan het volgende zichtbaar voor zijn of haar Facebook vrienden:

Facebook Like widget

De Facebook Like widget toevoegen aan uw website

Gelukkig heeft Facebook het voor website eigenaren erg gemakkelijk gemaakt om de Facebook Like widget toe te voegen aan een. Neem bijvoorbeeld de onderstaande code:

<iframe src="http://www.facebook.com/widgets/like.php?href=http://www.renaissance.nl/node/102"
        scrolling="no" frameborder="0"
        style="border: none; width:450px; height:80px"></iframe>

Deze paar regels code zijn genoeg om de Facebook Like widget toe te voegen aan een pagina. Het gedeelte na de href= is het adres van de pagina die aangeraden wordt. Dit zal in de meeste gevallen het adres zijn van de pagina waar de widget op dient te komen.

Hieronder staat een werkend voorbeeld van de widget voor dit artikel. Probeer gerust de widget uit als je een Facebook account hebt door op de Vind ik leuk knop te klikken.

De Facebook Like widget verder uitbreiden

Uiteraard is dit niet alles wat mogelijk is en kan de widget aangepast worden naar jouw behoeften. De makkelijkste manier om deze mogelijkheden te ontdekken is om gebruik te maken van de Facebook Like widget generator. Met deze tool kan je aan de hand van een aantal keuzevragen jouw widget helemaal zelf samenstellen en wordt de benodigde HTML code voor je aangemaakt.

Mocht je toch zelf aan de slag willen, heb ik hieronder nog een tweetal voorbeelden geplaatst:

Compacte versie

Door layout=button_count toe te voegen aan het iframe source adres, kun je een compacte versie krijgen van de widget:

<iframe src="http://www.facebook.com/plugins/like.php?href=http://www.renaissance.nl/node/102&layout=button_count" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:450px; height:px"></iframe>

Resultaat:

Gebruikersafbeeldingen verbergen

Door show_faces=false toe te voegen aan het iframe source adres, zullen er geen gebruikersafbeeldingen getoond worden door de widget:

<iframe src="http://www.facebook.com/plugins/like.php?href=http://www.renaissance.nl/node/102&show_faces=false" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:450px; height:px"></iframe>

Resultaat:

Vragen?

Mocht je nog vragen of opmerkingen hebben, dan hoor ik ze uiteraard graag.

Over de auteur
User picture

Geoffrey de Vlugt is hoofd project ontwikkeling en systeembeheer bij Renaissance. Als hij niet aan het werk is, is hij toch nog te vinden achter zijn notebook.

Vragen? Bel dan 071 5724203

Geoffrey de Vlugt's tweets

  • 16 Antieke techcadeautjes | Computerworld http://t.co/r4osVjW via @AddThis 7 jaren 18 weken ago
  • Cool! Android 2.2 (Froyo) is now available for my unbranded HTC Legend! Updating my phone right now... 7 jaren 19 weken ago
  • Wat hebben we trouwens aan de JSF als we geen defensie personeel meer hebben omdat we ze zojuist hebben weg bezuinigd (lees ontslagen)? 7 jaren 20 weken ago
  • Flikker overigens op met die JSF. We kunnen ONS belastinggeld een stuk beter gebruiken, meneer Hillen. 7 jaren 20 weken ago
  • Als die Teeven en de overheid nu gewoon toegeven dat ze controle willen over het internet, vooral na WikiLeaks... 7 jaren 20 weken ago
Dell Registered Partner SIDN deelnemer