Größentabellen Plugin – Dokumentation

Inhaltsverzeichnis

  • Kompatibilität #
  • Installation #
  • Lizenz #
  • Erstellen von Tabellen #
  • Einstellungen #
  • Import/Export #
  • Templates #
  • Support, Feedback, Customizing #

Kompatibilität

Dies ist ein JTL-Shop 4 Plugin. Getestet wurde es unter mit PHP Versionen:

PHP Versionen: 7.0.33, 7.1.x, 7.2.x und 7.3.x

Installation

Das Plugin lässt sich wie jedes Plugin für JTL Shop installieren

  1. Im JTL Shop unter Plugins → Pluginverwaltung → Upload das Plugin als ZIP hochladen, alternativ kann das Plugin via FTP in den Shop geladen werden.
  2. Nach dem Hochladen erscheint das Plugin unter dem Reiter verfügbar. Dort kann es installiert werden.

Lizenz

In der kostenlosen Version lassen sich bis zu 5 Tabellen anlegen. Falls ihr mehr Tabellen benötigt braucht ihr die Premium Version des Plugins. Diese ist unter https://ecom-mate.de erhältlich. Die Lizenzen sind domain-gebunden, die Eingabe eines Lizenzschlüssels ist daher nicht nötig. Solltet ihr eine Lizenz unter einer anderen Domain verwenden wollen, schreibt uns eine kurze Email an support@ecom-mate.de, dann ändern wir die Lizenz auf eure neue Domain.

Erstellen von Größentabellen

Die Verwaltung der Größentabellen geschieht in den Plugin-Einstellungen. Diese erreicht Ihr über Plugins → Pluginverwaltung → Aktiviert → Plugin „Größentabellen“

Unter dem Reiter „Tabellen“ werden die Tabellen verwaltet. Nach einem Klick auf den Button „Neue Tabelle anlegen“ wird eine neue Tabelle erstellt. Nach einem Klick auf den Button „Inhalt bearbeiten“ kann man zunächst die Anzeigebedingungen einstellen: Hier wird gesteuert, bei welchen Artikeln diese Tabelle angezeigt wird. Zum Beispiel kann eine Tabelle bei allen Artikeln eines Herstellers angezeigt werden. Auch Kombinationen sind möglich: So lässt sich eine Tabelle etwa bei allen Artikeln eines Herstellers, welche zur Kategorie X gehören anzeigen. Natürlich lässt sich auch für einzelne Artikel eine Größentabelle anlegen. Nachdem eine Bedingung gesetzt wurde ist es wichtig, dass diese durch einen Klick auf das blaue Speichern-Symbol rechts gespeichert wird. Es ist möglich, mehrere Anzeigegruppen für eine Tabelle zu hinterlegen. Damit die Größentabelle bei den Artikeln angezeigt wird, müssen immer alle Anforderungen einer Anzeigegruppe erfüllt sein. Weitere Anzeigegruppen lassen sich durch einen Klick auf das blaue + unter den Anzeigebedingungen hinzufügen.

Standardmäßig wird nur eine Tabelle bei einem Artikel angezeigt. Durch die Anzeigebedingungen ist es aber möglich, dass einem Artikel mehrere Tabellen zugeordnet werden. In der Praxis könnten zum Beispiel einer Jacke zum einem eine allgemeine Größentabelle zugeordnet sein als auch eine spezifische für den Hersteller der Jacke. Welche von beiden angezeigt wird lässt sich über die Gewichtung unter dem Reiter „Einstellungen“ steuern.

Das Anlegen einer Tabelle selbst ist selbsterklärend: Es können Titel, Beschreibung sowie Notiz, welche unter der Tabelle angezeigt wird, vergeben werden und die Zeilen und Spalten der Tabelle mit Inhalt gefüllt werden. Zeilen und Spalten lassen sich mittels der Pfeile verschieben und durch einen Klick auf das x löschen. In den Optionen lassen sich Einstellungen vornehmen, welches sich nur auf diese Tabelle beziehen. Mit einem Klick auf speichern wird die Bearbeitung beendet. Für verschiedene Sprachen lassen sich eigene Größentabellen hinterlegen. Damit nicht alles neu eingegeben werden muss, lassen sich Tabellen auch kopieren und einfügen. So könnt ihr etwa eine Tabelle auf Deutsch anlegen, kopieren, dann die Sprache auf Englisch umstellen und die Tabelle wieder einfügen und nur die Zeilen/-Spaltenüberschriften ändern.

