Hallo! Ich bin dabei das Template zu justieren bzw. umbauen und habe entdeckt dass das Gridsystem gar nicht konsequent benutzt wird. Zum Beispiel werden für die Breadcrumbs zwei Classes verwendet und zwar grid_16 + menu_top. Es sollte hier eigentlich die Klasse grid_20 verwendet werden da dieses DIV sowieso auf der gesamten Breite angezeigt wird, durch die Eigenschaften in menu_top. Ändert man dies aber um dann erscheint das nächste Problem. Der Hauptcontainer ist auch nicht gemäß dem Gridsystem aufgebaut. Dort wird zwar die Klasse grid_20 appliziert aber dennoch wird die Breite auf 998px verkleinert und 11px links und rechts als padding statt 10px addiert. Warum ein Gridsystem einbinden wenn man die „Regeln“ trotzdem nicht folgt und das System die ganze Zeit ausser Kraft setzt? Es ist nicht böse gemeint, sondern einfach eine konstruktive Kritik, da Shopware mir sehr gefällt und ich möchte dass auch das CSS qualitativ ist/bleibt. Eigentlich wollte ich aber fragen wie ihr diese Problematik seht und wie man damit umgehen kann…? 
Für Ideen und Tipps bin ich sehr dankbar! EDIT: Und was das ganze noch schlimmer macht ist dass es ja beim CSS keine Blöcke gibt wo ich Sachen komplett ausblenden kann. Das ganze emotion.css wird ja geerbt… Da muss ich im framework.css mit [color=red]!important[/color] amok laufen :oops:
Hallo, na ja, das Template ist hinsichtlich CSS schon etwas kreativ, aber dauernd !important verwenden muss man nicht. In der Regel reicht es aus, die Hierarchie im CSS exakter zu spezifizieren und alle eigenen CSS-Definitionen an das Ende der emotion_meintemplate.css Datei zu schreiben. Zusätzlich kann man ja bei „extremen“ Fällen die Klassen/id-Namen im Template umbenennen und in seinem CSS verwenden. Das ist zumindest meine Strategie, wenn ich !important oder lange Klassen/id-Kaskaden im CSS vermeiden möchte. Ein komplett neues Template zu schreiben wäre auf jeden Fall noch mehr Arbeit. Es werden auch viele Elemente mit absoluter Positionierung an ihren Platz befördert, dann braucht man eigentlich keine Rücksicht auf ein festgelegtes Grid zu nehmen.
[quote=„hth“]Hallo, na ja, das Template ist hinsichtlich CSS schon etwas kreativ, aber dauernd !important verwenden muss man nicht. In der Regel reicht es aus, die Hierarchie im CSS exakter zu spezifizieren und alle eigenen CSS-Definitionen an das Ende der emotion_meintemplate.css Datei zu schreiben. [/quote] Wenn man etwas ändern will ja, aber wenn ein Attribut gar nicht gesetzt sein soll, wie zB. height: XYpx, da hat man keine Chance. Es gibt ja kein height: none um den vererbten Wert aufzuheben. Egal, wahrscheinlich muss ich dass CSS komplett kopieren, dort umändern und diese Datei dann anstatt der emotion.css einbinden. [quote]Es werden auch viele Elemente mit absoluter Positionierung an ihren Platz befördert, dann braucht man eigentlich keine Rücksicht auf ein festgelegtes Grid zu nehmen.[/quote] Soweit bin ich wahrscheinlich noch nicht gekommen… :shock:
[quote]Wenn man etwas ändern will ja, aber wenn ein Attribut gar nicht gesetzt sein soll, wie zB. height: XYpx, da hat man keine Chance. Es gibt ja kein height: none um den vererbten Wert aufzuheben. Egal, wahrscheinlich muss ich dass CSS komplett kopieren, dort umändern und diese Datei dann anstatt der emotion.css einbinden. [/quote] height: 100% geht aber. Wieso das CSS komplett kopieren. Es reicht doch ein eigenes neues emotion-Template anzulegen und die einzelnen Elemente zu ändern. Es werden auch Formatierungen aus den CSS des default-Templates übernommen. Es ist wirklich der einzige Weg, mit den Developer-Tools der Browser zu schauen, welche Definition aus welcher CSS-Datei zur Anwendung kommt und zu versuchen, diese dann in der eigenen CSS-Datei zu ändern.
Genau so arbeite ich auch. Mit Firebug erstmal testen und dann übertrage ich die Änderungen in den CSS-Dateien. Nur mit Firebug kann ich eine Zeile deaktivieren damit eine “spätere” oder niedriger priorisierte Eigenschaft übernehmen kann (in dem Fall wird ja die framework.css von der emotion.css überschrieben). DAS, also das deaktivieren einer Zeile, geht ja mit normalem CSS nicht. Allerdings wäre height:100% bei dem Fall leider nicht die Lösung. Weil ich will ja dass die Regeln vom framework.css greifen können, das dürfen die ja immer noch nicht wenn ich height:100% setze.
[quote]EDIT: Und was das ganze noch schlimmer macht ist dass es ja beim CSS keine Blöcke gibt wo ich Sachen komplett ausblenden kann. Das ganze emotion.css wird ja geerbt… Da muss ich im framework.css mit !important amok laufen :oops:[/quote] Ich suche auch gerade nach einer Möglichkeit Blöcke auszublenden: Ich würde gerne das linke Menü deaktiveren aber weiß einfach nicht wie ich die Sache anpacken soll. Vielleicht hast Du da eine Idee für mich? 
Hi thedns, ich glaube das ist kein Problem, lässt sich ganz normal über die Blöcke des Templates steuern. Um das Templatesystem besser zu verstehen empfehle ich auf jeden Fall den Tutorial http://wiki.shopware.de/Schnelleinstieg … l_876.html. So habe ich angefangen und es hilft wirklich. Allerdings hat das nichts mit dem Grid zu tun…
Hallo, da ich gerade dabei bin in meinem Shop die Detailseite um zugestallten und die Thumbnail neben das Produktbild gesetzt, da ich überwiegend hohe Prokutbilder habe. In diesen Zuge habe ich ins Auge gefasst den kompletten Shop auf die Breite von 1180px zu ändern. Hätte ich im Vorfeld gewusst was da auf mich zukommt, hätte ich alles beim alten gelassen. Was mir dann auch aufgefallen war das die Grid-Klassen aus der framework.css kaum zum Einsatz kommen. So wie ich es gesehen habe werden diese Klassen zu 95% mit anderen Werten aus übergeordneten CSS überschrieben. Warum dann das Grid-System? und welche dieser Klassen werden überhaupt in Shopware verwendet. Dann hatte ich mir auf dieser Seite die Grid-Klassen für meine neue Breite berechnen lassen und hatte festgestellt das Shopware in 50px Schritten arbeitet. Ich habe es nun hoffentlich geschafft in mühseliger Kleinarbeit überall die Breite anzupassen. Gäbe es eine einfache Möglichkeit den Shop in der Breite zu ändern?