Möchten Sie ein WordPress-Plugin erstellen? Dieses Tutorial zeigt Ihnen, wie es geht.

Plugins tragen zur Popularität von WordPress bei, da sie es Nutzern ohne Programmierkenntnisse ermöglichen, beeindruckende Websites zu erstellen.

Es gibt über 50 Plugins in der rWordPress-Verzeichnis  für verschiedene Zwecke konzipiert. Sie finden WordPress-Plugins für Newsletter-Abonnement Sicherheit et  E-Commerce . Nennen Sie es einfach.

Ohne Plugins ist eine WordPress-Website lediglich eine Sammlung statischer Bilder und Textblöcke. Mit Plugins lässt sich das Content-Management-System jedoch unglaublich individuell anpassen.

Egal, ob Sie ein individuelles Plugin für Ihre Website benötigen oder ein WordPress-Plugin erstellen und damit Geld verdienen möchten, legen wir los.


Inhalt


Fragen fréquemment posées

Verdienen WordPress-Plugins Geld?

Ja. WordPress-Plugins verdienen Geld. Sie können das Plugin auf Ihrer Website oder auf einem Drittanbieter-Marktplatz verkaufen.

CodeCanyon Themeforest und Mojo Marktplatz  sind die 3 besten Websites, um Plugins zu verkaufen.

Sie können dem WordPress-Repository auch eine kostenlose Version Ihres Plugins hinzufügen und eine Premium-Version mit zusätzlichen Funktionen anbieten.

Ist es schwierig, WordPress-Plugins zu erstellen?

Das Erstellen eines WordPress-Plugins ist relativ einfach und schwierig, abhängig von der gewünschten Funktionalität.

Das Erstellen eines Plugins ist einfach, wenn Sie bereits mit den Grundlagen der WordPress-Entwicklung und PHP-Programmierung vertraut sind. Wenn nicht, kann es sehr schwierig werden. Beginnen Sie am besten mit einem einfachen Plugin, wie in dieser Anleitung gezeigt.

Wie viel verdienen Plugin-Entwickler?

Laut Zip Recruiter beträgt der durchschnittliche Stundensatz für WordPress-Plugin-Entwickler in den USA 35 US-Dollar pro Stunde. Das entspricht etwa 72 US-Dollar pro Jahr und 000 US-Dollar pro Monat.

Wenn Sie Ihr Plugin verkaufen, können Sie je nach Anzahl der Verkäufe bis zu 5 US-Dollar pro Monat verdienen. Durch das Anbieten von Plugin-Anpassungsdiensten können Sie zwischen 000 und 20 US-Dollar pro Stunde verdienen.


Was Sie brauchen, um ein WordPress-Plugin zu erstellen

Um ein Plugin zu erstellen, müssen Sie kein Experte für WordPress-Entwicklung sein. Grundlegende Programmierkenntnisse genügen für den Anfang.

  • Grundkenntnisse in der PHP-Programmierung: WordPress-Plugins sind in PHP geschrieben, daher sollten Sie die Sprache und ihre Syntax verstehen, bevor Sie beginnen.
  • Grundlegendes HTML und CSS:  HTML und CSS ermöglichen es Ihnen, die Darstellung und das Erscheinungsbild Ihrer Plugins zu steuern. Daher ist das Verständnis ihrer Grundlagen unerlässlich für die Entwicklung eines WordPress-Plugins.
  • Vertrautheit mit WordPress:  Es ist hilfreich, sich mit der WordPress-Plattform und ihren Hauptfunktionen sowie mit der Wordpress Codex (das Online-Handbuch für die WordPress-Entwicklung).
  • Eine Entwicklungsumgebung: Um Ihr Plugin zu entwickeln und zu testen, müssen Sie WordPress auf Ihrem lokalen Computer oder auf einer Entwicklungsseite installieren. Auf diese Weise können Sie Ihr Plugin testen, ohne eine Live-Website zu beeinträchtigen. Wie das geht, zeigen wir Ihnen im nächsten Abschnitt.
  • Ein Texteditor: Sie benötigen einen Texteditor, um Ihren Plugin-Code zu schreiben. Es stehen viele Optionen zur Verfügung, beispielsweise S.erhabener Text, Atom et Visual Studio Code.

