Neu ab GX3.13: Von Templates und Themes

Thema wurde von Wilken (Gambio), 20. Mai 2019 erstellt.

  1. Wilken (Gambio)

    Wilken (Gambio) Administrator
    Mitarbeiter

    Registriert seit:
    7. November 2012
    Beiträge:
    14.684
    Danke erhalten:
    5.358
    Danke vergeben:
    1.663
    Liebe Händler,

    wir haben ein spannendes 2018 hinter uns, in dem wir einige Dinge machen konnten, die euch mit euren Shops ein gutes Stück vorangebracht haben. Natürlich wollen wir auch in 2019 nicht auf der Stelle stehen bleiben, und haben weitere Dinge in der Pipeline, um euch fit für die Zukunft zu halten. Ich möchte euch heute einmal über ein Thema berichten, dass wir schon für recht bald auf der Agenda haben, und mit GX3.13 ausrollen.

    Templates sind tot! Es leben die Themes!

    Die Gestaltungsmöglichkeiten im eigenen Onlineshop sind für alle ein Thema, wir sehen unzählige Fragen zu Aspekten der eigenen Gestaltung des Shops. Wir sind im Moment ganz gut aufgestellt, aber wir wollen noch mehr für euch rausholen und Dinge besser machen. Ein Thema auf unserer Wunschliste ist dabei zum Beispiel, dass wir mehr Webdesigner für Gambio begeistern möchten, und den bereits aktiven das Leben erleichtern wollen. Natürlich greift jede Möglichkeit, mehr am Design zu machen, auch für jeden Shopbetreiber selbst, das zahlt sich immer aus.

    So weit, so klar. Wir haben nun Leute aus dem Gestaltungsdunstkreis vor einigen Monaten befragt, was wir tun müssen, um sie an Bord zu holen, oder ihnen das Leben zu erleichtern. Wir hörten dabei oft dieselben Kritikpunkte: Es ist zu kompliziert etwas zu machen, weil oft zuviel Redundanz da ist, oder weil Eingriffspunkte teilweise nicht logisch zu finden sind. Damit haben wir gearbeitet.

    Wir selbst denken auch in die Zukunft, und haben unabhängig von Externen ebenfalls einige Dinge vor, bei denen wir mehr frischen Wind in das Shopäußere bringen möchten, und euch neue Möglichkeiten bieten wollen.

    Wir haben uns also die Kritik und Wünsche, eigene und externe, zum Anlass genommen im Template einen "Frühjahrsputz" anzugehen: kräftig aufräumen, alte Leichen im Keller beseitigen, neue Strukturen anlegen, insgesamt kräftig Klarschiff machen.

    Damit man die kommende, neue Struktur nach den ganzen Aktionen von der alten unterscheiden kann, hat diese auch einen neuen Namen bekommen: wir werden in Zukunft von Themes sprechen, statt wie bisher von Templates.

    Was wird anders sein, was wie bisher?

    Honeygrid allgemein

    Honeygrid wird vor und nach dem jetzigen Umbau bis auf Weiteres weiter das Standarddesign von Gambio Shops sein. Während sich nach innen einiges ändern wird, wird es nach vorne erstmal aussehen wie bisher.

    Das bringt natürlich den unangenehmen Punkt mit sich, das eigene Templateanpassungen, die bisher passten, nicht mehr 1:1 in die neue Struktur passen werden. Es geht dabei weniger um Einstellungen aus Styleedit, mehr um Dinge wie Usermods, etc., für die man Code selbst angefasst hat. Man wird diese eigenen Templateanpassungen also zwangsweise irgendwann einmal in die neue Form bringen müssen.

    Wir verstehen dabei natürlich, dass das ein Hindernis ist, und haben überlegt wie wir das für euch soweit wie möglich entspannen können. Der Plan ist nun, erstmal alt neben neu bestehen zu lassen, Honeygrid also vorläufig 2x mit dem Shop auszuliefern.

    Das bedeutet: Man muss also nicht jetzt Knall auf Fall in die neue Welt wechseln, man wird die Möglichkeit haben sich das neue Theme in Ruhe einzurichten. Dann am Ende, wenn man fertig ist, kann man auf den Knopf zu drücken. Wir werden also eine Weile parallel alt und neu unterstützen und erst im Verlauf weiterer Updates, zu einem späteren Zeitpunkt, Honeygrid in seiner alten technischen Struktur auslaufen lassen.

    Dateistruktur eines Themes

    Der Shop besteht seit langem für das Layout aus einer großen Menge ineinander verschachtelter Bausteine. Ein “Index” als gesamtes bindet zum Beispiel erstmal den Baustein Header ein, und der Header bindet dann die Bausteine Sekundärnavigation, Logo, Kategorieleiste und so weiter ein.

    Die Bausteine selbst liegen als HTML-Templates in mehreren Ordnern verstreut, die Namen der einzelnen Dateien sind dabei historisch über die Jahre gewachsen und nicht mehr wirklich stringent und durchgängig ordentlich angeordnet.

    Das wollen wir ändern: Wir werden in Zukunft alle HTML-Templates in einem einzigen gemeinsamen Ordner ablegen, damit man sich weniger durch Dateibäume klicken muss. Wir werden gleichzeitig die Namen der Templatedateien so anpassen, dass logischer ist was darin gelayouted wird. Durch passende, einordnende Namenspräfixe werden zusammengehörige Dateien immer nah beieinander dargestellt. Da die Smartyblöcke in den HTML-Templates bislang ihren Namen direkt aus dem Dateinamen abgeleitet haben, werden diese auch sinnvollerweise neue Namen bekommen müssen.

    Weniger fertige HTML-Klötze aus dem Shopkern, mehr Layout im Theme

    Es gibt klassisch im Shop einige Stellen, an denen im Shopkern, also im funktionalen Bereich des Shops, fertige größere HTML-Brocken erzeugt werden. Diese schon vollständig im Layout ankommenden Brocken lassen sich dort nur noch sehr begrenzt gestalten, was einige Designideen bislang einfach verdirbt. Wir wollen hier noch sauberer als bislang werden, und den Layout-Prozess stärker als vorher im Theme erledigen, womit dort dann auch viele bisher quasi nicht fassbare Elemente designbar werden.

    Beseitigung von Redundanzen

    Im Template Ordner gibt es bislang mehrere Ordner für ein und denselben Zweck, zum Beispiel die Ablage von CSS oder Javascriptdateien. Wir möchten viel weiter dahin, dass es für eine Sache genau einen Ort gibt, damit die Spielregeln besser verständlich sind. Wir werden daher Gleiches stärker an gemeinsamen Orten zusammenfassen.

    Das Ende von klassischen Usermods

    In Shopversionen bis heute stellen Usermods eine Möglichkeit dar, eigene Änderungen veränderungssicher abzulegen. Dabei wird immer relativ “grob geschossen”, da immer größere Templates oder Dateien vollständig durch eigene Kopien ersetzt werden. Mit den Smartyblöcken, die es auch weiterhin geben wird, haben wir schon länger eine bessere Technologie an Bord, die allgemein große Akzeptanz gefunden hat. Wir werden das Prinzip klassischer Usermod Dateien zugunsten der moderneren, viel zielgenaueren Lösung auslaufen lassen, und den Support für klassische Usermods in Themes nicht fortführen.

    Childthemes

    Die Bedeutung von Childthemes ist, eigene Anpassungen, die man abweichend vom Standard gestaltet hat, an einem eigenen Ort zusammengefasst abzulegen. Statt die Änderungen also mitten in den schon vorhandenen Bausteinen abzulegen, nimmt man sich einen eigenen, neuen Dateiort, und legt dort nur die gewünschten Anpassungen ab. Man kann sich das dann in der Anwendung vorstellen wie einen Stapel: Ganz unten liegt das Standardtheme, dann werden, Schicht für Schicht, die eigenen Kunstwerke draufgelegt. Es zählt dann was am Ende, von ganz oben, zu sehen ist.

    Das bedeutet natürlich auch, dass Vererbung mehrfach möglich ist. Für Händlerin Susi könnte zum Beispiel zu Weihnachten gelten: Das Weihnachtstheme verändert Susis Shoptheme, Susis Shoptheme verändert das Standardtheme. Nach Weihnachten kann dann die oberste Schicht wieder abgelegt werden, und der Frühling kann problemlos kommen.

    Es wird bei dieser Struktur recht leicht möglich, einen Überblick zu bekommen und zu behalten, welche Veränderungen es in einem Shop gibt, und so neben der Vielfältigkeit auch die Wartung vereinfachen.

    Rauswurf von ungestaltbaren Dingen aus dem Templateordner

    Im Moment liefert wir beispielsweise Font Awesome im Templateordner aus. Die Symbole aus Font Awesome werden häufig und gern genutzt, die Schriftart selbst wird aber von keinem Designer verändert. Wir reden über einen Hopp oder Top Fertigbaustein. Vielleicht kommen neue, weitere Schriften als eigene Bausteine dazu, aber das ist dann eine andere Geschichte. Es macht also wenig Sinn, Font Awesome an dem Ort abzulegen, wo Gestalter einen Überblick bekommen möchten was es gibt, und stört unnötig die Kompaktheit eines Themes. Font Awesome wird natürlich im Shop vorhanden bleiben, aber an einem anderen Dateiort gelagert werden. Diese Änderung wird genauso auch andere Dinge betreffen, die viele nutzen aber niemand anpasst, so werden wir schlanker werden.

    Mehr Grafiken, weniger Schriftsymbole

    Wer schon mal versucht hat, im Shop beispielsweise das Warenkorbicon auszutauschen, wird gemerkt haben, dass das relativ schwierig ist. Wir verwenden dafür bisher eine eigene Symbolschrift, die zwar gut für die Ladezeiten ist, aber unglaublich unhandlich. Wir verschenken andersherum ziemlich wenig Performance, wenn wir an der Stelle zu einfacher fassbaren, simplen Grafiken zurückkehren. Wir sehen in der Abwägung der Alternativen dann auch den größeren Nutzen für alle in besserer Gestaltbarkeit, und wollen zugänglicher werden, darum wird die eigene Symbolschrift abgeschafft werden.

    Zum Schluss...

    Die Erklärungen zeigen euch hoffentlich verständlich den Weg auf, den wir gehen wollen. Ich hab nicht ganz alle technischen Themen beschrieben die drin sind, aber für einen EIndruck sollte das schon mal was bringen. Wir glauben, dass damit in Zukunft noch ganz andere Sachen als jetzt gestalterisch möglich werden. Wir glauben auch, dass es für das gesamte Gambio Ökosystem von handfestem Vorteil sein wird, wenn wir den Theme-Markt weiter beleben können, und nach dem Schweiß für alle dann mehr Auswahl für alle kommt. Das ist unser festes Ziel bei der Sache.

    Die technische Doku geht bald auf der Gambio Developer Seite live, da geht’s dann ins Detail.

    Wir sind gespannt auf das, was da kommen wird. Was denkt ihr? Fragen können gerne gestellt werden, wir werden versuchen sie gut zu beantworten.
     
  2. Anonymous

    Anonymous Erfahrener Benutzer

    Registriert seit:
    8. Mai 2019
    Beiträge:
    114
    Danke erhalten:
    25
    Danke vergeben:
    26
    Also ich finde es echt toll das sich in dem Sektor was bewegt. Man wird dadurch sehr viel flexibler mit dem Theme werden. Wie es Wilken schon sagt Weihnachten, Frühling etc. bin mal gespannt wie es in Zukunft weiter geht.
     
  3. WalterGestalter

    WalterGestalter Erfahrener Benutzer

    Registriert seit:
    24. Mai 2011
    Beiträge:
    209
    Danke erhalten:
    10
    Danke vergeben:
    56
    großartig! ich kanns kaum erwarten, das auszuprobieren!
     
  4. ingo_kreft

    ingo_kreft Mitglied

    Registriert seit:
    28. Februar 2019
    Beiträge:
    15
    Danke erhalten:
    0
    Hallo,
    ich wühle mich da grade durch und komme auch so langsam klar mit der neuen Struktur, doch nach den ersten Änderungen ist mir nun eingefallen, dass ich die direkt in den sccs Dateien im modules Ordner vorgenommen habe. Das sind nur ein paar kleine Änderungen an den Farben, daher ist das nicht so schlimm, aber wie genau soll ich die Änderungen den nun in der custom/_usermod.scss Datei ablegen. Einfach jede Klasse die ich ändern möchte komplett in diese neue Datei einfügen, ohne weitere Angaben zu Herkunft des Originals und einfach alles untereinander weg?
     
  5. Joachim Schubert

    Joachim Schubert Erfahrener Benutzer

    Registriert seit:
    15. Juni 2012
    Beiträge:
    288
    Danke erhalten:
    6
    Danke vergeben:
    132
    Habt Ihr selbst einen Testshop wo man sich die Änderungen mal vorab ansehen kann, wie sich das Ganze in etwa auswirkt.

    GIBTS DAZU EINEN LINK?
     
  6. Wilken (Gambio)

    Wilken (Gambio) Administrator
    Mitarbeiter

    Registriert seit:
    7. November 2012
    Beiträge:
    14.684
    Danke erhalten:
    5.358
    Danke vergeben:
    1.663
    Es ist ein wenig schwierig das unmittelbar in einem Testshop zu zeigen, weil man das hier beschriebene nicht direkt sieht. Wenn alles gut ist, sieht es erstmal vorher und hinterher gleich aus. Es geht ja bei der Nummer erstmal um technische Struktur unter allem, und die sieht man eben nicht im Browser.

    Man könnte das sehen, was in Folge damit möglich wird, zum Beispiel wie man eigene Templatewünsche schneller und kompakter technisch umsetzen kann, dazu müsste man aber auch selbst fummeln. Dann gibts den Appstore, mit dem man solche technisch neuen Themes installieren kann, der aber aktuell nur wenige erste Sachen enthält, das ist ja alles auch noch neu. Ich glaube da hättest du am Ende aber auch eher ein "Oha! Appstore"-Erlebnis, und würdest wiederum nicht sehen wie sich das ganze hintenrum wirklich abspielt, und das dem Thema Appstore zurechnen...
     
  7. Joachim Schubert

    Joachim Schubert Erfahrener Benutzer

    Registriert seit:
    15. Juni 2012
    Beiträge:
    288
    Danke erhalten:
    6
    Danke vergeben:
    132
    ich wollte auf einen Testshop verzichten....... :) ABER schauen wir mal und warten ab .....
     
  8. Anonymous

    Anonymous Mitglied

    Registriert seit:
    24. Februar 2018
    Beiträge:
    17
    Danke erhalten:
    3
    Danke vergeben:
    25
    Tolle Sache und sehr innovativ, vielen Dank an das Gambio Team!

    Ich freue mich sehr ab dem neuen Themen System.
    Bin bereits fleißig am Testen und ausprobieren.

    Dass nun die Icons einfacher ersetzt werden könne, zum Beispiel der Warenkorb, das freut mich sehr.
    War zwar vorher auch möglich, aber ein ziemliches „gefummel“.

    Ich habe bereits im StyleEdit die neue Icons Einstellungen gesichtet.
    Mir ist aber noch nicht klar, wo ich die Icons ersetzen kann, bzw. wo ich die neuen Bilder hochladen muss?

    Hab nichts in dem aktuellen Handbuch gefunden, gibt es eine aktuelle Anleitung zum neuen Update?

    Dankeschön! :)
     
  9. Anonymous

    Anonymous Erfahrener Benutzer

    Registriert seit:
    8. Mai 2019
    Beiträge:
    114
    Danke erhalten:
    25
    Danke vergeben:
    26
    Ich finde das mit den Themen besser, hier lassen sich die Themen jeweils separat mit dem SE3 bearbeiten und zudem noch in die verschiedenen Ausführungen anlegen und bearbeiten. Als Beispiel das Theme Yellow das ja über die ganze Breite geht... Hier kann man einfach im SE3 das Theme einfach neu als Boxed anlegen. Finde Ich sehr toll was da in Zukunft möglich wird und mal sehen wann die Gambianer hier die ersten Themes bereit stellen.
    Gute Weiterentwicklung @Gambio ! Danke
     
  10. Anonymous

    Anonymous Erfahrener Benutzer

    Registriert seit:
    14. Juni 2018
    Beiträge:
    757
    Danke erhalten:
    61
    Danke vergeben:
    407
    Im GX 13 Testshop eben mal das neue Theme aktiviert, um zu schauen was sich ändert / wie es aussieht.

    Von meinem Shop war nicht viel wiederzuerkennen, ich bekam schon Schweissperlen auf der Stirn in der Sorge nun alles quasi von vorne zu machen...

    Dann ist mir im Style Edit aber aufgefallen das dort noch gar kein Profil drin ist. Also mal auf Gut Glück mein exportiertes Profil aus dem alten Honeygrid hochgeladen. Puh....das sieht schon besser aus! :)

    Werde mal weiter rumschauen und versuchen das neue System zu verstehen & hoffe es gibt dann auch noch paar hilfreiche Tutorials.

    Soviele Änderungen hatte ich via USERMOD eigentlich gar nicht gemacht - die größte und mir wichtigste war eigentlich nur, dass die Kurzbeschreibung der Artikel in der Preisbox angezeigt wird. Das war über eine Usermod in der module -> product_info -> standard-USERMOD gelöst mit dem folgenden Code:

    Code:
            {if $PRODUCTS_SHORT_DESCRIPTION || $SHOW_PRODUCTS_SHORT_DESCRIPTION}
            <span class="short">
                {$PRODUCTS_SHORT_DESCRIPTION}
                <br>
            </span>
    {/if}
    Ganz blöd gefragt: Wo müsste ich diesen Code jetzt unterbringen um das selbe Resultat zu erreichen?
    Usermods werden ja nicht mehr länger unterstützt also wo müsste der Code in Zukunft verbaut werden?
    Habe hier mehrfach was von Smarty Blöcken gelesen und auch schon div. Artikel dazu "überflogen" aber bislang hat es leider noch nicht "Klick" gemacht ;)
     
  11. Anonymous

    Anonymous Erfahrener Benutzer

    Registriert seit:
    22. September 2011
    Beiträge:
    766
    Danke erhalten:
    73
    Danke vergeben:
    107
    warscheinlich bin ich blind! Ich habe bisher nicht gefunden wie ich das neue Theme aktivieren kann.
     
  12. Anonymous

    Anonymous Erfahrener Benutzer

    Registriert seit:
    14. Juni 2018
    Beiträge:
    757
    Danke erhalten:
    61
    Danke vergeben:
    407
    Es ist ab GX 3.13 im Admin unter --> Shop Einstellungen --> Mein Shop
    Relativ weit unten ist ein Dropdown: "Templateset (Theme)"

    Hatte es zunächst auch eher bei "Darstellung --> Template Einstellung" vermutet....
     
  13. Anonymous

    Anonymous Erfahrener Benutzer

    Registriert seit:
    22. September 2011
    Beiträge:
    766
    Danke erhalten:
    73
    Danke vergeben:
    107
    @DrGuu
    Danke dort hätte ich es nicht gesucht
     
  14. Wilken (Gambio)

    Wilken (Gambio) Administrator
    Mitarbeiter

    Registriert seit:
    7. November 2012
    Beiträge:
    14.684
    Danke erhalten:
    5.358
    Danke vergeben:
    1.663
    Die Einstellung wird da nicht mehr ewig wohnen, das wird ein GX 3.15 Thema.
     
  15. Anonymous

    Anonymous Mitglied

    Registriert seit:
    24. Februar 2018
    Beiträge:
    17
    Danke erhalten:
    3
    Danke vergeben:
    25

    Ich habe inzwischen das neue Service Pack v3.13.1.1 erfolgreich eingespielt.

    Hat bitte jemand noch eine Antwort oder Hilfe zu meiner Frage, ich wäre sehr dankbar.
     
  16. Dennis (Print-Weilburg.de)

    Dennis (Print-Weilburg.de) G-WARD 2013/14/15/16

    Registriert seit:
    22. September 2011
    Beiträge:
    30.048
    Danke erhalten:
    5.814
    Danke vergeben:
    1.039
    Beruf:
    Mann für alles :)
    Ort:
    Weilburg
    (Link nur für registrierte Nutzer sichtbar.)
    vielleicht hilft dir das ja
    Meist muss man die Blöcke bearbeiten.
     
  17. Anonymous

    Anonymous Mitglied

    Registriert seit:
    24. Februar 2018
    Beiträge:
    17
    Danke erhalten:
    3
    Danke vergeben:
    25
  18. Anonymous

    Anonymous Erfahrener Benutzer

    Registriert seit:
    11. Februar 2015
    Beiträge:
    1.181
    Danke erhalten:
    352
    Danke vergeben:
    204
    Liveshop erfolgreich von Honeygrid auf Themes umgestellt.
    2 Drittanbietermodule funktionieren nun nicht mehr, aber damit habe ich gerechnet.
    Et looft ;)
     
  19. M. Zitzmann

    M. Zitzmann Erfahrener Benutzer

    Registriert seit:
    3. März 2016
    Beiträge:
    110
    Danke erhalten:
    34
    Danke vergeben:
    7
    Dazu eine Frage:
    Ich möchte im Theme Honeygrid ein paar Änderungen machen. Dazu verwende ich in den Ordner GXModules/MeinName/MeinModul/Shop/Themes/Honeygrid/
    Die Struktur habe ich aus der Gambio Erweiterung TwoFactorAuth übernommen.
    Hier habe ich ein paar html Dateien (gleicher Name wie im Theme Honeygrid) hochgeladen.
    Bei einigen Dateien wird die Änderung angenommen bei anderen wieder nicht.

    Was muß ich hier beachten?

    Gruß
    Mike
     
  20. Dennis (Print-Weilburg.de)

    Dennis (Print-Weilburg.de) G-WARD 2013/14/15/16

    Registriert seit:
    22. September 2011
    Beiträge:
    30.048
    Danke erhalten:
    5.814
    Danke vergeben:
    1.039
    Beruf:
    Mann für alles :)
    Ort:
    Weilburg
    Im Theme haben sich Dateinamen und Strucktur verndert teilweise. da musst ggf. andere Dateinamen / Ordner innerhalb nutzen.