Shopware 5: Einkaufswelt-Element-Plugin erstellen am Beispiel

25. März 2016 · Kategorien: Internet, PHP, Webentwicklung

Einkaufswelt-Element-Plugin entwickeln

In  diesem Artikel erkläre ich am Beispiel, wie sich in Shopware 5 ein eigenes Einkaufswelt-Element-Plugin erstellen lässt. Das Ziel dieses Artikels wird ein Plugin sein, mit dem sich Instagram-Bilder darstellen lassen.

Shopware 5 Plugin-Entwicklung

Wer schon einmal in Verbindung mit Shopware programmiert hat, der wird wissen, dass es nicht immer einfach ist und gerne mal mit Frust verbunden sein kann.
Das liegt meines Ermessens unter Anderem daran, dass
- Shopware teilweise Technologien einsetzt, die nicht (mehr) geläufig sind (Zend Framework 1, ExtJS, Enlight, Smarty)
- Debugging oft schwierig ist (JavaScript Code z.B. wird teilweise serverseitig included und über Ajax ausgegeben)
- die Community sich nur auf Deutschland beschränkt und Forenbeiträge mit Fragen oft unbeantwortet beiben.

Die soll kein Vorwurf an das Shopware-Team sein. Ein so umfangreiches Shopsystem ist zwanghaft mit Komplexität verbunden und wenn man die neuste Entwicklung des Shopware-Codes verfolgt, findet man sinnvolle Ansätze (Dependency Injection, Hooks), die aufzeigen, dass Shopware auf dem richtigen Weg ist. Nicht zu vergessen muss natürlich immer die erfolgsentscheidende Abwärtskompatibilität im Hinterkopf behalten werden.

Beispiel-Plugin: Instagram Bilder für Einkaufswelten

Als ich mit der Plugin-Entwicklung für Shopware begonnen habe, war das mit viel Frust verbunden.
Auf viele Fragen bekam ich keine Antwort – weder in der offiziellen Dokumentation, noch in den Forenbeiträgen oder sonstwo über Google.

Ich hätte mir gerne ein sauberes, fertiges Plugin gewünscht, an Hand dessen ich direkt am Code lernen kann, wie ich Plugins schreibe und was es zu beachten gibt. Zwar gibt es den Shopware Plugin Boilerplate Code, der ging mir aber nicht weit genug und ließ viele Fragen offen.

Aus diesem Grund habe ich nun selbst ein Plugin geschrieben, das ich zwar auch im Shopware Store verkaufen werde, aber auch unter MIT-Lizenz auf Github gestellt habe. Das heißt: Mach damit, was Du willst :)

Einkaufswelt-Element-Plugin herunterladen

Das Plugin ist schnell installiert.
Wechsel zuerst in das Verzeichnis Deiner Shopware-Installation und dort in das lokale Backend-Plugin-Verzeichnis:

cd pfad-zu-shopware/;
cd engine/Shopware/Plugins/Local/Backend/;

Lade Dir nun hier via git Das Plugin herunter:

git clone https://github.com/ckdot/shopware-instagram-element.git

Das Plugin wird nun in das Verzeichnis shopware-instagram-element heruntergeladen. Das Verzeichnis des Plugins muss aber dem technischen Plugin-Namen entsprechen. Dieser lautet CkdotInstagramEmotionElement. Nenne das Verzeichnis also um:

mv shopware-instagram-element CkdotInstagramEmotionElement

Plugin installieren

Das Plugin lässt sich installieren, wie jedes andere Shopware-Plugin auch:
Gehe in das Shop-Backend und öffne den Plugin-Manager. Suche das Plugin aus der Liste heraus und klicke auf das grüne Plus:

Einkaufswelt-Plugin installieren

Einkaufswelt-Plugin installieren

Darauf ist das Plugin noch nicht aktiviert!
Suche das Plugin erneut aus der Liste unter “Deaktiviert” und klicke auf das kleine, rote X.

Nun wird der Template-Cache gelöscht. Zusätzlich öffnet sich ein Fenster zur Kompilierung des Themes. Klicke hier auf “Kompilieren”, sodass die neuen CSS-Styles des Einkaufswelt-Element-Plugin in das Theme integriert werden.

Wenn die Kompilierung abgeschlossen ist, musst Du die Seite einmal vollständig neu laden. Das ist notwendig, damit neue Einkaufswelt-Elemente hinzugefügt werden können.

Eigenes Einkaufswelt-Element Plugin entwickeln

Jetzt, wo das Plugin installiert ist – und hoffentlich funktioniert – solltest Du Dir die Datei Bootstrap.php ansehen. Ich habe hier jede Kleinigkeit kommentiert und auch darauf hingewiesen, was es zu beachten gibt.

Ich empfehle Dir übrigens bei der Shopware-Entwicklung eine IDE wie PHPStorm (kostenpflichtig) oder Netbeans (kostenlos) zu verwenden und einem Texteditor vorzuziehen.
Ohne die automatischen Codevervollständigungen ist es bedeutend schwerer, den Einstieg zu finden.

Den Code des Plugins findest Du auf Github:
https://github.com/ckdot/shopware-instagram-element

Wenn Du Fragen hast, kannst Du sie gerne hier in den Kommentaren stellen.
Viel Erfolg!

Autor: | Kategorien: Internet, PHP, Webentwicklung

3 Kommentare zu Shopware 5: Einkaufswelt-Element-Plugin erstellen am Beispiel

  1. Angelo sagt:

    Super Beispiele zum direkten nachmachen.

    Dank dafür!

  2. Manu sagt:

    Thanks, bin schon fast verrückt geworden nach einem Sinnvollem Beispiel

  3. michael sagt:

    Mersi für den Tipp! habe gerade ein ähnliches Problem gehabt und dein Tipp hat mir weiter geholfen.

Hinterlasse eine Antwort

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