So erstellen Sie ein WordPress-Plugin in 7 Schritten

Schritt 1: Verstehe, wie WordPress-Plugins funktionieren

Da WordPress in einer Programmiersprache geschrieben ist, kann jeder mit Programmierkenntnissen auf den WordPress-Code zugreifen und ihn ändern.

Genau so funktionieren Plugins. Sie ermöglichen es Ihnen, die Funktionalität von WordPress zu modifizieren und zu erweitern, indem Sie mithilfe bestimmter PHP-Funktionen direkt mit Ihrer WordPress-Website interagieren.

Das Erstellen eines WordPress-Plugins und das Hinzufügen von Code funktioniert nur, wenn Sie die PHP-Funktion über einen Hook aufrufen. Hooks ermöglichen es Ihrem Plugin, mit WordPress zu interagieren, ohne dass die Kerndateien bearbeitet werden müssen.

Schauen wir uns die Beziehung zwischen eckigen Klammern und Funktionen an, um die Grundlagen von WordPress-Plugins zu verstehen.

WordPress-Funktionen:

Der WordPress-Code basiert auf Funktionen, die es beliebigem Drittanbietercode ermöglichen, mit WordPress zu interagieren. Daher finden sich in Plugins und Themes zahlreiche Funktionen. Jede Funktion hat einen eigenen Namen, gefolgt von geschweiften Klammern und dem Code innerhalb dieser Klammern.

Voici un exemple:

function sticky_header() {

  ?>

  <script>

  // Select the header element

  var header = document.querySelector(‘header’);

  // Get the offset position of the header

  var sticky = header.offsetTop;

  // Add the sticky class to the header when you reach its scroll position. Remove “sticky” when you leave the scroll position

  function addSticky() {

    if (window.pageYOffset > sticky) {

      header.classList.add(“sticky”);

    } else {

      header.classList.remove(“sticky”);

    }

  }

  // Add the sticky class to the header when you scroll the page

  window.onscroll = function() {

    addSticky();

  };

  </script>

  <?php

}

add_action( ‘wp_footer’, ‘sticky_header’ );

Sie können diese Funktion direkt in Ihrem WordPress-Plugin aufrufen, indem Sie `sticky_header()` an der gewünschten Stelle einfügen. Dies ist jedoch keine gute Vorgehensweise, da es wahrscheinlich zu Problemen kommen wird. Hier sind zwei weitere Gründe, warum Sie Funktionen nicht direkt in Ihrem Code aufrufen sollten.

Erstens funktionieren direkte Aufrufe nur für grundlegende Funktionen, wie das Hinzufügen von Inhalten zu einer Designdatei. Außerdem erfordert dieser Ansatz, dass Funktionen wiederholt aufgerufen werden, um sie an mehreren Stellen zu verwenden, was zeitaufwändig ist und die Code-Dateien vergrößert.

Das manuelle Aufrufen einer Funktion kann gerade für Programmieranfänger knifflig sein. Bei der Plugin-Entwicklung empfiehlt es sich daher, die Funktion an einen Hook anzuhängen. Dadurch muss sie nicht an mehreren Stellen aufgerufen werden.

WordPress-Hooks 

Ein Hook ist eine bestimmte Stelle im WordPress-Code, an der Sie Ihre eigenen Funktionen ausführen können. Es gibt zwei Arten von Hooks: Aktions-Hooks und Filter-Hooks.

Aktionshaken

Mit Action-Hooks können Sie benutzerdefinierte Funktionen an einem bestimmten Punkt im WordPress-Ausführungszyklus ausführen. So sieht die Syntax eines Action-Hooks aus.

add_action('hook_name', 'my_custom_function');

Le  Hook_Name  ist der Name des Aktions-Hooks, den Sie verwenden möchten.

WordPress bietet verschiedene Aktions-Hooks. Sie finden diese im codex WordPress.

