Wenn Ihre Website über eine Facebook-Seite verfügt, empfiehlt es sich, Ihre Leser für diese Website zu werben, indem Sie ein Facebook-ähnliches Feld in der Seitenleiste des Blogs anzeigen.
In diesem Tutorial erstellen wir ein WordPress-Widget, das Ihre Facebook-ähnliche Box anzeigt. Mit diesem WordPress-Widget haben Sie die Möglichkeit, den Boxheader anzuzeigen, Ihre neuesten Fans anzuzeigen und Ihren neuesten Facebook-Stream anzuzeigen.
Facebook-Seiten gibt es bereits seit einiger Zeit, und sie wurden vor kurzem in die neue Timeline-Funktion konvertiert, um Ihre bisherigen Beiträge in Ihrem Profil noch stärker hervorzuheben.
Eine Facebook-Seite ist das gleiche wie eine persönliche Seite, aber Sie können keine anderen Personen anfreunden. Dies liegt daran, dass die Facebook-Seiten für Unternehmen eine Verbindung zu ihren Kunden herstellen.
Facebook-Seiten bieten Ihnen eine dynamischere Beziehung zu den Personen und Organisationen, an denen Sie interessiert sind.
Wenn Sie Ihr eigenes Geschäft haben, können Sie auch Ihre eigene Facebook-Seite erstellen.
Eine Facebook-Like-Box ist ein Social-Plugin, mit dem Besitzer einer Facebook-Seite einen Like-Button und einen Status-Stream auf ihrer eigenen Website anzeigen können.
Die Like-Box bedeutet, dass Besucher Ihrer Website Folgendes können:
Hier ist ein Beispiel für eine Facebook-Box von Wptuts +.
Um eine Facebook-Like-Box für Ihre Facebook-Seite zu erstellen, müssen Sie eine Facebook-App registrieren, um die Open Graph-API von Facebook verwenden zu können.
Jetzt sehen Sie, was die Facebook-Box ist. Wir können verstehen, wie Sie daraus ein WordPress-Widget machen können.
Bevor wir mit der Codierung des Widgets beginnen, müssen wir verstehen, was ein WordPress-Widget ist und wie wir mit der WordPress-Widget-API problemlos WordPress-Widgets erstellen können.
Ein WordPress-Widget ist ein Teil von PHP-Code, der in einer WordPress-Seitenleiste ausgeführt wird.
Eine WordPress-Seitenleiste ist ein registrierter Bereich in Ihrem Design, in dem Sie WordPress-Widgets hinzufügen können.
WordPress-Widgets können einfach zu den Seitenleisten hinzugefügt werden, indem Sie im Dashboard auf die Widget-Seite gehen und dort navigieren Darstellung -> Widgets. Von dieser Widgets-Seite können Sie Widgets in eine Seitenleiste Ihrer Wahl ziehen. Das Widget sollte über eine Art Admin-Formular verfügen, damit Sie die vom Widget angezeigten Daten bearbeiten können.
WP_Widget
Um ein WordPress-Widget zu erstellen, müssen Sie lediglich den Standard übernehmen WP_Widget
Klasse und nutzen einige seiner Funktionen.
Es gibt drei Hauptfunktionen, die für das Widget verwendet werden müssen, um diese Funktionen auszuführen bilden()
, Widget ()
und aktualisieren()
.
Das WP_Widget
Klasse befindet sich in wp-includes / widgets.php.
Nachfolgend finden Sie die Zwischenablage eines WordPress-Widgets. Wenn Sie ein neues Widget erstellen, kopieren Sie den folgenden Code und fügen Sie ihn als Ausgangspunkt für Ihr Widget ein.
/ ** * Foo_Widget-Widget hinzufügen. * / class Foo_Widget erweitert WP_Widget / ** * Widget mit WordPress registrieren. * / public function __construct () parent :: __ construct ('foo_widget', // Basis-ID 'foo_Widget'), // Namensarray ('description' => __ ('A Foo Widget', 'text_domain'),) / / Args); / ** * Frontend-Anzeige des Widgets. * * @see WP_Widget :: widget () * * @param array $ args Widgetargumente. * @param array $ instance Gespeicherte Werte aus der Datenbank. * / public Funktions-Widget ($ args, $ instance) extract ($ args); $ title = apply_filters ('widget_title', $ instance ['title']); echo $ before_widget; if (! empty ($ title)) echo $ before_title. $ title $ after_title; Hallo, Welt!
Erstellen von Facebook Like Box Widget
Wir werden ein WordPress-Widget erstellen, mit dem Sie auf einfache Weise eine Facebook-ähnliche Box in Ihrem WordPress-Blog hinzufügen und ändern können.
Der Vorteil der Verwendung eines Widgets liegt in der Flexibilität, die es Ihnen bietet. Die Auswahl, die Sie in Ihrer Like-Box von Facebook haben, ermöglicht Ihnen die vollständige Änderung der Funktionalität, indem Sie einfach unterschiedliche Attribute in die Like-Box setzen.
Die Facebook-Like-Box nimmt die folgenden Attribute an:
data-href
- Die URL zu Ihrer Facebook-Seite.Datenbreite
- Die Breite der Like-Box.Daten-Show-Gesichter
- Ein wahrer oder falscher Wert, der entscheidet, ob Personen angezeigt werden, die Ihre Seite mögen.Datenstrom
- Ein wahrer oder falscher Wert, der entscheidet, ob Sie Ihre neuesten Statusaktualisierungen anzeigen möchten.Datenkopf
- Ein wahrer oder falscher Wert, der entscheidet, ob Sie uns in der Facebook-Leiste finden.Dies sind die Optionen, die erforderlich sind, um sicherzustellen, dass der Benutzer im Widget-Admin-Bildschirm Änderungen vornehmen kann, damit er das Aussehen der Like-Box direkt im WordPress-Dashboard ändern kann.
Jetzt wissen wir, was wir von der Facebook-Box erwarten können, und wir können mit der Codierung beginnen.
Zuerst registrieren wir das Widget im widget_init
Aktion.
/ * * Name des Plugins: Paulund Facebook Like Box * Plugin-URI: http://www.paulund.co.uk * Beschreibung: Ein Widget, das einer Facebook-ähnlichen Box für Ihre Website entspricht. * Version: 1.0 * Autor: Paul Underwood * Author URI : http://www.paulund.co.uk * Lizenz: GPL2 Copyright 2012 Paul Underwood Dieses Programm ist freie Software; Sie können es unter den Bedingungen der GNU General Public License, Version 2, wie von der Free Software Foundation veröffentlicht, weitergeben und / oder ändern. Dieses Programm wird in der Hoffnung verteilt, dass es nützlich ist, jedoch OHNE JEDE GARANTIE; sogar ohne die implizite Garantie der MARKTFÄHIGKEIT oder EIGNUNG FÜR EINEN BESTIMMTEN ZWECK. Weitere Informationen finden Sie in der GNU General Public License. * / / ** * Widget registrieren * / add_action ('widgets_init', create_function (", 'register_widget (" pu_facebook_widget ");'));
Das register_widget
Funktion ruft die pu_facebook_widget
Klasse. Im Konstruktor können wir das Widget erstellen, indem Sie Argumente an den übergeben WP_Widget
Konstrukteur.
/ ** * Erstellen Sie die Widget-Klasse, und erweitern Sie die WP_Widget-Klasse. * / Class. Pu_facebook_widget erweitert WP_Widget / ** *. Widget mit WordPress registrieren. * / public function __construct () parent :: __ construct ('pu_facebook_widget', // Basis-ID 'Facebook Like Box'), // Namensfeld ('classname' => 'pu_facebook_widget', 'description' => __ ('A Widget, das ein Facebook-ähnliches Feld auf Ihrer Facebook-Seite anzeigt. ',' framework '))); // Endkonstruktor
Die Widget-Funktion wird aufgerufen, um das Widget in der Seitenleiste auszugeben. Hier müssen wir die vom Benutzer eingegebenen Daten im Dashboard sammeln und das Widget auf der Website anzeigen.
Verwenden Sie die folgende Funktion, um Ihre Facebook-Like-Box anzuzeigen.
/ ** * Frontend-Anzeige des Widgets. * * @see WP_Widget :: widget () * * @param array $ args Widgetargumente. * @param array $ instance Gespeicherte Werte aus der Datenbank. * / public Funktions-Widget ($ args, $ instance) extract ($ args); / * Unsere Variablen aus den Widget-Einstellungen. * / $ this-> widget_title = apply_filters ('widget_title', $ instance ['title']); $ this-> facebook_id = $ instance ['app_id']; $ this-> facebook_username = $ instance ['page_name']; $ this-> facebook_width = $ instance ['width']; $ this-> facebook_show_faces = ($ instance ['show_faces'] == "1"? "true": "false"); $ this-> facebook_stream = ($ instance ['show_stream'] == "1"? "true": "false"); $ this-> facebook_header = ($ instance ['show_header'] == "1"? "true": "false"); add_action ('wp_footer', array (& $ this, 'add_js')); / * Zeigt den Widget-Titel an, wenn einer eingegeben wurde (davor und danach durch Themen definiert). * / if ($ this-> widget_title) echo $ this-> widget_title; / * Like Box * /?>Möglicherweise haben Sie bemerkt, dass wir eine Aktion hinzufügen
wp_footer
um die Funktion auszuführenadd_js
. Hier müssen Sie das JavaScript von Facebook hinzufügen, damit die Like-Box korrekt funktioniert./ ** * Facebook-Javascripts hinzufügen * / public function add_js () echo ' ';Aktualisierungsfunktion
Die Aktualisierungsfunktion wird verwendet, um die WordPress-Datenbank zu aktualisieren, wenn das Widget-Verwaltungsformular gesendet wird.
Hier müssen Sie die erforderlichen Werte für die Werte des Formulars eingeben. Dies erfordert zwei Parameter, ein Array von Werten, die zum Speichern gesendet werden, und ein Array von Werten, die aktuell gespeichert werden. Die Rückgabe dieser Funktion sind die neuen Werte, die in der Datenbank gespeichert sind.
/ ** * Bereinigung der Widget-Formularwerte beim Speichern. * * @see WP_Widget :: update () * * @param array $ new_instance Werte, die gerade zum Speichern gesendet werden. * @param array $ old_instance Zuvor gespeicherte Werte aus der Datenbank. * * @return array Aktualisierte sichere Werte zum Speichern. * / Funktionsaktualisierung ($ new_instance, $ old_instance) $ instance = $ old_instance; / * Tags für Titel und Namen entfernen, um HTML zu entfernen (wichtig für Texteingaben). * / $ instance ['title'] = strip_tags ($ new_instance ['title']); $ instance ['app_id'] = strip_tags ($ new_instance ['app_id']); $ instance ['page_name'] = strip_tags ($ new_instance ['page_name']); $ instance ['width'] = strip_tags ($ new_instance ['width']); $ instance ['show_faces'] = (bool) $ new_instance ['show_faces']; $ instance ['show_stream'] = (bool) $ new_instance ['show_stream']; $ instance ['show_header'] = (bool) $ new_instance ['show_header']; $ Instanz zurückgeben;Formularfunktion
Mit der Formularfunktion wird das Formular im Widget-Dashboard erstellt. Hierfür müssen die aktuellen Werte in der Datenbank vorab ausgefüllt werden, sodass der Benutzer die Werte leicht ändern kann, um das Widgetverhalten zu ändern.
/ ** * Erstellen Sie das Formular für das Widget admin * * @see WP_Widget :: form () * * @param array $ instance Zuvor gespeicherte Werte aus der Datenbank. * / function form ($ instance) / * Richten Sie einige Standard-Widget-Einstellungen ein. * / $ defaults = array ('title' => $ this-> widget_title, 'app_id' => $ this-> facebook_id, 'page_name' => $ this-> facebook_username, 'width' => $ this-> facebook_width , 'show_faces' => $ this-> facebook_show_faces, 'show_stream' => $ this-> facebook_stream, 'show_header' => $ this-> facebook_header); $ instance = wp_parse_args ((array) $ instance, $ defaults); ?>
/>
/>
/>
Sie müssen keine Schaltfläche zum Senden hinzufügen, da sie von WordPress automatisch hinzugefügt wird.
Herunterladen
Das ist alles, was Sie brauchen, um ein WordPress-Plugin zu erstellen, das ein Widget erstellt, um Ihre Facebook-ähnliche Seite anzuzeigen. Jetzt müssen Sie nur noch das Plugin installieren, aktivieren, das Widget zu einer Seitenleiste hinzufügen und das Formular mit Ihren Seitendetails ausfüllen.
Sie können dieses Plugin von WordPress.org herunterladen: Laden Sie das Facebook Like Box Plugin herunter