Reiter Einstellungen

Unter dem Reiter Einstellungen findet ihr folgende Optionen:

  • Plugin aktiv: Erst wenn dieser Haken gesetzt ist werden die Größentabellen im Shop angezeigt.
  • Als Modalfenster einfügen: Standardmäßig ist die Größentabelle über einen Button erreichbar und öffnet sich in einem Modalfenster.
  • CSS Anker für den Modal Button: Über den CSS Anker lässt sich einstellen, an welcher Stelle der Button angezeigt wird.
  • Eigener CSS Anker für den Modalfenster Button: Ist in der vorigen Einstellung „Eigener CSS Anker“ gewählt kann dieser hier eingefügt werden.
  • Relation des Modal Buttons zu dem Eigenen CSS Anker:
  • CSS Klassen für den Button: Damit sich das Design des Buttons dem Shop-Design anpasst, sollte dieser die gleiche Klasse haben wie andere sekundär Button. Standardmäßig empfiehlt sich im Evo-Template „btn btn-default btn-secondary“. Des Weiteren wird dem Button noch eine weitere Klasse „ecm-st-btn“ zugewiesen.
  • Text/Icon auf dem Button anzeigen: Je nach Geräte-Größe ist es möglich den Button als Größentabellen Icon, Text, oder Icon + Text darzustellen.
  • Als Tab einfügen: Die Größentabelle lässt sich auch in einem weiteren Tab auf der Artikelseite darstellen. (Experimentell, Funktioniert nur im Evo-Template, bzw. in sehr ähnlichen Templates)
  • Tabellen Design: Für die Tabellen stehen verschiedene Themes zur Auswahl, diese können unter dem Reiter „Tabellen Templates“ (verlinken) auch selbst erstellt werden.
  • Zuweisung von Tabellen: Wie hier (verlinken) schon beschrieben lässt sich hier die Zuweisung von Tabellen zu den Artikeln steuern.
  • Zwischenspeicherung zurücksetzen: Um Ressourcen zu sparen, wird die Zuweisung von Tabellen zu Artikeln zwischengespeichert. Diese aktualisiert sich automatisch wenn Tabellen angelegt oder verändert werden und wenn neue Artikel hinzugefügt werden. Sollten Attribute eines bestehenden Artikels verändert werden kann eine manuelle Aktualisierung notwendig sein.

Import / Export

  • Solltet ihr die gleichen oder ähnliche Tabellen in mehreren Shops verwenden, könnt ihr diese ex- und importieren.
  • Diese Funktion eignet sich auch für Backups der Größentabellen

Templates

Neben den mitgelieferten Templates könnt ihr auch eigene erstellen. Dazu könnt ihr etwa die Farben für Schrift, Hintergrund und Rahmen wählen, oder auch eigenes CSS hinterlegen. Dies geht ganz einfach, erfordert jedoch Grundkenntnisse in CSS: Im Browser sucht ihr den passenden Selektor und fügt das CSS in den Einstellungen hinzu.

Ein paar Beispiele:

  • Um den Titel der Größentabellen zu zentrieren ist folgender Code notwendig:
    • .ecm-sizeTable-title{text-align: center}
  • Wenn ihr jede zweite Zeil der Tabelle einfärben möchtet – hier im Beispiel grau – könnt ihr folgenden Code einfügen:
    • tbody tr:nth-child(odd) td {background-color: #f4f4f4;}
    • tbody: Da wir nicht den Kopf (thead) der Tabelle, sondern nur den Körper (tbody) anpassen möchten
    • tr:nth-child(odd): tr steht für die Zeilen (table row) und :nth-child(odd) ist eine Pseudo Klasse, mit der wir angeben, dass wir nur ungerade Zeilen auswählen
    • td: Hiermit zeigen wir, dass wir die einzelne Zelle (td) der Tabelle anpassen wollen

Support, Feedback, Customizing

Bei Fragen, Problemen oder Anregungen melden dich einfach an support@ecom-mate.de – wir melden uns schnellstmöglich bei dir.