Post navigation

Entwicklung · · 2 Kommentare

WordPress Plugins entwickeln: So auf keinen Fall, bitte!

WordPress Plugins entwickeln ist nicht einfach. Zu schnell schleichen sich Fehler ein, wenn der Code zu kompliziert gerät. Doch ich musste feststellen, dass es tatsächlich Entwickler gibt, die alles geben, um fehlerhafte Plugins zu produzieren. Ein Beispiel, wie man es keinesfalls machen sollte.

Kürzlich war ich auf der Suche nach einem einfachen Widget für meine Sidebar, dass nur die fünf beliebtesten Artikel nach Anzahl der Post-Views anzeigt. Das sollte eigentlich keinen Plugin-Entwickler überfordern, viel ist dafür nicht nötig.

WordPress Plugins entwickeln: Jeder Anfänger hätte gern eins

New Popular Posts Widget: Aktiviert und Seite zerschossen

WordPress Plugins entwickeln: So bitte nicht!

Aktiviert und gleich Design zerschossen. Ein Blick unter die Haube erzeugt Übelkeit.

Nachdem ich zwei Alternativen ausprobiert hatte, musste ich meine Meinung doch revidieren. Ich aktivierte das Plugin »New Popular Posts Widget«, aktualisierte meinen Blog und schon war mein Design zerschossen.

Alle Elemente, die den Icon-Font »Font Awesome« verwendeten, wurden nicht mehr korrekt angezeigt. Wohlgemerkt: ich hatte das Widget noch nicht genutzt, sondern einfach nur das Plugin aktiviert.

Dass das so passiert, kann nur heißen, dass ein Plugin schlecht programmiert ist. Trotzdem hat es mich gereizt, mir den Code genauer unter die Lupe zu nehmen. Ich wollte wissen, wo genau der Fehler liegt.

Ein Blick unter die Haube erzeugte Übelkeit, denn:

Fehler scheinen cool zu sein, dachte sich anscheinend der Entwickler. Das Plugin erzeugt lediglich ein kleines Widget für die Sidebar, das nach Anzahl der Post-Views einige beliebte Artikel anzeigt. Du hast exakt zwei Möglichkeiten der Einstellung im Widget: Titel und Anzahl der angezeigten Posts.

New Popular Posts Widget is really bad!

Zwei Einstellungsmöglichkeiten sollten keinen Entwickler überfordern.

Ich lud mir das Plugin auf den Desktop, entpackte es und schaute gespannt in den Ordner. Meine Augen wurden immer größer und ich konnte das Gesehene kaum fassen!

Der »Entwickler« hat sein Mini-Plugin doch tatsächlich in ein WP-Plugin Boilerplate gepresst. Selbstverständlich hat ein solches Boilerplate seine Berechtigung, allerdings nur, wenn Du ein umfangreiches Plugin mit vielen Einstellungen entwickelst.

Aber doch bitte nicht für ein Mini-Widget mit genau zwei Einstellungen!

Das Grauen auf einen Blick:

So viele Dateien für ein kleines Widget

So viele Dateien für ein kleines Widget. Unfassbar!

Hier liegen die Fehlerquellen des Plugins

1 – Die Komplexität.

Zu viele absolut unnötige Dateien. Das Plugin sollte genau eine PHP-Datei haben. Dazu kommt noch eine CSS-Datei.

2 – Der genutzte Icon-Font Fontello

Die Icons haben die gleichen Klassen-Namen wie ältere Versionen von Font Awesome. Einen Icon-Font für genau zwei verwendete Icons zu laden, ist nicht durchdacht und ergibt keinerlei Sinn. Beide Icons hätte man auch in PNGs umwandeln können.

3 – Die CSS-Datei

Das CSS wird nach dem Aktivieren des Plugin auf jeder Seite eingebunden, ob das Widget nun genutzt wird, oder nicht. Doch gerade bei Widgets kann man sehr schön mit is_active_widget() steuern, das die Datei nur bei Nutzung eingebunden wird.

Beispiel:

<?php
// Load css only when widget is active
if ( is_active_widget( false, false, $this->id_base, true ) ) {
 
 // Make function pluggable
 if (! function_exists('ah_about_css')) {
 
 function ah_about_css() {
 
   wp_enqueue_style( 'about-me', plugins_url( '/css/style.css', __FILE__ ) );
    }
  }
 }
add_action( 'wp_enqueue_scripts', 'ah_about_css' );

