Neu JTL Template und Themes CSS Chaos

froot

Gut bekanntes Mitglied
27. April 2021
210
11
Könnte mir mal jemand BITTE erklären wie das mit den Templates und Themes und so funktioniert?
Ich finde das Ganze extrem hochtrabend, komplex und irgendwie unlogisch und komme einfach nicht zurecht.
Ich mach ja viel mit CSS für andere Kunden aber was sich JTL- Shop da ausgedacht hat sucht seinesgleichen.
Und sonderlich zeitsparend und einfacher macht es einem das Leben nicht, also wozu überhaupt?

Es gibt Templates und Templates- Cache (der Ordner templates_c, ist das der der gelöscht wird wenn ich Templates-Cache lösche?)
Es gibt also Templates und Child-Templates. Ich verstehe dass man im Child-Template-Ordner nur jede Dateien hat die die Datei im Parent-Template-Ordner überschreiben soll.
Dann gibt es Themes und dort gibt es einen base-Ordner, was macht der? Es ist natürlich anzunehmen, dass das ähnlich funktioniert, sehe es aber nicht.
Dann gibt es einen sass-Ordner, was macht der??
Dann gibt es _crit.css und .map und .save und .scss?

Und dann gibt es noch das JTL-Theme-Editor-Plugin, was macht das genau? Bearbeitet dass die Dateien die im File-System liegen? Ist nämlich wie so vieles auch nicht wirklich intuitiv…
Links sehe ich dort checkboxes neben den verschiedenen Files und wenn ich draufklicke um es anzusehen wird es sofort kompiliert?
Dort seh ich auch _footer.scss ohne checkmark und ausgegraut und ich kann es mir nicht ansehen.

Und dann gibt es noch die Template-Einstellungen wo ich gewisse Farben definieren kann und irgendwie wird das immer ignoriert, ich nehme an das ist ein Bug aber sicher bin ich mir nicht.

Und es gibt noch so viel mehr hier zu wissen, die template.xml, die Bootstrap.php, es scheint alles so unnötig kompliziert.

Was ist gern hätte ist meine eigene CSS anwenden (custom.css), die immer angewendet werden soll, wo muss die liegen? Macht überhaupt dass Sinn mit einer eigenen CSS-Datei oder soll ich die bearbeiten die JTL verwendet?
Und dann bräuchte ich jeweils eine CSS für verschiedene Themes (zB. zu Weihnachten) wo (zurzeit) lediglich ein paar andere Farben und so definiert sind. Wie soll ich da vorgehen?

Oder ich hab einfach selber hier ein Durcheinander und normalerweise funktioniert es super? kA

Bin für Hilfe sehr dankbar.

EDIT: Ahja, nochwas: Wenn ich im Browser mal ein HTML-Element inspiziere um ausfindig zu machen wo sich die angewendete CSS-Regel befindet, und dort steht "(index):44", heißt das, das ist irgendwo inline definiert? Wenn ja, dann wo ist das inline? Wo ist zB. für den footer die Datei? Ich frage weil in footer.tpl sehe ich keinerlei inline-CSS-Regeln…
 
Zuletzt bearbeitet:
  • Gefällt mir
Reaktionen: WACOR GmbH

css-umsetzung

Offizieller Servicepartner
SPBanner
6. Juli 2011
7.707
2.165
Berlin
Hört sich jetzt blöd an, ist aber nicht so gemeint.
Ich glaube wir müssen da bei dir ganz am Anfang anfangen.

Das sind eine Menge Fragen die sich nicht alle, auf die schnelle beantworten lassen.

Template cache leeren bedeutet das du die cache Dateien in deinem child Template Ordner im temlates_c löschst.
Wenn du ein Element im Browser überprüfst, und was von index:blabla siehst, dann handelt es sich um css, welches über die critical_css eingebunden wurde, Diese Datei wird nicht wie üblich zum laden eingebunden, sondern deren Styles kommen direkt, bevor die Elemente der Seite im body geladen werden, damit sorgt man dafür (wenn man es richtig angeht), dass der CLS im günstigsten Fall null ist. Das ist also wichtig.

