Voor degenen die Facebook F8 ontwikkelaarsconferentie hebben gevolgd, moet u weten dat Facebook-CEO Mark Zuckerberg officieel de lancering van het Open Graph-protocol en de sociale plug-ins heeft aangekondigd. Als de opvolgers van Facebook Connect gaan deze twee dingen het hele balspel veranderen en brengt het internet " socialness " naar een geheel nieuw niveau.

Voor degenen die zich nog steeds niet bewust zijn, zijn het nieuwe Open Graph-protocol en de sociale plug-ins set tools die Facebook onlangs heeft geïntroduceerd en waarmee u Facebook diep in uw site kunt integreren en uw site socialer kunt maken. Dingen zoals de knop "Vind ik leuk" kunnen nu eenvoudig aan uw pagina worden toegevoegd en uw gebruikers in staat stellen uw inhoud te delen in hun Facebook-account.

Hoe voeg ik een "Vind ik leuk" -knop toe aan mijn site? (De makkelijke manier)

Om een ​​"Vind ik leuk" -knop toe te voegen, plakt u eenvoudig de volgende iframe-code in elk deel van de pagina (of de locatie waar u het wilt laten verschijnen).

Om de instelling van de "Vind ik leuk" -knop te veranderen, ga naar deze Facebook-knop Vind ik leuk, verander de instelling, pak de iframe-code en plak deze op uw site.

Of installeer de Like-plugin die de meeste basisvoedingen voor u kan automatiseren.

Is dat alles? Wat als ik meer wil?

Je hebt erom gevraagd. Dus hier ben je, de methode om Facebook diep in je site te integreren (en van je site een sociale grafiek te maken).

Er zijn in principe twee manieren om sociale Facebook-plug-ins op uw site te implementeren:

  1. iFrame
  2. XFBML

Ik zou aanraden om XFBML te gebruiken, omdat je hiermee toegang hebt tot het hele scala aan plug-ins. De volgende methode wordt uitgevoerd met behulp van het XFBML-protocol.

1. Registreer een Facebook-app

Maak je geen zorgen, we hebben je niet nodig om te leren programmeren en een advertentie op te zetten. Het enige dat u hier hoeft te doen, is u aanmelden voor een Facebook-app (kortom, u vult een formulier in en verstuurt het in).

Ga naar de pagina voor het maken van Facebook-apps en maak een app (u moet zich aanmelden bij uw Facebook-account).

Nadat de toepassing is gemaakt, ziet u uw toepassingsdashboard. Noteer de applicatie-ID (u zult deze later gebruiken).

2. Aangepaste tag toevoegen

Ga nu naar je Themamap en open het bestand header.php . Verander de tag naar het volgende:

 > 

3. Aangepaste metatags toevoegen aan uw tag

Voeg nog steeds in je header.php de volgende regel toe tussen de tag.

Opmerking :

  • Vergeet niet om het CAPS-veld te veranderen in uw site-instelling in de metatags.
  • Als je wilt weten wat je Facebook USER_ID is, ga je naar http://graph.facebook.com/your-username . U ziet uw FB-gebruikers-ID.

  • Bekijk deze pagina voor een volledige uitleg van de metatags en andere metatags die u kunt opnemen

4. Toevoegen van javascript sdk

Om gebruik te maken van de XFBML, moeten we de javascript SDK aan uw tag toevoegen.

Voeg de volgende regels direct achter de tag toe.

Nu moet u " UW APP-ID " vervangen door de applicatie-ID die u zojuist hebt gemaakt.

5. Kies de sociale plug-ins die u wilt gebruiken

Ga naar de Facebook social plugins-site, je ziet een reeks tools die je kunt implementeren op je site.

Knop Vind ik leuk : toon een knop 'Vind ik leuk' op uw site. De meest gebruikte plug-in.
Aanbevelingen : geef gebruikers gepersonaliseerde suggesties voor pagina's op uw site die ze misschien leuk vinden.
Inloggen met gezichten : sta toe dat gebruikers zich aanmelden bij uw site met hun Facebook-account. het toont ook een lijst met de vrienden van de gebruiker die zich ook hebben aangemeld voor uw site.
Opmerkingen : sta gebruikers toe commentaar te geven op uw site. De opmerkingen worden ook teruggeplaatst op de Facebook-muur van gebruikers.
Activiteitenfeed : laat gebruikers zien wat hun vrienden op uw site doen via vind-ik-leuks en opmerkingen.
Like Box : dit is eerder de Fan-box genoemd.
Facepile : toont profielfoto's van de vrienden van de gebruiker die zich al hebben aangemeld voor uw site.
Livestream : hiermee kunnen uw gebruikers activiteiten en opmerkingen in realtime delen tijdens een live evenement.

6. Configureer de sociale plug-ins

Kies de sociale plug-in die u op uw site wilt gebruiken. In dit voorbeeld zal ik de knop "Vind ik leuk" gebruiken, omdat dit de meest gebruikte is.

Klik op de koppeling Leuk Knop

Configureer uw "Vind ik leuk" -knop-instellingen. Laat het URL veld leeg. Klik aan het einde op de knop " Get Code " om de broncode te bemachtigen.

Markeer en kopieer de XFBML- code

Plak het op de plaatsen (in het widgetsgebied of het single.php- bestand) waar u de "Vind ik leuk" -knop wilt laten verschijnen.

Doe hetzelfde voor andere sociale plug-ins die u gebruikt.

Dat is het!

Implementatie van sociale plug-ins in MakeTechEasier

"Vind ik leuk" -knop voor elk bericht

Zoals een vak in de zijbalk

Beveel het vakje aan in de voettekst van het bericht

Referenties

Hier zijn enkele nuttige links voor uw referentie:

  • Facebook OpenGraph-protocol
  • Facebook Javascript SDK
  • Facebook sociale plug-ins
  • Facebook-toepassingsdashboard

Als je dit bericht nuttig vindt, vergeet dan niet het te " liken " en te delen met je vrienden. Laat ons in de reacties weten hoe u gebruik hebt gemaakt van de sociale plug-ins op uw site.