4 – Die Loop für die Popular Posts

Einfach die Standard-Loop zu kopieren ohne Anpassung auf den eigenen Namespace ist fast unverantwortlich. Denn gerade bei Themes, die von den Nutzern selbst entwickelt wurden, können so erhebliche Probleme auftreten.

Screenshot der Loop von »New Popular Post Widget«:

Die kopierte Standard-Loop mit wp_query();

Die kopierte Standard-Loop mit wp_query();

So kann man es besser machen:

<?php 
// Die Loop mit eigenem Namespace
$nppw = new WP_Query( $args ); ?>

<?php if ( $nppw->have_posts() ) : ?>

	<!-- the loop -->
	<?php while ( $nppw->have_posts() ) : $nppw->the_post(); ?>
		<h2><?php the_title(); ?></h2>
	<?php endwhile; ?>
	<!-- end of the loop -->

	<?php wp_reset_postdata(); ?>

<?php else : ?>
	<p><?php _e( 'Sorry, no posts matched your criteria.' ); ?></p>
<?php endif; ?>

5 – Das nutzlose und Fehler produzierende JavaScript

JavaScript-Dateien ergeben Sinn, wenn sie etwas machen sollen. Jedoch nicht, wenn sie vollkommen leer sind. Dann sollten sie keinesfalls geladen werden. Doch genau diese Datei wird durch das Plugin geladen:

Leer. Nix drin. Null, Nada, Nothing, Niente..

Leer. Nix drin. Null, Nada, Nothing, Niente.

Das es Fehler produziert, ist vollkommen klar:

Die Fehler, die eine leere JS-Datei produzieren muss.

Die Fehler, die eine leere JS-Datei produzieren muss.

Und das alles für diesen einfachen Output:

Der Output: Das New Popular Post Widget.

Der Output: Das New Popular Post Widget.

Wie hätte man es besser machen können?

  • Das Plugin Developer Handbook lesen. Dort sind auch unter dem Punkt »Best Practices« Beispiele für gute Plugins aufgeführt. Alternativ kann man auch mein Plugin »AH About Widget« als Vorlage nehmen. Es kann deutlich mehr als unser Beispiel, ist jedoch einfach und trotzdem gut strukturiert aufgebaut.
  • Alle Funktionen in nur einer Datei bündeln. Bei solch kleinen Mini-Plugins benötigt man wirklich nur eine PHP-Datei.
  • Icon-Fonts in PNG umwandeln. Schließt Fehler aus und ist performanter.
  • CSS-Datei nur einbinden, wenn das Widget aktiv ist.
  • Loop mit eigenem Namespace, wie im Beispiel oben angegeben.
  • JavaScript-Datei löschen und am Laden hindern.
  • Alle Funktionen mit Präfix versehen und pluggable machen, sodass sie leicht überschrieben werden können

So wollen wir es haben – Fazit

Gute Plugins sind so einfach wie nur möglich strukturiert und gecoded. Treu nach dem Motto: So einfach wie möglich und so komplex wie nötig. Entwickler sollten nach dem KISS-Prinzip vorgehen. Das ist nicht einfach. Einfachen, gut lesbaren Code zu schreiben ist sehr anspruchsvoll. Doch es macht Plugins und Themes besser und vermeidet eine Menge Fehler.

Weitere Informationen:

Abonniere meinen Newsletter

Melde Dich für meinen Newsletter "WordPress & Bloggen" an und verpasse keinen Artikel. Als Dankeschön bekommst Du Gratis meine nützliche Checkliste:
»12 Dinge, die Du vor einem Theme-Wechsel beachten solltest«.

Andreas Hecht

ist WordPress-Entwickler, freier Journalist und Autor. Er schreibt für ein bekanntes deutsches Webdesign Magazin und ist nebenbei Autor mehrerer E-Books zu den Themen Lebenshilfe, Marketing und WordPress.

2 Meinungen zu “WordPress Plugins entwickeln: So auf keinen Fall, bitte!

  • Jetzt stellt sich nur noch die Frage, warum du überhaupt nach einem Plugin Ausschau gehalten hast für eine solch simple Anwendung. Am Ende hast du sogar noch selber den Code dafür geschrieben. 🙂
    Jedoch ein allemal interessanter Artikel. Man merkt, dass da viel Know-How hinter steckt.

    Viele Grüße
    Christian

Schreibe einen Kommentar

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