Du kannst deine custom.css weiterhin verwenden, diese liegt im theme Ordner von deinem Child. Wenn du aber den CLS beachten möchtest (und das solltest du) dann ist deine custom eigentlich nur dafür geeignet, Farben zu ändern.

Das base ist im Grunde das Grundgerüst für den Shop, erst die sass Dateien im jeweiligen Theme sorgen für die unterschiede.
du solltest nicht den Theme Editor und die Funktion im Template verwenden, sondern dich auf eines beschränken, die Einstellungen im Template (sass und Variablen) machen für mich nur Sinn wenn ich kein Child Template habe.
Habe ich ein Child, dann definiere ich andere Farben über die _variables.scss

Das Erstellen der css Dateien über sass oder less ist die heutzutage übliche Variante wenn man mit großen css Dateien arbeitet, ich glaube nicht das du 130kb css Code schreiben möchtest, dass macht man eben heutzutage modular, so das für den Programmierer einfacher ist, Fehler zu finden oder im nachhinein Dinge zu ändern.
Die einzelnen Dateien werden dann über den compiler, in deinem Fall Theme Editor zusammengefasst.

über die Bootstrap kann ich mein Template um Funktionen erweitern ohne im Core rummurksen zu müssen, ist für dich nicht interessant, wenn du kein PHP kannst oder keine zusätzlichen Funktionalitäten benötigst.

Das war jetzt eine kleine Kurzfassung die dich hoffentlich etwas beruhigt :).
 
  • Gefällt mir
Reaktionen: froot

froot

Gut bekanntes Mitglied
27. April 2021
210
11
Danke erstmal, das hilft.

Wenn ich das also richtig verstehe, dann hab ich eine _crit.css in der ich alles anpasse, was vom default NOVA-Template abweicht, und zwar Layout, Typographie.
Theme-spezifische Sachen (zB. andere Farben oder Bilder zu Weihnachten) halte ich ausschließlich in css-Dateien im jeweiligen Theme-Ordner fest – oder?

Wenn das stimmt bleibt noch die folgende Unklarheit:
Das base ist im Grunde das Grundgerüst für den Shop, erst die sass Dateien im jeweiligen Theme sorgen für die unterschiede.

Wenn das nämlich so ist, warum liegt dann nochmal ein sass-Ordner im base-Ordner?
Ich glaube ich hab ein ziemliches Durcheinander, siehe Screenthot…

Screenshot 2025-03-31 at 16.39.50.png

Werden irgendwelche Dateien eigentlich automatisch generiert? Was ist mit .original und .map und .scss ?

Danke für Deine Hilfe!
 

froot

Gut bekanntes Mitglied
27. April 2021
210
11
hier noch ein Screenshot. Wie du siehst sind im Theme-Ordner ähnliche Dateien wie im sass-Unterordner.
Das ist wohl falsch?

Screenshot 2025-03-31 at 17.07.18.png


Sollte es eher so aussehen: (?)

Code:
├── NOVAChild
│   └── themes
│       ├── base
│       │   ├── images
│       │   └── sass
│       │       ├── base.css // hier das Grundgerüst
│       │       ├── base.scss // oder hier
│       │       └── base_crit.css // oder hier?
│       │       └── base_crit.scss // oder doch lieber hier?
│       ├── normal
│       │   ├── images
│       │   └── sass
│       │       ├── normal.scss
│       │       └── normal_crit.scss // hier minimale Anpassungen wie Farben
│       └── xmas
│           ├── images
│           └── sass
│               ├── xmas.scss 
│               └── xmas_crit.scss // hier minimale Anpassungen wie Farben
 

css-umsetzung

Offizieller Servicepartner
SPBanner
6. Juli 2011
7.707
2.165
Berlin
also was dafür sorgen kann, dass dein Layout beim Aufbau nachträglich wackelt, z.B:
eine Box, die normalerweise 200px hoch und breit ist und du veränderst die auf 400x400, dann sollte so etwas in der critical stehen.

Farbänderungen eher in der normalen Datei.