meine_benutzerdefinierte_funktion  ist die Funktion, die den auszuführenden Code enthält. Diese Funktion muss vor der Funktion definiert werden add_action.

Die Syntax zum Anhängen der oben genannten Sticky-Header-Funktion an einen Hook sieht folgendermaßen aus.

add_action( 'wp_footer', 'sticky_header' );

Diese Funktion führt die Funktion `sticky_header()` aus, wenn der Action-Hook `wp_footer` aufgerufen wird. Sie können die Funktion auch einem bestimmten Hook zuweisen, indem Sie `wp_footer` durch den Namen des gewünschten Hooks ersetzen.

Beispielsweise:

add_action( 'init', 'sticky_header' );

Dadurch wird die Sticky-Header-Funktion ausgeführt, wenn die WordPress-Initialisierungsaktion aufgerufen wird.

Filterhaken

Filter-Hooks ermöglichen es Ihnen, Daten zu bearbeiten, bevor sie angezeigt oder in der Datenbank gespeichert werden. Hier ist ein Beispiel für einen Filter-Hook, der den Titel eines Blogbeitrags in Großbuchstaben umwandelt.

add_filter( ‘the_title’, ‘uppercase_title’ );

function uppercase_title( $title ) {

  return strtoupper( $title );

}

Diese Funktion akzeptiert ein einzelnes Argument, $title, welches der ursprüngliche Titel des Blogbeitrags ist.

Die Funktion verwendet dann die Funktion strtoupper() um den Titel in Großbuchstaben umzuwandeln und den geänderten Wert zurückzugeben.

Der Unterschied zwischen Aktions- und Filter-Hooks

Action-Hooks ermöglichen es Ihnen, benutzerdefinierte Funktionen an einem bestimmten Punkt im WordPress-Ausführungszyklus auszuführen. Im obigen Beispiel ist der Action-Hook wp_footer wird direkt vor dem Tag aufgerufen.

Filter-Hooks hingegen ermöglichen es Ihnen, Daten zu modifizieren, während sie durch die WordPress-Codebasis geleitet werden.

Wie im obigen Beispiel, der Filter-Hook der Titel Ermöglicht es Ihnen, den Titel eines Blogbeitrags zu ändern, bevor er auf der Website angezeigt wird.

Schritt 2: Richten Sie eine Testumgebung ein

Der zweite Schritt bei der Erstellung eines WordPress-Plugins besteht darin, eine Test- oder Entwicklungsumgebung einzurichten. Ziel ist es, Experimente auf einer Live-Website zu vermeiden.

Die Entwicklung eines Plugins erfordert mitunter wiederholte Anpassungen. Dabei können auch Fehler auftreten, die Ihrer Website schaden.

Sie können Ihren Computer als lokalen Server verwenden, um eine WordPress-Testseite zu hosten, auf der Sie Ihr Plugin erstellen und testen können.

Wenn Ihr Hosting-Paket die Erstellung einer Testseite unterstützt, können Sie diese Option ebenfalls nutzen. Wir verwenden hier die erste Möglichkeit.

Um eine Testumgebung einzurichten, werden wir lokal herunterladen , ein Entwicklungstool zum lokalen Hosten von WordPress-Websites.

Sobald der Download abgeschlossen ist, starten Sie die Software auf Ihrem Computer und klicken Sie auf das + Symbol unten links, um eine neue lokale Site zu erstellen.

erstelle ein WordPress Plugin

Wähle aus Erstellen Sie eine neue Website und klicken Sie auf die Schaltfläche Fortfahren.

Folgen Sie anschließend den Anweisungen auf dem Bildschirm, um Ihren Seitennamen hinzuzufügen, die Umgebung zu konfigurieren und Ihre WordPress-Anmeldedaten zu erstellen.

Sobald Sie fertig sind. Klicken Sie auf die Schaltfläche Website hinzufügen. Nachdem Sie Ihre Website hinzugefügt haben, wählen Sie Ihre Website im lokalen Dashboard aus und starten Sie Ihr WordPress-Admin-Dashboard.

