Der ultimative Leitfaden zur Implementierung von Facebook-Kommentaren in Ihrem Blog

Die Verwendung von Facebook-Kommentaren in Ihrem Blog bietet Ihren Lesern die Möglichkeit, Beiträge sofort zu kommentieren und sie ohne Arbeit zu teilen. Wenn Sie der Meinung sind, dass diese Art von Kommentarsystem für Ihr Publikum geeignet ist, lesen Sie weiter, um herauszufinden, wie Sie es implementieren können der richtige Weg.


Schritt 1: Erstellen Sie eine Facebook-App

Bevor Sie den Facebook-Kommentarcode generieren und in Ihrem Blog implementieren, müssen Sie eine App für Ihre Website erstellen.

  1. Gehen Sie zu Developers.facebook.com
  2. Klicken Apps
  3. Klicken Neue App erstellen
  4. Geben Sie eine App-Anzeigename und Namensraum

Auf dem nächsten Bildschirm sehen Sie Ihre neu erstellten Apps App-ID und App Secret Key. Sie benötigen den geheimen Schlüssel nicht, aber die App-ID wird später verwendet. Beachten Sie es.

Fahren Sie unter diesen Tasten fort und füllen Sie das aus Kontakt E-mail und App-Domäne (die Domain Ihres Blogs). Gehen Sie nach unten und klicken Sie auf Webseite. Geben Sie dieselbe Domäne ein, die Sie für die App-Domäne verwendet haben. Klicken Änderungen speichern.


Schritt 2: Fügen Sie den Facebook-Kommentarcode in Ihr Design ein

In diesem Tutorial implementieren wir Facebook-Kommentare neben dem standardmäßigen WordPress-Kommentarsystem, anstatt es zu ersetzen. Wenn Sie möchten, können Sie zum Code-Generator für Facebook-Kommentare wechseln, um den Code zu erhalten, den Sie zum Einfügen des Kommentarsystems benötigen. Ich habe es jedoch hier hinzugefügt, damit Sie es einfach kopieren können. Sie müssen jedoch einige Teile anpassen. Ich werde notieren, welche Teile dies für jeden Block sind.

Der nachstehende Codeblock sollte in Ihrem Theme eingefügt werden header.php Datei. Finde die Öffnung Markieren Sie den Block und fügen Sie ihn direkt darunter ein. Ersetzen Sie in der 6. Zeile "Ihre App-ID hier" durch Ihre App-ID.

 

Während du noch in deiner bist header.php Datei, gehe in die Abschnitt und fügen Sie diesen Codeblock irgendwo ein. Dadurch wird sichergestellt, dass das Facebook-Kommentarsystem in Ihren Blogbeiträgen weiß, dass es der zuvor erstellten App gehört. Ersetzen Sie das Bit "Ihre App-ID hier" durch Ihre App-ID (lassen Sie die Anführungszeichen unverändert)..

 

Der nächste Codeblock sollte in Ihrem Theme platziert werden comments.php Datei. Da wir Facebook-Kommentare implementieren neben Bei WordPress-Kommentaren fügen Sie sie einfach an der Stelle ein, an der das Facebook-Kommentarfeld angezeigt werden soll, und löschen den ursprünglichen Code nicht.

 

Wenn Sie Ihren Facebook-Kommentarcode aus dem Link generieren, den ich Ihnen zuvor gegeben habe, können Sie den Code ändern, anstatt ihn nur aus diesem Tutorial herauszuholen data-href Attribut von der ursprünglichen URL zu , Andernfalls funktionieren Facebook-Kommentare nicht.

Sie können das auch bearbeiten Daten-Nummer-Beiträge, Datenbreite, und Daten-Farbschema Attribute nach Ihrem Geschmack. Die erste definiert, wie viele Kommentare in jedem Beitrag angezeigt werden, bevor ein Benutzer auf "Weitere anzeigen" klicken muss, die zweite definiert die Breite des Kommentarsystems (legen Sie es auf etwas weniger als die Breite Ihres Inhaltsbereichs fest) und die letzte ist das Farbschema, das auf "hell" oder "dunkel" eingestellt werden kann.


Schritt 3: Zeigen Sie die kombinierte Anzahl der Facebook- und WordPress-Kommentare an

Ihr Thema hat höchstwahrscheinlich mehrere Bereiche, in denen die Anzahl der Kommentare zu einem Beitrag angezeigt wird. Standardmäßig wird nur die Anzahl der WordPress-Kommentare angezeigt. Da Sie jetzt Facebook-Kommentare neben WordPress-Kommentaren implementieren, möchten Sie die Summe der Kommentare beider Systeme in jedem Beitrag anzeigen.

