Audioplayer Plus (stylischer Player mit Playlist für mehrere MP3-Dateien)

Inhalt

1. Wozu dient das Plugin "Audioplayer Plus (stylischer Player mit Playlist für mehrere MP3-Dateien)"

Mit „Audioplayer Plus“ ersetzen Sie die separat dargestellten Audio-Medien und fassen diese zu einem optisch ansprechenden sowie intuitiv bedienbaren Player auf der Artikelseite zusammen.

2. Was kann das Plugin "Audioplayer Plus (stylischer Player mit Playlist für mehrere MP3-Dateien)"

Das knowmates-Plugin „Audioplayer Plus“ ist exklusiv für das Shopsystem JTL-Shop entwickelt (siehe Abbildungen 1 sowie 2). Es ermöglicht die Wiedergabe aller Medien ohne (zusätzlich notwendige) Interaktion des Nutzers. Im Gegensatz zum Standard-Template NOVA muss nicht jeder Track einzeln abgespielt bzw. angestoßen werden. Darüber hinaus ist die Abspielgeschwindigkeit individuell anpassbar (ideal z. B. für Hörbücher) oder bei Bedarf ganz deaktivierbar.

Außerdem ist es möglich, den Audioplayer an der im Shop-Backend definierten Position anzuzeigen. Genauere Informationen hierzu finden Sie im JTL-Guide:

https://guide.jtl-software.de/jtl-shop/shop-erweitern/mediendateien-anbieten/

Das Styling des Players ist im Backend konfigurierbar, sodass der Audioplayer auf jedes Template optisch anpassbar ist (z. B. auch für einen Darkmode).

Außerdem bietet das Plugin die Möglichkeit, Template-Overrides zu nutzen. Dies ermöglicht erfahrenen Shop-Betreibern, die Optik des Plugins nachträglich anzupassen. Das ist besonders dann nützlich, wenn Sie ein anderes Template als das NOVA-Template nutzen oder aber um den Elementen andere CSS-Klassen zuzuweisen.

Abbildung 1: „Audioplayer Plus“ im Frontend eines JTL-Shops (Desktop)

Abbildung 2: „Audioplayer Plus“ im Frontend eines JTL-Shops (mobil)

 

3. Systemvoraussetzungen

  • JTL-Shop 5.2, 5.3
  • PHP 8.1, PHP 8.2
  • Template NOVA
  • ionCube Loader in der aktuellsten Version

4. Installation im JTL-Shop

Für Deinen JTL-Shop 5 beziehst Du Plugins über den JTL-Extension Store. Um auf Inhalte des JTL-Extension Stores zugreifen zu können, musst Du zunächst Dein JTL-Konto mit Deinem JTL-Shop 5 verknüpfen. Dies wird normalerweise beim Installationsprozess des Shops bereits abgefragt.

So verknüpfst Du Dein JTL-Konto mit Deinem JTL-Shop 5:

  1. Logge Dich im JTL-Shop-Backend ein.
  2. Navigiere im Menü zu „PLUGINS“ > „Meine Käufe“.
  3. Klicke auf „Konto verknüpfen“.
  4. Logge Dich mit Deinen JTL-Daten ein.
  5. Anschließend siehst Du in „PLUGINS“ > „Meine Käufe“ die Übersicht zu Deinen Lizenzen und Subscriptions.

So buchst Du eine Extension für JTL-Shop 5:

  1. Rufe den JTL-Extension Store auf.
  2. Suche nach dem gewünschten Plugin.
  3. Wähle das Plugin aus und klicke auf „Jetzt auschecken“.
  4. Klicke im folgenden Fenster auf „Anmelden“ und melde Dich mit Deinem zentralen JTL-Login an.
  5. Klicke im JTL-Checkout auf „Jetzt bestellen“, um die Bestellung abzuschließen.
  6. Rufe Dein JTL-Shop-Backend auf. Unter „PLUGINS“ > „Meine Käufe“ befindet sich jetzt im Bereich „Ungebundene Lizenzen“ Deine eben erworbene Lizenz.
  7. Nun ordnest Du das Plugin Deinem Shop zu. Klicke dafür auf „An diesen Onlineshop“ anbinden.
  8. Anschließend findest Du die Lizenz im Bereich „Gebundene Lizenzen“ und die Schaltfläche „Installieren“ steht zur Verfügung. Nach der Installation kannst Du das Plugin im Menü unter „PLUGINS“ > „Plugin-Manager“ in der Registerkarte „Aktiviert“ konfigurieren.

