So da jetzt mein Erweitertes Menü endlich funktioniert und ich es auch bereits zentriert habe, kann es mit dem nächsten Schritt weitergehen, wo ich - mal wieder - aufm Schlauch stehe. Ich möchte oben im Shop die Elemente „Suche“ und „Service/Hilfe“ komplett ausblenden (auf dem Bild schwarz umrundet), das Herzchen Icon rausfetzen und Log-In sowie Warenkorb (auf dem Bild rot umrundet) auf die Größe des Herzchens bringen. Wenn ich nur „dislpay: none;“ verwende, bleiben die konturen der Flächen leider vorhanden. Die Main Navigation sollte dann nach oben „rutschen“, wo jetzt die Suche ist… aber da ich da mal wieder nicht weiterkomme: bräuchte ich mal wieder nen Schubbser…
Ich habe die Lösung für mein Problemchen leider immer noch nicht gefunden. Muss aber auch sagen, dass ich mich mit less noch nicht soooo gut auskenne und nicht so viel traue zu ändern… zumindest nicht so ganz ohne Unterstützung. Ich hoffe, dass jemand so nett ist und sich meiner annimmt. Ich sage auch ganz artig: Danke schön
Ich rate dir direkt in Blockstruktur der Engine zu gehen. Da die Zeile (Suche + Icons) in einer
stecken, bringt dir der Weg über das reine LESS keine saubere und ordentliche Lösung. Kannst es da höchstens über absolute Positionierung machen - aber ich rate davon ab.
Als Laie würde ich aber auch nicht so in den Blöcken rumspielen…einige Plugins könnten bei falscher Bearbeitung nicht mehr funktionieren, künftige Updates nicht richtig laufen oder Funktionen einschränken.
Hast du bereits Erfahrungen mit der Smarty Engine und dem Block- und Vererbungsaufbau von Shopware?
Ich habe die Lösung für mein Problemchen leider immer noch nicht gefunden. Muss aber auch sagen, dass ich mich mit less noch nicht soooo gut auskenne und nicht so viel traue zu ändern… zumindest nicht so ganz ohne Unterstützung. Ich hoffe, dass jemand so nett ist und sich meiner annimmt. Ich sage auch ganz artig: Danke schön
Hallo,
die sauberste Lösung ist immer, die Blöcke dafür zu entfernen, wenn dieser Bereich überhaupt nicht mehr genutzt werden soll (beispielsweise bei langsam ladenden Shops, damit es nicht kurzzeitig doch angezeigt wird).
Dazu musst du ein eigenes Theme erstellen und in der entsprechenden Datei über die Shopware Vererbung den Block überschreiben ( Getting started with Shopware templating ), beispielsweise das Ausblenden des Service/Hilfe - Bereichs über eine Datei topbar-navigation.tpl in Verzeichnis „frontend/index“ mit dem Inhalt:
ist damit die all.less gemeint, oder muss ich eine andere *.less Datei erstellen? Es ist mal wieder typisch Montag… wahrscheinlich steh ich voll aufm Schlauch :-/
In der all.less importierst du nur weitere less-Files.
Alles was du in der all.less brauchst ist z.B. folgender Inhalt:
@import „header“;
Zusätzlich erstellst du dann in diesem Verzeichniss eine Datei namens „header.less“ und einen Ordner namens „_header“.
In der header.less importierst du wiederrum alle less-Files, welche sich im Ordner _header befinden, z.B. so:
@import „_header/navigation“;
Die LESS Anpassungen für die Navigation kannst du dann z.B. in die navigation.less im Ordner „_header“ einbauen.
Mann kann natürlich alle Änderungen direkt in die all.less einbauen, aber um eine saubere Struktur zu haben, wird es eher so empfohlen wie oben beschrieben.
In der all.less importierst du nur weitere less-Files.
Alles was du in der all.less brauchst ist z.B. folgender Inhalt:
@import „header“;
Zusätzlich erstellst du dann in diesem Verzeichniss einen Ordner namens „_header“ und eine Datei namens „header.less“.
In der header.less importierst du wiederrum alle less-Files, welche sich im Ordner _header befinden, z.B. so:
@import „_header/navigation“;
Die LESS Anpassungen für die Navigation kannst du dann z.B. in die navigation.less im Ordner „_header“ einbauen.
OK dann hab ich das zumindest schon mal richtig verstanden. Ich habe jetzt alles so gemacht, wie Sebastian das schrieb. Ich habe im frontend/index eine Datei topbar-navigation.tpl erstellt mit folgendem Inhalt:
ich habe bereits eine Datei namens header.less unter _modules erstellt (um das Logo anzupassen). Müsste ich also in diese Datei folgenden Inhalt einfügen?
.header-main > .top-bar {
display: none;
}
Wenn ja: muss dabei noch etwas stehen oder einfach diese Zeilen am Ende der Datei (oder am Anfang? ) einfügen? Wenn nicht: wie gehe ich da am besten vor?
Sorry, wenn euch meine Fragen bisschen komisch (oder gar dumm) vorkommen. Wie an anderer Stelle bereits erwähnt, mache ich jetzt ein Praktikum und leider bin ich in meinen Aufgaben ziemlich auf mich allein gestellt Da muss ich jetzt aber durch und hoffe auf euer verständnisvolle Hilfe
Das spielt eigentlich keine Rolle ob am Anfang oder am Ende, empfehlen würde ich es am Ende einzufügen, falls in der gleichen Datei die gleiche Stelle bereits vorkommen sollte, werden deine Änderungen dann nicht überschrieben.
Es reicht wenn du den Code so wie genannt dort einfügst.
Du musst nur sicher gehen, dass du auf der gleichen Ebene wie die all.less eine modules.less hast, in der modules.less die „_modules/header“ importierst und in der all.less die „modules“ importierst.
Damit die Änderungen wirksam werden, muss das Template über das Backend neu kompoliert werden.
Du musst nur sicher gehen, dass du auf der gleichen Ebene wie die all.less eine modules.less hast , in der modules.less die „_modules/header“ importierst und in der all.less die „modules“ importierst.
Ah okay ich versuchs mal… eine modules.less hab ich noch nicht… ich melde mich dann gleich wieder
In der all.less importierst du nur weitere less-Files.
Alles was du in der all.less brauchst ist z.B. folgender Inhalt:
@import „header“;
Zusätzlich erstellst du dann in diesem Verzeichniss eine Datei namens „header.less“ und einen Ordner namens „_header“.
In der header.less importierst du wiederrum alle less-Files, welche sich im Ordner _header befinden, z.B. so:
@import „_header/navigation“;
Die LESS Anpassungen für die Navigation kannst du dann z.B. in die navigation.less im Ordner „_header“ einbauen.
Mann kann natürlich alle Änderungen direkt in die all.less einbauen, aber um eine saubere Struktur zu haben, wird es eher so empfohlen wie oben beschrieben.
Hallo,
sooooo kompliziert musst du es aber auch gar nicht machen. Die Ordner und Dateien hat Shopware nur so angelegt, um eine gewisse Übersicht zu schaffen, auch für sich selbst. Dies ist aber auch kein muss, dies so fortzusetzen.
Es würde auch vollkommen ausreichen, eine all.less zu erstellen und diese mit dem Inhalt:
@import "style";
zu füllen und im selben Verzeichnis eine style.less zu erstellen, die dann deinen CSS-Code enthält, beispielsweise:
.header-main > .top-bar {
display: none;
}
Es geht aber natürlich auch über das Ordner- und Dateigeflecht.
Nur bei den Template-Dateien und Shopware Blöcken muss man sich „an die Regeln halten“, damit alles klappt.
modules.less erstellt, alle Dateien aus dem _modules Verzeichnis in die modules.less importiert, diese dann in die all.less. Wenn ich mein Theme komplieren will, kommt ne Fehlermeldung. Ich habe die Struktur mit dem von der original responsive Theme verglichen, kann nix entdecken, was die Fehlermeldung auslösen könnte…
Jetzt bekomme ich ständig diese Fehlermeldung beim Kompilieren… selbst, wenn ich alles wieder auf die alte Struktur bringe. Ich könnt schon wieder **** *harharhar*
modules.less erstellt, alle Dateien aus dem _modules Verzeichnis in die modules.less importiert, diese dann in die all.less. Wenn ich mein Theme komplieren will, kommt ne Fehlermeldung. Ich habe die Struktur mit dem von der original responsive Theme verglichen, kann nix entdecken, was die Fehlermeldung auslösen könnte…
du sollst ja auch auf keinen Fall irgendwelche Dateien aus dem Responsiven Theme kopieren. Der Sinn der Vererbung von Shopware ist ja, das durch die Vererbung diese Daten (CSS, Blöcke) etc. so und so zur Verfügung stehen und nicht noch einmal in das eigene Theme übernommen werden müssen.
Wie erwähnt: nimm meine Lösung mit der all.less und style.less, die ist für dich vielleicht etwas verständlicher.
Kopiert hab ich ja nicht. Nur die Struktur übernommen. alle less dateien wo ich was ändere werden selber erstellt und ggf. erweitert.
Hallo,
siehe oben.
Der Fehler wird sicher auch kommen, da du:
@import "modules"
mit in die all.less reingeschrieben hast. Es gibt aber bei dir wahrscheinlich gar keine modules.less - Datei in deinem eigenen Theme, sondern nur das Verzeichnis, das mit _ anfängt (_modules). Und ein Verzeichnis kannst du nicht importieren, sondern nur LESS-Dateien. Wie gesagt, nimm meine Variante, die ist für dich vielleicht eher nachvollziehbarer.
Warum der Fehler aber bei dir kommt, wird eher an dem fehlenden Semikolon hinter @import „modules“ kommen.
das habe ich schon rausgelöscht. Habe ich zunächst erstellt, nachdem iLuHa das schrieb. Danach trat die Fehlermeldung zum ersten Mal auf. Habe dann, nachdem ich gelesen habe, was du geschrieben hast, von wegen nicht so kompliziert machen etc.
das habe ich schon rausgelöscht. Habe ich zunächst erstellt, nachdem iLuHa das schrieb. Danach trat die Fehlermeldung zum ersten Mal auf. Habe dann, nachdem ich gelesen habe, was du geschrieben hast, von wegen nicht so kompliziert machen etc.
Aber die Fehlermeldung bleibt…
so sieht meine all.less jetzt aus:
Hallo,
wie gesagt: SEMIKOLON fehlt , hier in dem Fall hinter @import „style“. Der Fehler ist also nachvollziehbar. Man sollte einfach auch aufpassen, was und wie man es kopiert. Ebenso ist die Frage offen, ob du überhaupt eine header.less im _modules - Verzeichnis drin hast…
Warum der Fehler aber bei dir kommt, wird eher an dem fehlenden Semikolon hinter @import „modules“ kommen.
Beste Grüße
Sebastian
haha… genau… und ich starre auf den Code und seh den Wald vor all den Bäumen nicht^^ OK Fehlermeldung weg, Seite sieht aus, wie vorher *lach* ich krieg bald nen Krampf ^^