Vorstellung: Warly Slideshow 2.0

  • Wie viele von euch bereits wissen, steht auch für die Slideshow der nächste große Versionssprung an. Es gab viel Feedback und Feature-Wünsche und viele davon finden ihren Weg in Warly Slideshow 2.0.


    Wie bei Boxxer werde ich hier in der nächsten Zeit bis zum Release die einzelnen Features vorstellen.

    Buttons

    Bisher war es nur möglich einen Button pro Element zu definieren. Mit der nächsten Versionen können beliebig viele Buttons erstellt werden. Außerdem kann die Reihenfolge geändert, ein Icon hinzugefügt oder festgelegt werden ob es ein normaler oder Primary Button sein soll. Damit das Ganze bei mehreren Buttons nicht unübersichtlich wird, gibt es eine neue kompaktere Ansicht als bisher:



    Die Icon-Position kann über die Einstellungen global festgelegt werden.


    Nach aktueller Planung wird Warly Slideshow 2.0 vollständig kompatibel zu 1.0 vorhandene Elemente übertragen. Eigene dynamische Slideshows werden voraussichtlich auch mit der Version 2.0 kompatibel sein. So wird buttonTitle und buttonURL weiterhin unterstützt, aber als @deprecated markiert.

  • Ist ja nicht schlimm, dauert nur halt länger als gedacht. Habe aber gewusst, warum ich die neue Darstellung in 2.0 geschoben habe :) Ich setze ja auch nicht nur deine Darstellung um, sondern stelle die Konfiguration um, sodass deine Darstellung und andere erst möglich wird.

  • Hör doch bitte mal mit dem pushen auf. Er wird schon was schreiben, wenn es was zu schreiben gibt.

    Hallo


    1). Hab ich auch eine Idee in die neue Version mit einfließen lassen wo es mir wichtig da auch Infos zu bekommen ob es was neues gibt.


    2). Ich kann es nicht verstehen das hier immer andere sowas schreiben. Mir hat Warly mal geschrieben ich soll und kann hier immer mal wieder nachfragen. Und das mach ich.

  • Mir hat Warly mal geschrieben ich soll und kann hier immer mal wieder nachfragen.

    Das ist mir ehrlich gesagt nicht bewusst :/

    Mehrfaches nachfragen führt zumindest nicht dazu, dass ich schneller daran arbeite oder früher etwas neues schreibe.


    Mich freut es, dass das Interesse groß ist, bei der Entwicklung der 2. Version ist mir aber aufgefallen, warum viele der neuen Features erst jetzt kommen. Viele davon bedeuten enormen Aufwand und Kompromisse zwischen Abwärtskompatibilität, Konfigurierbarkeit und Intuitivität. Nichts desto trotz wird es heute noch ein Update zum aktuellen Stand geben. Die neuen Darstellungen sind zwar noch nicht vollständing implementiert, aber so weit, dass ich es vorstellen kann.


    Da sich die Entwicklung noch zieht, peile ich aktuell den 1. Geburtstag der Slideshow, 6. Juli, für einen Release der 2. Version an. Aber auch das kann sich noch ändern.

  • Wie angekündigt geht es diese Woche weiter mit der Vorstellung neuer Features für die kommende Warly Slideshow 2.0.

    Neue Darstellungen (In Entwicklung)

    Die neue Version erweitert die bisherigen Darstellungsmöglichkeiten und bietet dadurch noch mehr Flexibilität:

    • Der Abstand der Box zum Slideshowrand ist konfigurierbar
    • Die Breite/Höhe der Box lässt sich einzeln konfigurieren und bietet die Optionen: Dynamisch, Drittel/Hälfte/Zwei Drittel/Gesamte Breite/Höhe der Slideshow
    • Die Navigation kann innerhalb oder neu auch außerhalb der Slideshow darstellen
    • Ob das Bild nur im sichtbaren Bereich angezeigt werden soll (Diese Option ist nur dann sinnvoll, wenn der Abstand der Box zur Slideshow 0px ist, die Box entweder die gesamte Breite oder die gesamte Höhe einnimmt und der Stil "Einfarbig" eingestellt wurde)

    Wie bei allen Eigenschaften, lassen sich auch diese Global, pro Slideshow oder pro Element konfiguirieren.




    Wie in der Vorschau zu sehen wurde auch das Artikel-Template angepasst und unterstützt jetzt auch Labels und den Teasertext.

    Hinweis: Die neuen Darstellungen erforderten einen größeren Umbau der Templates. Solltest du eigene/angepasste Templates verwenden, müssen diese für die Warly Slideshow 2.0 angepasst werden.

    Hintergrundbild für die Slideshow

    Was Elemente können, kann jetzt auch die Slideshow selber. Ein Hintergrundbild für die Slideshow befindet sich permanent im Hintergrund und so lässt sich z.B. die Slideshow auf der Startseite von warly.de auch ohne dem immer gleichen Hintergrundbild und Parallax Effekt umsetzen. So lassen sich dann drei Ebenen an Bildern für tolle Effekte über einander stapeln.

    Individuelle Höhe für Desktop/Tablet/Smartphone

    Bekannt von Warly Boxxer lässt sich die Höhe auch in Warly Slideshow für die drei Gerätegrößen manuell festlegen. Aktuell ist dies nur pro Slideshow konfigurierbar und noch nicht über die globale Konfiguration. Hier muss ich noch schauen wie und ob ich das in der Konfiguration unterbringen kann.



    Ken-Burns-Effekt

    Für eine noch dynamischere Slideshow lässt sich das Hintegrund mit einem Ken-Burns-Effekt versehen. Hier lässt sich zwischen Reinzoomen und Rauszoomen wählen.

    Kleinere Verbesserungen

    • Standardmäßig lädt die Slideshow alle Bilder vor um einen geschmeidigen Wechsel zu ermöglichen. Mit der Version 2.0 lässt sich dieses Verhalten deaktivieren. Zusätzlich werden alle Bilder mit loading="lazy" versehen, sodass sie dann erst geladen werden, wenn der Nutzer zu der Slideshow gescrollt hat
    • Deaktivierung des automatischen Wechsels bei Hover: Bisher wechselte die Slideshow ungehindert die Elemente durch. Wenn man jetzt mit der Maus über die Slideshow fährt wird sie angehalten, sodass man in Ruhe den Text lesen oder einen Button klicken kann.



    Ich hoffe euch gefallen die neuen Features und das die Konfiguration der Slideshow nicht zu viel wird. Aktuell sind bereits 10 neue Optionen hinzugekommen. Das bietet zum einen größere Flexibilität aber dadurch wird es auch unübersichtlicher. Ich gehe aber davon aus das, obwohl man viele Eigenschaften auch in den Slideshows/Elementen individuell konfigurieren kann, dass die meisten davon einmal unter "Konfiguration > CMS > Slideshow" gesetzt werden.


    Drei Features fehlen noch. Die kommen dann in der nächsten und letzten Vorstellungsrunde :)