Wir bauen uns ein WordPress-Plugin




Muss es für eine kleine Mini-Aufgabe immer ein vor, meist unnötigen, Funktionen strotzendes Plugin sein? Nein, also macht man sich selbst an die Arbeit. Und hier ist der Weg zum eigenen, sehr kleinen Plugin.

Die Aufgabenstellung für das WordPress-Plugin

Ich habe ab und zu die Anforderung, in einen Beitrag ein Werbebanner einzubauen. Theoretisch ist das nicht weiter schwierig. Bannercode kopieren, in den Beitrag einfügen, fertig. Mit AdSense-Blöcken geht das problemlos, bei anderen Codes streicht der WordPress-Editor auch gerne mal einen Teil des erforderlichen HTML-Codes weg.
Hier also die Anforderung: Das Einfügen eines Werbemittelcodes an eine beliebige Stelle eines Beitrag per Shortcode.

Was wird benötigt?

WordPress ist mit PHP geschrieben. Diese Sprache ist weltweit die am meisten verbreitete Skriptsprache, macht Webseiten dynamisch und läuft auf dem Server. PHP gibt also nur das Ergebnis der auf dem Server programmierten Funktionen an den Browser weiter.

Der eigene Webserver

Verständlicherweise sollten die ersten Schritte nicht am offenen Herzen vorgenommen werden. Sprich: es empfiehlt sich für die Entwicklung eine Testumgebung einzurichten. Die besteht aus XAMPP inkl. einer WordPress-Installation. XAMPP ist ein Webserver, der auf dem heimischen Rechner läuft. Das ist weitgehend identisch zum Webhoster und darum ideal zum Testen. XAMPP kann hier heruntergeladen werden: apachefriends.org.

XAMPP - Der Webserver für Zuhause

XAMPP – Der Webserver für Zuhause

Der Code-Editor

Um ein PHP-Skript zu schreiben genügt eigentlich schon ein simpler Texteditor. Das wird aber schnell unübersichtlich, darum empfiehlt sich z.B. Visual Studio Code dafür. Das Programm von Microsoft ist kostenlos, Open-Source und bietet z.B. Syntax-Highlighting. Der Programmcode wird damit durch farbliche Anpassungen deutlich lesbarer – so lassen sich leichter Fehler entdecken.

Visual Studio Code

Visual Studio Code

Ein FTP-Programm

Um zum Finale hin das Plugin auch nutzen zu können, muss es natürlich in die „echte“ WordPress-Installation gelangen. Das geht natürlich über den in WordPress integrierten Upload, auf Dauer ist ein FTP-Programm aber bequemer, da die Dateien so einfach in den entsprechenden Ordner hochgeladen werden können.

Los geht’s: Das Plugin-Grundgerüst

Noch eine Sache vorweg, ehe wir in die Tasten hauen: Das Plugin wird keine besonderen Komfortmerkmale bieten und auch nicht in der Sidebar des WordPress-Admins erscheinen. Es erledigt einfach still und leise seinen Dienst im Hintergrund. Es ist aber natürlich dahingehend erweiterbar. Sollte daran Interesse bestehen, lässt sich dieser Artikel auch fortsetzen.

Wenn XAMPP und WordPress installiert sind, muss beides gestartet werden. Dazu muss natürlich zunächst der Webserver inklusive der Datenbank laufen, ehe auf WordPress zugegriffen werden kann. Die einfachste Lösung ist da das XAMPP-Control-Panel, was sich praktischerweise auch in der Taskleiste anheften lässt. Ich setze jetzt einfach mal voraus, dass eine WordPress-Installation keine allzu großen Hürden bereitet.
Ist XAMPP gestartet und WordPress installiert, muss im Browser nun die Adresse aufgerufen werden und der Ordner, in dem sich unser WordPress befindet.

https://localhost/wordpress/

Die Ordnerstruktur der WordPress-Beispielinstallation sieht jetzt wie folgt aus:

WordPress Plugin-Ordnerstruktur

Für unser Plugin habe ich jetzt den Ordner ad_adding angelegt, in den alle benötigten Dateien des Plugins landen. Es wird nur eine sein :-)

Die Plugins liegen immer im Ordner wp-content/plugins/. Einen anderen Ordner zu verwenden, ist nicht möglich. Theoretisch könnte auch jedes Plugin mit all seinen Dateien in /plugin/ liegen, der Übersichtlichkeit zuliebe sollte aber für jedes Plugin ein eigener Ordner existieren.
Das hat aber auch noch einen weiteren Grund, denn entscheiden sich mehrere Autoren dafür, die Hauptdatei Ihres Plugins index.php zu nennen, würden diese sich gegenseitig ziemlich übel ins Gehege kommen. Womit wir noch zu einem weiteren, wichtigen Punkt kommen…

… gleiche Namen von Dateien, Variablen und Funktionen vermeiden