Sobald sich die Admin-Anmeldeseite öffnet, verwenden Sie die Nutzername und WordPress-Passwort die Sie oben erstellt haben, um auf Ihr Dashboard zuzugreifen.

Das war's. Ihre Testumgebung ist bereit. Beginnen wir mit der Entwicklung Ihres WordPress-Plugins.

Schritt 3: Erstellen Sie Ihren Plugins-Ordner

Sobald Ihre Testumgebung eingerichtet ist, müssen Sie als Erstes eine Plugin-Datei in Ihrem Site-Verzeichnis erstellen. Standardmäßig speichert WordPress alle Plugins im Verzeichnis wp-content/plugin.

Jedes auf einer WordPress-Website installierte Plugin erstellt einen Ordner in diesem Verzeichnis. Daher müssen Sie für Ihr Plugin einen Ordner in diesem Verzeichnis erstellen und ihm einen Namen geben.

Für dieses Tutorial navigieren wir zu dem Ordner wp-content/plugin in unserem lokalen Site-Verzeichnis. Hier ist wie.

Hinweis:  Der Prozess ist derselbe, wenn Sie eine zwischengeschaltete Website verwenden.

Klicken Sie auf Ihrem lokalen Dashboard auf  Gehen Sie zum Site-Ordner . Sie werden zu Ihrem lokalen Site-Verzeichnis weitergeleitet.

wählen Apps Klicken Sie in den Optionen auf Öffentlichkeit dann wp-content. In diesem Verzeichnis sehen Sie verschiedene Ordner.

Öffnen Sie den Ordner Plugins und einen neuen Unterordner mit dem Namen Ihres Plugins. Wir werden hier verwenden Sticky-Header da dies der Name des Plugins ist, das wir erstellen möchten.

Schritt 4: Erstellen Sie die Haupt-PHP-Datei für Ihr Plugin

Nachdem Sie Ihren Plugin-Ordner erstellt haben, fügen Sie als Nächstes eine PHP-Datei in diesen Ordner ein. Hier befinden sich der Code und die Funktionen Ihres Plugins.

Für dieses Tutorial benötigen wir nur eine einzige PHP-Datei für ein einfaches Plugin, das einen Sticky Header in WordPress erstellt.

Bei komplexeren Plug-ins mit erweiterter Funktionalität können sich im Plug-in-Ordner verschiedene Dateitypen befinden, z. B. CSS und Javascript. In unserem Fall reicht eine einzelne PHP-Datei aus.

Erstellen Sie dazu eine PHP-Datei im Plugin-Ordner, wie im folgenden Screenshot gezeigt.

Sobald die Datei fertig ist, können Sie Ihrem Plugin einige Informationen hinzufügen.

Schritt 5: Konfigurieren Sie Ihre Plugin-Informationen

Die Informationen über Ihr Plugin, auch Plugin-Dateikopf genannt, sind ein PHP-Kommentarblock, der Details zu Ihrem Plugin enthält, wie z. B. Plugin-Name, Version, URL, Name und Website des Autors, Lizenz usw.

Dies sind die Informationen, die Sie nach der Installation eines Plugins auf der WordPress-Plugin-Seite sehen.

Sie können die Plugin-Datei-Header im WordPress-Codex . Es sieht aus wie das.

Kopieren Sie diesen Code einfach in die PHP-Datei Ihres Plugins und passen Sie die Details anschließend an die Spezifikationen Ihres Plugins an. In unserem Fall sieht der Sticky-Header-Dateileser des Plugins folgendermaßen aus.

<?php

/*

Plugin Name: Sticky Header

Plugin URI: https://wordpress.org/plugins/sticky-header/

Description: Make your website header sticks to the top of every page on your website as users scroll.

Author: The Team

Author URI: https://blogpascher.com/sticky-header

Text Domain: Sticky Header 

Domain Path: /languages

*/

Sobald Sie diese Datei gespeichert haben, haben Sie ein neues Plugin erstellt und finden es in der Liste der bereits auf Ihrer Website installierten Plugins.