5. Plugin "Audioplayer Plus (stylischer Player mit Playlist für mehrere MP3-Dateien)" einrichten

Rufe das Konfigurationsmenü entweder unter „Plugin-Manager“ > „Aktiviert“ über das entsprechende Zahnrad-Icon auf der rechten Seite oder direkt über „Installierte Plugins“ > „Audioplayer Plus“ auf.

Du siehst nun die Plugin-Benutzeroberfläche (siehe Abbildung 3).

Abbildung 3: Benutzeroberfläche vom Plugin „Audioplayer Plus“

Oben rechts befindet sich ein Switch, mit welchem Du zwischen dunklem und hellem Design wechselst.

Triff nun die gewünschten Einstellungen für das Plugin „Audioplayer Plus“.

Der Reiter „Einstellungen“ beinhaltet folgende Optionen (siehe Abbildung 4):

Abbildung 4: Reiter „Einstellungen“

  • Plugin Status: Anzeige im Shop-Frontend aktivieren/deaktivieren
  • Player Titel-Navigation aktiv (Vorheriger/Nächster Titel): ermöglicht die Steuerung der Tracklist
  • Player Abspielgeschwindigkeit-Option aktivieren: blendet die Abspielgeschwindigkeit über das Zahnrad-Icon ein/aus
  • Template Overrides aktivieren: Um eigene Templates für das Plugin zu verwenden, kopieren Sie die folgenden Originaldateien aus dem Ordner:
    „plugins/knm_audioplayer/frontend/tpl/plyr.tpl“ nach „templates/[IHRTEMPLATE]/plugins/knm_audioplayer/plyr.tpl“ und bearbeiten diese Template-Datei
  • Hauptfarbe: Farbe für Fortschrittsbalken, Lautstärkeregler und aktiven Play-Button in der Tracklist
  • Text- und Iconfarbe: Farbe für Play-Button, Zeitangabe, Lautstärke-Icon, Einstellungen-Icon, Texte sowie Icons in der Tracklist
  • Hintergrundfarbe: Farbe für Hintergrund im aktuellen Track sowie der Tracklist
  • Schlagschattenfarbe: Farbe für Schlagschatten im aktuellen Track

Der Reiter „Lizenz“ beinhaltet folgende Optionen (siehe Abbildungen 5 & 6):

Abbildung 5: Reiter „Lizenz“ – keine gültige Lizenz vorhanden

  • Lizenz abfragen: Beim Kauf wird für die angegebene Domain eine Lizenz auf dem Lizenz-Server angelegt. Über den Button wird auf diesem geprüft, ob für Deine Domain eine Lizenz des Plugins vorliegt, und welche Art von Lizenz es ist.
  • Plugin für 14 Tage testen: Fordere eine Testphase von 14 Tagen an. Nach diesen 14 Tagen läuft die Test-Lizenz ab.
  • Lizenz kaufen: Eine vollwertige Lizenz über 12 Monate ist im JTL-Extension Store zu erwerben. Hier kannst Du Deine Lizenz auch um 12 oder 24 Monate verlängern.

Abbildung 6: Reiter „Lizenz“ – gültige Lizenz vorhanden

  • Lizenz abfragen: Beim Kauf wird für die angegebene Domain eine Lizenz auf dem Lizenz-Server angelegt. Über den Button wird auf diesem geprüft, ob für Deine Domain eine Lizenz des Plugins vorliegt, und welche Art von Lizenz es ist.
  • Lizenz verlängern: Eine vollwertige Lizenz über 12 Monate ist im JTL-Extension Store zu erwerben. Hier kannst Du Deine Lizenz auch um 12 oder 24 Monate verlängern.

Der Reiter „Über“ beinhaltet folgende Informationen (siehe Abbildung 7):

Abbildung 7: Reiter „Über“ (Versionsnummer exemplarisch)

Im Reiter „Über“ findest Du Informationen zur Plugin-Version, PHP-Version, IonCube-Version, zum Plugin-Autor sowie die (Shop)-Webseite des Autors als auch zwei Buttons, über den Du das Plugin Log leerst bzw. öffnest.