Öffnen Sie dazu zuerst das Thema Functions.php Datei. Fügen Sie den unten gezeigten Code am Ende der Datei ein und speichern Sie ihn.

 // Kombinierte FB- und WordPress-Kommentarzählerfunktion erhalten full_comment_count () global $ post; $ url = get_permalink ($ post-> ID); $ filecontent = file_get_contents ('https://graph.facebook.com/?ids='. $ url); $ json = json_decode ($ filecontent); $ count = $ json -> $ url-> comments; $ wpCount = get_comments_number (); $ realCount = $ count + $ wpCount; if ($ realCount == 0 ||! isset ($ realCount)) $ realCount = 0;  return $ realCount; 

Hinweis: Dieser Code wurde aus einer Funktion aufgebaut, die von Viceprez in der WordPress Stack Exchange geschrieben wurde. Ich habe einfach ein paar Zeilen zu seiner ursprünglichen Funktion hinzugefügt, die den WordPress-Kommentarzähler hinzufügen. Danke, Viceprez!

Nachdem Sie nun die Funktion zu Ihrem Thema hinzugefügt haben, können Sie damit die ursprünglichen Kommentarzählerfunktionen ersetzen, die in Ihrem Thema verwendet werden. In meinem Thema werden die Kommentare mit folgendem Code aufgerufen:

 

Ihr Thema kann diese Funktion verwenden, um die Anzahl der Kommentare anzuzeigen, oder nicht. Sobald du was gefunden hast tut zeigen Sie es an, ersetzen Sie es durch diesen Code:

 

Es gibt wahrscheinlich mehrere Stellen in Ihrem Design, an denen Sie diesen Code einfügen müssen. Hier ist eine Liste der häufigsten:

  • Das comments.php Datei
  • In der Nähe Ihres single.php Datei
  • Das index.php - Es befindet sich in der Schleife, die jeden Beitrag aufruft
  • Alle Archivdateien mögen Archiv.php, category.php, author.php, usw. In diesem Bereich wird es in der Schleife angeordnet, die auch jeden Beitrag aufruft.
  • Auf search.php
  • Auf page.php wenn Sie Kommentare zu Seiten zulassen

Wenn der Kommentar in Ihrem zählt comments.php Wird als Satz angezeigt. Anstelle einer Zahl können Sie anstelle des einzeiligen Funktionsaufrufs den folgenden Code verwenden, um Wörter wie "keine Kommentare" und "einen Kommentar" zuzulassen. Ich habe meine angepasst, um einladender zu sein - ich würde empfehlen, dass Sie dasselbe tun, anstatt generisch zu sein :)

 Noch keine Kommentare - Sie sollten die Diskussion beginnen!';  else if ($ commentCount == 1) echo '
Ein Kommentar bisher - fügen Sie Ihren hinzu!
'; else echo '
'. $ commentCount 'Kommentare bisher - fügen Sie Ihre!
'; ?>

Schritt 4: Erhalten Sie sofortige Benachrichtigungen über neue Kommentare

Im letzten Teil des Lernprogramms erfahren Sie, wie Sie Benachrichtigungen von Facebook erhalten, wenn jemand Kommentare zu Ihrem Blog enthält.

Als erstes müssen Sie auf das Moderationsfenster für Kommentare zugreifen. Sie können dies tun, indem Sie die folgende URL in Ihren Browser einfügen und "Ihre App-ID hier" durch Ihre App-ID ersetzen. Sie können diese Seite auch zu Ihren Lesezeichen hinzufügen, wenn Sie gerade dabei sind.

https://developers.facebook.com/tools/comments/?id=Ihre App-ID hier

Sobald Sie sich in der Moderationsleiste für Kommentare befinden, klicken Sie auf die Schaltfläche die Einstellungen Taste in der oberen rechten Ecke. Ein Fenster wird geöffnet und Sie sollten ein Fenster sehen Moderatoren Feld in der Mitte. Fügen Sie sich einfach als Moderator hinzu und Sie erhalten Benachrichtigungen, wenn jemand einen Blogbeitrag kommentiert.


Fazit

Wenn Sie alle Schritte in diesem Lernprogramm befolgt haben, sollten in Ihrem Blog jetzt Facebook-Kommentare neben dem Standard-Kommentarsystem von WordPress implementiert sein. Ich glaube, dass dies ein ideales Setup ist, da es Ihren Lesern das Beste aus beiden Welten bietet. Facebook-Kommentare sind wahrscheinlich das bequemste Kommentarsystem, wenn ein Leser bei Facebook angemeldet ist (was höchstwahrscheinlich der Fall ist), dann gibt es absolut keine Authentifizierungs- oder Identifikationsfelder, die ausgefüllt werden müssen. Sie können einfach wegkommentieren. Wenn ein Leser jedoch nicht Facebook verwenden möchte oder seinen Link hinzufügen oder die Vorteile von CommentLuv nutzen möchte, können Sie trotzdem WordPress-Kommentare verwenden.

Sie haben jetzt auch eine Kommentaranzahl für jeden Beitrag, die die Summe der Kommentare aus jedem System anzeigt. Da Sie ein Moderator für Ihre App sind, erhalten Sie sofort Benachrichtigungen über neue Kommentare. Ich hoffe, Sie genießen Ihre neue und verbesserte Kommentierungslösung!