Facebook like box op je WordPress website

De Facebook like box is niet meer. Facebook heeft in juni 2015 besloten dat het tijd werd voor iets anders. De Facebook like box heeft daarom plaats moeten maken voor de Facebook Page Plugin. In mijn blog ‘Facebook Page Plugin op je WordPress websitevertel ik je hoe je deze plugin kunt integreren op je WordPress website.

 

Als je een Facebook pagina hebt, is het handig om een Facebook like box op je WordPress website te plaatsen. Bezoekers weten dan direct dat je een Facebook pagina hebt, kunnen zien welke vrienden de pagina al geliked hebben en kunnen de pagina zelf ook liken. Maar hoe zet je die like box netjes op je website? Je kunt gebruik maken van (weer) een plugin, maar te veel plugins doen je website geen goed. Ik leg je in deze blog uit hoe je eenvoudig een Facebook like box op je WordPress website kunt plaatsen zonder gebruik te maken van een plugin.

Like box maken

Om de code voor je Facebook like box te maken, ga je naar de developers omgeving van Facebook: https://developers.facebook.com/docs/plugins/like-box-for-pages/. Vul bij ‘Facebook Page URL’ de link van je Facebook pagina in. Als je nog geen mooie link hebt, bezoek je je eigen pagina en kopieer je de link die in de browserbalk staat. Bij ‘Width’ vul je in hoe breed de like box moet worden. Als je de like box in je sidebar of footer gaat plaatsen, is ca 300px goed om mee te beginnen. Bij ‘Height’ kun je invullen hoe hoog de like box moet worden. Als je hier 250px invult, is er genoeg ruimte om twee rijtjes foto’s van personen te laten zien in je like box. Bij ‘Color Scheme’ kun je voor dark (antraciet) of light (lichtgrijs) kiezen.

Facebook like box op je WordPress website

Er zijn vier opties die je aan kunt vinken om wel of niet in je like box te tonen:

  • Show Friends’ Faces: toon de gezichten van vrienden die de pagina al geliked hebben
  • Show Posts: toon de nieuwste berichten die je op je Facebook pagina geplaatst hebt
  • Show Header: laat een header zien met de profielfoto van je pagina
  • Show Border: toon een rand om de like box

Facebook like box uitleg

Vink aan wat je wilt laten zien en klik daarna op de button ‘Get code’. Je krijgt onderstaand scherm te zien. Bovenin staan vier opties, kies het tabblad ‘IFRAME’. Kopieer alle code van ‘<iframe…  tot iframe>’. Klik de pagina nog niet direct weg. Als je like box straks te breed of te hoog is, kun je dit direct aanpassen en de nieuwe code opvragen.

Facebook like box code

 

Facebook like box op je WordPress website plaatsen

Log in op je WordPress website en ga naar ‘Weergave’ – > ‘Widgets’. Bepaal waar je je like box wilt tonen (meest gebruikelijk is in de sidebar of in de footer). Klik aan de linkerkant op de widget ‘Tekst’, selecteer in welke widgetruimte je de like box wilt plaatsen en klik op ‘Widget toevoegen’. Je kunt de widget ook direct naar de widgetruimte slepen.

Facebook like box widget

Geef de widget een titel en plak in het tekstgedeelte daaronder de code die je gekopieerd hebt. Klik daarna op de knop ‘Opslaan’ en taa daa.. je hebt een Facebook like box op je WordPress website zonder een plugin te hebben gebruikt!

Facebook like box widget 2

Tijdens het schrijven van deze blog, heb ik direct een Facebook pagina voor webdesignenonlinemarketing.nl aangemaakt. Wil je op de hoogte blijven van onze tips & trucs? Like dan direct even de Facebook pagina!

 Is het gelukt om de Facebook like box op je WordPress website te plaatsen? Deel deze blog dan via social media met je vrienden zodat ook zij het kunnen leren!

10 antwoorden
  1. Dokter André Almere zegt:

    Het nadeel van de door Anne gepresenteerde “likeBox” vond ik de Link die daar in zit. Daarbij heb ik problemen met mijn Sidebars.
    Met deze sidebar van Facebook zelf is het me vrij eenvoudig gelukt
    Bedankt

    Beantwoorden
  2. sanne zegt:

    Wat handig om zo je Facebook likebox op mijn website te plaatsen. Weet je toevallig ook hoe je een Facebook likebox in een pagina kan integreren? Wil dat op de download pagina van mijn producten plaatsen. Dank je wel alvast!

    Beantwoorden
    • Rosanne zegt:

      Hi Sanne!

      In principe kun je dezelfde code ook gebruiken om een lixe box op een pagina te plaatsen. Is je download pagina een gewone tekstpagina of is het een pagina via een webshop systeem?

      Beantwoorden
    • Rosanne zegt:

      Goed dat het gelukt is Machteld! Naast de ‘vind ik leuk’-button staat ook een ‘delen’-button. Die kun je gebruiken om je website te delen. Als je een specifieke pagina wilt delen, kun je dat doen door de URL van die pagina te kopiëren en in een Facebook bericht te plakken. Je kunt ook social share buttons op je website plaatsen. Die zorgen er voor dat elke pagina en elk bericht individueel gedeeld kan worden op Facebook, maar ook op bv. Twitter, LinkedIn en Google+. Niet alleen handig voor jou, maar ook voor je bezoekers!

      Beantwoorden
  3. Margot zegt:

    Hoi Rosanne,

    Dank voor deze beschrijving, dat ging vrij gemakkelijk. Hij staat nog niet helemaal netjes in het kader van mijn sidebar, maar daar ga ik nog wel mee puzzelen, heeft meer met mijn website te maken denk ik. Ik krijg ook een geen 4 opties met Iframe etc, maar toch is het gelukt.

    Andere vraag, hij verschijnt in het Engels ik zou hem graag in het Nederlands dus met VIND IK LEUK ipv Like willen plaatsen. Bij jullie ziet hij er wel NL uit, heb jij enig idee hoe dat kan?

    Beantwoorden
    • Rosanne zegt:

      Hi Margot,

      Fijn dat het gelukt is! Hier kun je lezen hoe je de taal aan kunt passen. Helaas gaat Facebook de like box veranderen. Er moet daarom een andere code geplaatst worden op de website om de like box nog te tonen. Zie mijn Facebook-bericht over deze ontwikkeling.

      Beantwoorden

Plaats een Reactie

Meepraten?
Draag gerust bij!

Geef een reactie

Het e-mailadres wordt niet gepubliceerd. Verplichte velden zijn gemarkeerd met *