Die Datein die in im Base stehen lässt du vorzugsweise unberührt, das gibt sonst bei jedem Update nur Chaos, versuche lieber das was du ändern möchtest über die critical, die _variables oder eben der normalen Sass Datei zu ändern.

Du darfst in den sass Dateien auch normales css Verwenden, wenn du mit den Dingen die dir sass bietet nicht vertraut bist.

Wenn du mit dem Theme Editor eine Datei speicherst, legt er die alte als .original an, das ist also nur ein Backup.
 

froot

Gut bekanntes Mitglied
27. April 2021
210
11
Danke!
Ich bin allerdings gerade ein bisschen am Verzweifeln, hab alles aufgeräumt so wie besprochen, und jetzt suche und suche ich wo denn nun die CSS-Regel definiert ist die dennoch Probleme macht oder fehlt.
Anscheinend in xmas.css aber wenn ich schaue steht da nix. Cache geleert, neu kompiliert alles probiert.
Was bedeutet es wenn da in der Console steht: xmas.css, plugin.css?5.4
Heißt das, dass es dennoch über den JTL-Theme-Editor angepasst werden musst oder angepasst wurde?
Hättest du vielleicht kurz Zeit dir das anzuschauen? So rumraten ist echte Zeitverschwendung und man lernt nix dabei obwohl ich eh versuche es zu verstehen.
 