Melden Sie sich beim WordPress-Dashboard Ihrer Testseite an und gehen Sie zu Plugins>Plugins installés.

Sie sehen das Sticky Header-Plugin mit Details. Hier ist es.

erstelle ein WordPress Plugin

Sie können das Plugin jetzt aktivieren, aber es wird nichts tun, da wir ihm noch keine Funktionalität hinzugefügt haben. Lassen Sie uns also unser Plugin dazu bringen, etwas zu tun.

Schritt 6: Fügen Sie Code zu Ihrem Plugin hinzu

Dazu fügen wir den Code für den fixierten Header hinzu, den wir bereits im Abschnitt über WordPress-Funktionen und Hooks verwendet haben. So geht's.

Öffnen Sie die PHP-Datei Ihres Plugins. Kopieren Sie die folgenden Code-Schnipsel unter den Header-Details in die Haupt-PHP-Datei Ihres Plugins und speichern Sie diese.

function sticky_header() {

  ?>

  <script>

  // Select the header element

  var header = document.querySelector(‘header’);

  // Get the offset position of the header

  var sticky = header.offsetTop;

  // Add the sticky class to the header when you reach its scroll position. Remove “sticky” when you leave the scroll position

  function addSticky() {

    if (window.pageYOffset > sticky) {

      header.classList.add(“sticky”);

    } else {

      header.classList.remove(“sticky”);

    }

  }

  // Add the sticky class to the header when you scroll the page

  window.onscroll = function() {

    addSticky();

  };

  </script>

  <?php

}

add_action( ‘wp_footer’, ‘sticky_header’ );

Dieser Code macht zwei wesentliche Dinge,

La fonction sticky_header wird aktiviert, wenn der Benutzer die Seite scrollt, und stoppt, wenn das Scrollen aufhört.

Zweitens, die Aktion add_action('wp_footer', 'sticky_header' ); verwendet die Adresse …..

Speichern Sie den Code, und das war's. Sie haben erfolgreich ein WordPress-Plugin erstellt, das den Header Ihrer Website beim Scrollen fixiert.

Schritt 7: Aktivieren Sie das Plugin

Kehren Sie zu Ihrer Website zurück und aktivieren Sie das Plugin.

Wenn Sie durch die Live-Version der Website scrollen, bleibt die Kopfzeile Ihrer Website oben auf der Seite.

erstelle ein WordPress Plugin

Sobald Sie die Wirkung des neuen Plugins auf Ihrer Demoseite gesehen haben, ist es an der Zeit, es auf Ihrer Liveseite auszuprobieren.

Bevor Sie fortfahren, stellen Sie sicher, dass Sie das Plugin auf Fehler und Sicherheitslücken getestet haben. Beheben Sie diese gegebenenfalls. Vorsichtshalber sollten Sie Folgendes beachten: Sichern Sie Ihre WordPress-Site bevor Sie Ihr neues Plugin bereitstellen.

Wenn Sie mit der Leistung des Plugins auf Ihrer Website zufrieden sind, können Sie es in das WordPress-Plugin-Repository hochladen. Da Website-Betreiber es kostenlos nutzen, erhalten Sie Feedback zu Verbesserungsmöglichkeiten und deren Umsetzung.

Und wenn Sie mit Ihrem Plugin Geld verdienen möchten, können Sie es auf einer der oben genannten Webseiten verkaufen.


Fazit

Wenn Sie bis hierher gelesen haben, werden Sie mir zustimmen, dass die Erstellung eines WordPress-Plugins relativ einfach ist. Mit den Anweisungen in diesem Leitfaden können Sie ein einfaches WordPress-Plugin erstellen. Sie können beliebig viele Funktionen ausprobieren und den Funktionsumfang Ihres Plugins erweitern.

Das Erstellen komplexer Plugins folgt der gleichen Methode. Mehr Funktionalität bedeutet mehr Funktionen in Ihrer Plugin-Datei.

Haben Sie schon einmal versucht, ein WordPress-Plugin zu erstellen? Lassen Sie uns im Kommentarbereich unten über Ihre Erfahrungen sprechen.