För dem som har följt Facebook F8-utvecklarkonferensen, borde du veta att Facebook-vd Mark Zuckerberg hade officiellt lanserat Open Graph-protokollet och de sociala pluginsna. Att vara efterföljare av Facebook Connect, dessa två saker kommer att förändra hela bollspelet och ge webben " socialness " till en helt ny nivå.

För de som fortfarande inte vet är det nya Open Graph-protokollet och de sociala pluginsna uppsatta verktyg som nyligen lanserats av Facebook, som gör att du kan integrera Facebook djupt i din webbplats och göra din webbplats mer "sällskaplig". Saker som "Like" -knappen kan nu enkelt läggas till på din sida och låta dina användare dela innehållet i sitt Facebook-konto.

Hur lägger jag till en "Gilla" -knapp till min webbplats? (Det enkla sättet)

För att lägga till en "Gilla" -knapp klistra du helt enkelt in följande iframe-kod till någon del av sidan (eller den plats där du vill att den ska visas).

För att ändra inställningen för "Gilla" -knappen, gå till den här Facebook-liknande-knappen, anpassa inställningen, ta iframe-koden och klistra in den på din webbplats.

Alternativt kan du installera liknande plugin som kan automatisera de flesta av de grundläggande grejerna för dig.

Är det allt? Vad händer om jag vill ha mer?

Du bad om det. Så här är du, metoden för att integrera Facebook djupt i din webbplats (och göra din webbplats till en social graf).

Det finns i princip två sätt att implementera Facebook sociala plugins på din webbplats:

  1. iFrame
  2. xfbml

Jag rekommenderar att du använder XFBML eftersom det låter dig komma åt hela det breda utbudet av plugins. Följande metod kommer att göras med hjälp av XFBML-protokollet.

1. Registrera en Facebook-app

Oroa dig inte, vi behöver inte du lära dig programmering och piska upp en annons. Allt du behöver göra här är att registrera dig för en Facebook-app (Kort sagt, fyll bara i ett formulär och skicka in det).

Gå till Facebook Application Creation sida och skapa en app (du måste logga in på ditt Facebook-konto).

När applikationen är skapad framgångsrikt ser du din applikationspanel. Spela in ansöknings-id (du kommer att använda det senare).

2. Lägga till anpassad tagg

Nu går du till tematmappen och öppnar header.php- filen. Ändra taggen till följande:

 > 

3. Lägga till anpassade metakoder till din tagg

Fortfarande i din header.php, lägg till följande rad mellan taggen.

Obs :

  • Kom ihåg att ändra allt CAPS-fältet till din webbplatsinställning i metataggarna.
  • För att ta reda på vad som är din Facebook USER_ID, gå till http://graph.facebook.com/your-username . Du kommer att se ditt FB-användar-ID.

  • Kolla in den här sidan för fullständig förklaring av metataggarna och andra metataggar som du kan inkludera

4. Lägga till javascript sdk

För att kunna använda XFBML måste vi lägga till javascript SDK i din tagg.

Lägg till följande rader direkt efter taggen.

Nu måste du ersätta " DITT APP-ID " med det program-ID som du skapat just nu.

5. Välj de sociala plugins som du vill använda

Gå till Facebook Social Plugins webbplats, du kommer att se en rad verktyg som du kan implementera på din webbplats.

Gilla knapp : Visa en "Gilla" -knapp på din webbplats. Det vanligaste plugin.
Rekommendationer : Visa användare personliga förslag till sidor på din webbplats som de kanske vill.
Logga in med Ansikter : Låt användarna registrera sig på din webbplats med sitt Facebook-konto. Det visar också en lista över användarens vänner som också har anmält sig till din webbplats.
Kommentarer : Tillåt användare att kommentera din webbplats. Kommentarerna kommer också att skickas tillbaka till användarnas Facebook-vägg.
Aktivitetsflöde : visar användarna vad deras vänner gör på din webbplats genom gillar och kommentarer.
Som Box : Det här är tidigare känt som Fan-boxen.
Facepile : Visar profilbilder av användarens vänner som redan har anmält sig till din webbplats.
Live Stream : Låt dina användare dela aktivitet och kommentarer i realtid när de interagerar under en live-händelse.

6. Konfigurera de sociala plugins

Välj det sociala plugin du vill använda på din webbplats. I det här exemplet kommer jag att använda "Like" -knappen eftersom den är den vanligaste bland alla.

Klicka på knappen Liknande knapp

Konfigurera inställningarna för "Gilla" -knappen. Lämna URL-fältet tomt. Klicka på knappen " Få kod " i slutet för att ta tag i källkoden.

Markera och kopiera XFBML- koden

Klistra in det på platserna (antingen i widgets-området eller single.php- filen) där du vill att "Gilla" -knappen ska visas.

Gör detsamma för alla andra sociala plugins som du använder.

Det är allt!

Implementering av sociala plugins i MakeTechEasier

"Gilla" -knappen för varje postinmatning

Gilla box i sidofältet

Rekommendera rutan i postfoten

referenser

Här är några användbara länkar till din referens:

  • Facebook OpenGraph protokoll
  • Facebook Javascript SDK
  • Facebook sociala plugins
  • Facebook Application Dashboard

Om du tycker att det här inlägget är användbart, glöm inte att " Gilla " det och dela det med dina vänner. Låt oss veta i kommentarerna hur du använder de sociala plugins på din webbplats.