Ähnliche Themen
Titel Forum Antworten Datum
Neu Remake Template - Die barrierefreie, ultimative Lösung für etablierte Marken und anspruchsvolle JTL-Shops Templates für JTL-Shop 6
Neu JTL Shop (anderes Template) eigene Felder aus Wawi als TAB im Shop User helfen Usern - Fragen zu JTL-Wawi 12
Neu Nova Child Template für JTL Shop 5.5 defekt? Installation / Updates von JTL-Shop 5
Neu Biete Premium-Lizenzen für JTL-Shop 5 – Template & Plugins Dienstleistung, Jobs und Ähnliches 0
Kunden UStID wird nicht aus Amazon in JTL übermittelt Amazon-Anbindung - Fehler und Bugs 1
Neu Wareneingang ohne JTL-WMS Mobile: Umständlich?! Arbeitsabläufe in JTL-WMS / JTL-Packtisch+ 0
Neu JTL 1.10.13 - Beta neue Oberfläche funktioniert nicht JTL-Wawi - Fehler und Bugs 1
Neu Freitexte aus Shopware in JTL Allgemeine Fragen zu JTL-Shop 6
Probleme beim Import von eBay-Produkten in JTL – neue Artikel werden nicht übernommen eBay-Anbindung - Fehler und Bugs 5
Neu Sortierung Artikel Wawi - JTL Shop Allgemeine Fragen zu JTL-Shop 1
Neu Massive Probleme mit JTL-Connector zu Shopify – lohnt sich der Einsatz überhaupt? Shopify-Connector 6
Keine Anmeldung möglich bei JTL WAWI JTL-Wawi 1.9 0
Neu Ist JTL-POS mit dem SumUp 3G+ kompatibel? JTL-POS - Fragen zu Hardware 1
Neu Fragen zur Elster-Anmeldung – iMin Falcon 1 & JTL-POS Allgemeine Fragen zu JTL-POS 6
Neu JTL WaWai Artikel aus Angebote von Plattformen Amazon+Otto erstellen Einrichtung und Installation von JTL-eazyAuction 0
Teilrechnung erstellen mit JTL Packtisch JTL-Wawi 1.10 4
Neu Shopware 6.6.10.2 Abgleich zu JTL | Bilder Übertragung Fehler: Path cannot be empty Shopware-Connector 0
Neu Eigene Felder - Sortierung wird nicht in JTL Shop übernommen - Anzeige im Shop immer unterschiedlich User helfen Usern - Fragen zu JTL-Wawi 0
Neu JTL Connector Shopify Abgleich Problem Shopify-Connector 1
Neu Aktueller Installationsleitfaden / Softwareempfehlung für JTL Wawi 1.10.x im Netzwerk User helfen Usern - Fragen zu JTL-Wawi 2
JTL-FFN aus JTL-WaWi entfernen JTL-Wawi 1.9 0
JTL Wawi App (Ipad iOS) mit Wawi System 1.9.6.5 verknüpfen JTL-Wawi App 1
Neu JTL-Shop Lieferanten Artikelnummer und Suchbegiffe für Onlineshop werden im Shop nicht gefunden Allgemeine Fragen zu JTL-Shop 5
Neu JTL PayPal Checkout nach Updatefehler 2.0.0 doppelt vorhanden Plugins für JTL-Shop 3
Neu Behandlung von JTL Shop Coupons und Retouren in JTL Wawi Arbeitsabläufe in JTL-Wawi 0
Neu JTL-Stammtisch Köln am 10.7.2025 – powered by go eCommerce Messen, Stammtische und interessante Events 0
JTL Wawi REST API 0.0.0.0 JTL-Wawi 1.10 4
keine Eazybusiness Datenbank beim öffnen von JTL WaWi JTL-Wawi 1.7 3
JTL Connector <-> JTL WAWI Keine neune Importe von Aufträgen JTL-Wawi 1.9 0
Neu Rückzahlungen aus JTL Wawi direkt auslösen User helfen Usern - Fragen zu JTL-Wawi 0
Währungsproblem | Shopify --> JTL JTL-Wawi 1.9 3
Neu Fehler beim JTL-Worker – "Der Remoteserver hat einen Fehler zurückgegeben: (502) Ungültiges Gateway" (Shopify) JTL-Wawi - Fehler und Bugs 2
Neu JTL-Wawi startet nicht - Datenbank kaputt JTL-Wawi - Fehler und Bugs 5
Neu Welche Alternativen zu JTL-Shop JTL-Shop - Ideen, Lob und Kritik 9
Neu Plugin-Update 2.4.1: JTL Exportformat Google Shopping Plugins für JTL-Shop 6
Neu Wie lange ist der JTL Token gültig? Ich bekomme rel. schnell die Meldung "Fehlerhafter Token" User helfen Usern - Fragen zu JTL-Wawi 0
Artikel Reiter "retail" (unser Name für JTL-POS) fehlt unter Sonderpreis JTL-Wawi 1.10 1
Neu JTL Shop 5.5.1 Lieferland kann bei abweichender Lieferadresse nicht ausgewählt werden JTL-Shop - Fehler und Bugs 9
Neu JTL Shop: Ausblenden von Unterkategorien (In der Mitte) möglich ? Allgemeine Fragen zu JTL-Shop 0
JTL Retoure Umtausch anlegen und Rest erstatten JTL-Wawi 1.9 1
Neu JTL Shop 5.5 Tips für bessere Performance? Allgemeine Fragen zu JTL-Shop 5
Neu JTL Debug 2.0.4 und Shop 5.5.2 - Fehler 500 Plugins für JTL-Shop 3
Neu Sprechende URLs & Sprachlogik im JTL-Shop – Wer hat’s schon umgesetzt? Allgemeine Fragen zu JTL-Shop 1
Neu JTL-WMS Aufträge lassen sich nicht teilliefern, erst nach Neustart JTL-Wawi - Fehler und Bugs 2
Neu Keine Verbindung zu JTL Extension Store JTL-Shop - Fehler und Bugs 4
Neu JTL Shop 5.5.2 Startseite Breite ändern Allgemeine Fragen zu JTL-Shop 1
Neu .php-cs-fixer.php - nicht identisch mit den Dateien der aktuellen Version von JTL-Shop JTL-Shop - Fehler und Bugs 3
JTL WaWi 2 Mandanten - B2B und B2C Artikel und Bestände automatisch abgleichen JTL-Wawi 1.6 3
Neu JTL Shopify Anbindung - Falscher Bruttopreis bei 7% Artikel, Grundpreise werden nicht übermittelt Shopify-Connector 3
Neu JTL-Shop: Anzeige der Artikel aus untergeordneten Kategorien Allgemeine Fragen zu JTL-Shop 2

Ähnliche Themen