Nehmen wir an, an mehreren Stellen des Plugins werden Euro in Dollar umgerechnet. Da dieses Vorgehen immer wieder gebraucht wird, ist es sinnvoll die Umrechnung in eine Funktion mit dem Namen convert() auszulagern, diese an der passenden Stelle aufzurufen und mit dem Wert der Umrechnung weiter zu arbeiten.
Klingt gut, ist auch wirklich praktisch. Allerdings hatte ein anderer Plugin-Programmierer die gleiche Idee und hat seine Funktion zur Umwandlung von Kleinbuchstaben in Großbuchstaben ebenfalls convert() getauft. Und, wie sollte es anders kommen? Natürlich geraten sich die beiden Plugins in die Haare und es kommt zu Fehlern.

Die gleiche Problematik besteht auch bei Variablen, nur das mitunter hier der Fehler nicht sofort als solcher ins Auge fällt. Wichtig ist es also, jeder neuen selbsterstellten Funktion oder Variablen ein festes Namensmuster voranzustellen, um diese Dopplungsfehlerquellen zu vermeiden. So ist für eine Funktion in diesem Beispiel-Plugin ein Funktionsname wie sh_ad_converter() auf jeden Fall besser als das pure converter().

WordPress-Erkennungsdienst

Ein Plugin für WordPress erfordert einen gewissen Grundaufbau. Ein Teil dieses Grundaufbaus sind Informationen zum Plugin, die dann auch in der Liste der Plugins angezeigt werden. Dieser Teil des Aufbaus befindet sich am Anfang der Hauptdatei und sieht so aus:

Diese Angaben befinden sich zwischen Kommentaren. Wichtige Angaben sind der Name für das Plugin, eine Beschreibung und der Name des Autors. Würde es dieses Plugin auf irgendeiner Webseite oder im WordPress-Plugin-Verzeichnis zum Download geben, würde diese Adresse bei Plugin-URI eingetragen. Gleiches gilt für die Auhor-URI.

Ok – soviel zu den Formalitäten. Die Datei sollte jetzt im Plugin-Ordner unter einem beliebigen Namen gespeichert werden. Ich habe dafür einfach den Namen index.php gewählt.

Den Werbemittelcode anzeigen lassen

Damit unser Plugin jetzt auch seine Aufgabe erfüllen kann, muss da natürlich außer den Informationen zum Plugin auch noch etwas Funktionalität reingebracht werden. Da das Plugin per Shortcode nur ein einfaches HTML-Snippet einfügen soll, definieren wir jetzt genau das.

Dazu muss WordPress erstmal mitgeteilt werden, dass hier ein neuer Shortcode vergeben werden soll. Dies erledigt die Funktion add_shortcode(). Die muss nicht von uns programmiert werden, denn die Funktion wird direkt von WordPress zur Verfügung gestellt.
Der Aufruf der Funktion erfordert zwei Parameter. Diese werden in den Klammern übergeben. Der erste ist der Shortcode an sich, der zweite ist die Funktion (die wir programmieren) die definiert, was passieren soll wenn der erste Parameter als Shortcode irgendwo auftaucht. Klingt wirr, geht aber schon ;-)

Also, unsere Funkion rufen wir so auf:

Jetzt weiß WordPress zwar, hier kommt ein Shortcode, aber anfangen kann es damit noch nichts. Darum benötigen wir jetzt folgende Funktion, die von obigem Befehl aufgerufen wird:

Auch dieser Funktion könnte man in den Klammern Parameter mitgeben, ist in unserem Fall aber nicht notwendig.
Das return zwischen den geschweiften Klammern ist für die Ausgabe des HTML-Codes zuständig. Zwischen den einfachen Anführungszeichen kann also jeder beliebige HTML-Code eingefügt werden und dieser wird dann auf der Seite angezeigt.

WordPress Shortcode-Ausgabe

Das es auch funktioniert, zeigt das nun folgende Werbebanner des Partnerprogramms AdCell:

[show_ad]

Fazit

Ja, die Sache ist erweiterungsfähig und würdig. Denn wenn ich verschiedene HTML-Snippets brauchen würde, müsste mit dieser Methode jedes Mal ein neues Plugin erstellt werden. Zusätzlich benötigt jede Änderung einen Eingriff in den Quelltext und ein erneutes Hochladen des Plugins. Aber es besteht die Möglichkeit es zu erweitern, um mehrere HTML-Snippets mit verschiedenen Shortcodes ausgeben zu können.
Mit Sicherheit gibt es sowas auch schon, möglicherweise mit einem riesigen Rattenschwanz an Funktionen hintendran, die keiner benötigt.

 

Merken

Merken

Merken

Merken

Merken

Merken

Merken




Ein Kommentar:

  1. Pingback:Livestreams – ein Trend über alle Branchen hinweg

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.