Hallo, folgendes Szenario: - Shopware 5 - eigenes Theme das vom responsive Theme ableitet - eigene all.less die via @import „_modules/global“ die global.less includiert - in dieser global.less wollen wir unsere Änderungen vornehmen Frage A: Wenn man das nun kompiliert wir es in folgender Reihenfolge gemacht: - EIGENES THEME - RESPONSIVE THEME Warum kompiliert Shopware hier dann auch die global.less aus dem Responsive Theme noch mal bzw. wie kann man das unterbinden? Das ist ja eigentlich total überflüssig, weil die selben Selektoren dann doppelt vorkommen oder? Frage B: Nun haben wir das Problem das unsere global.less z.B. auch vor der register.less aus dem responsive Theme geladen wird und z.B. der selector .content überschrieben wird. (im Responsive Theme wird die register.less nach der global.less geladen). Das hat zur Folge das im Account die Formulare nicht mehr nebeneinander stehen. Was wäre hier Best Practise? Sollen wir dann die register.less auch in unser Theme kopieren? Dann würde es vermutlich stimmen, allerdings haben wir dann wieder das gleiche Problem wie unter A. Danke & Viele Grüße Oliver
Dein eigenes theme soll auch nur Änderungen / Erweiterungen beinhalten. Du sollst -nicht- die .less Dateien vom responsive kopieren und editieren. Viele Grüße
Hi, wenn ich aber einen Selektor aud der global.less ändern muss, wie soll man das dann machen? Viele Grüße Oliver
Ich verstehe das Problem immer noch nicht?! Deine Änderung kannst / sollst du natürlich in deine leere global.less aufnehmen und mit @import in deiner all.less aufnehmen. Wenn deine .less nun kompiliert wird, dann wird auch nur deine global.less mit deiner einen Änderung als css angehangen. Viele Grüße
Hi, okay verstehe schon. Blöd aber wenn man dann in der global.less doch mehr als eine Änderung hat. Dann hab ich wieder das gleiche Problem. Danke für Deine schnelle Antwort! Schönes Wochenende Oliver
Wieso?! Wo liegt da das Problem?! Ich verstehe es immer noch nicht… Viele Grüße
Hi, stell doch bitte mal ein Beispielcode rein und erkläre uns anhand dessen mal was das Problem ist. Am besten ist du baust die Struktur der global.less mit den ganzen Selektores, ids, classen, etc. nach. Ohne properties und values und dort wo du was verändern möchtest fügst du eben diese ein.
Dein Punkt A stimmt so auch nicht, dass ist genau anders herum. Erst kommt das Responsive Theme und dann dein Theme. Nehmen wir an du möchtest folgenden Code aus der originalen global.less anpassen: a { color: @link-color; text-decoration: none; } Dann legst du dir in deinen eigenen Theme ebenfalls die global.less im Ordner _modules an. Hier überschreibst du dann den Code mit deinem neuen, bspw. a { color: @text-color; text-decoration: underline; } Du überschreibst nur den Code, welchen du benötigst, nicht einfach stumpf die gesamte .less Datei kopieren. In deiner all.less - welche im root vom less Ordner liegt, importierst du deine global.less. Deine all.less sieht dann also so aus: @import "\_modules/global"; Du kannst die global.less natürlich auch anders nennen, ich behalte mir aber immer die Struktur bei, umso auch die Übersicht zu bewahren. Wenn du wenige Änderungen hast kannst du natürlich auch alles in die all.less packen. Das ganze ist eigentlich nichts anderes, als wenn du bspw. bei Bootstrap die styles anpasst.
Was kommad meinte ist, dass bei vielen Änderungen nach der von euch vorgeschlagenen Art und Weise, viele Selektoren doppelt geschrieben werden, was den Shop verlangsamt. Bei einzelnen Änderungen ists wohl nicht schlimm. Aber wenn man viel ändert, merkt man das deutlich in der Aufbaugeschwindigkeit des Shops.
Ich schreibe alle Änderungen daher direkt in die Original Responsive/Bare-Dateien und erstelle von den geänderten Dateien eine ensprechende Kopie in den Ordnern meines Themes, jedoch ohne die all.less. So wirds dann auch nur einmal geladen.
Wieso sich Shopware oder Bootstrap oder wer auch immer sowas Däm… ausgedacht hat, kann ich auch nicht nachvollziehen.
MFG
Nils
Wieso sich Shopware oder Bootstrap oder wer auch immer sowas Däm… ausgedacht hat, kann ich auch nicht nachvollziehen.
Wieso dämlich?
Das ist der Weg wie es geht, ganz einfach. In deinem Beispiel werden bei einem Update alle Dateien überschrieben, da du in den Core Dateien rumfummelst. Das ist nicht Sinn der Sache. Es ist nunmal eine Vorlage, möchte man Änderungen vornehmen, muss die Vorlage entsprechend überschrieben werden.
Wie sollte es denn deiner Meinung nach aussehen?
Und verlangsamen tut es den Shop in der Regel auch nicht … oder schreibst du 500.000k Zeilen neues CSS?
Darüber hinaus wird die .css Datei sowieso nur einmal geladen, da diese nachdem ersten laden gecached ist.