Hallöchen, Könnte mir jmd freundlicherweise verraten welche Datei ich bearbeiten muss, bzw. wie ich vorgehen muss um ein Hintergrundbild oder ein Pattern einzubinden? Vielen Dank im Voraus! Grüße
Hallo 
Ich hab bei mir links und rechts vom Template eine kleines Bildchen als Struktur wiederholend laufen, habe das folgendermaßen gelöst: die less Datei aus deinem Template: frontend_public\src\less_modules\global.less dann unter dem Punkt: body {} habe ich darin zwischen anderen css eigenschaften das Bild verknüpft: background-attachment:fixed;background-color:transparent;background-image:url("../../img/bigbg.jpg"); Habe somit das Bildhcen in den img ordner des Templates mit dem Namen bigbg.jpg hinterlegt. So hab ichs gemacht
1 „Gefällt mir“
Hallo, ich habe mir nun eine Global.less Datei erstellt. Was genau sollte da drin stehen bei „body“? Ich würde das Bild für den hintergrund nach rechts wiederholen lassen, background:url(’…/images/bg_html.png’);overflow-y:scroll} body {background:url(’…/images/bg_body.png’) repeat-x} bei dem imgage-Ordner meinst den unter:/Shopware/themes/Frontend/MEINTEMPLATE/frontend/_public/src? Bitte um Hilfe
Du kannst die URL des Bildes direkt im Thememanager angeben. Theme Konfiguration -> Farb Konfiguration -> Allgemein Unter Grundgerüst: @body-bg: url(“xyz”) Die Felder sind nichts anderes als Variablen aus den CSS Dateien.
Danke, die Lösung direkt im Grundgerüst ist wohl die eleganteste… Dann kann ich aber keine Hintergrundfarbe mehr zusätzlich definieren oder? Ich benötige dies da mein pattern sich nur horizontal wiederholt und vertikal dann ein Farbverlauf in die Hintergrundfarbe übergeht… Code in der global.less (der Responsive Theme) sieht jetzt so aus und funktioniert (Thx SKB): background-image: url("../../img/bg\_body.png"); background-repeat: repeat-x; Das bg Bild muss dann in: /themes/Frontend/Responsive/frontend/_public/src/img/
Oh auch was dazu gelernt wegen direkt im Thememanager eintippen. Danke. Bezüglich ob beides geht weiß ich leider nicht.
Vielen Dank schonmal. Habe jetzt mein Hintergrundbild im Grundgerüst:) Wie bekomme ich es denn noch in Footer und Header? Und woran liegt es, dass ich es bei “Element untersuchen” ansehe, dass ich da nicht meine Dateien und Pfade sehe? Liegt das an .less? Bei der alten seite mit Shopware 4 sieht man da bei sytling genau wo welche (Bild)Datei wohnt…
Genau…reine CSS Dateien gibts nicht mehr. Schau dir mal das hier aus den DEVDocs an: https://devdocs.shopware.com/styletile/ Das ist eine Übersicht über die Elemente und Klassen wo diese stehen und welchen Code diese haben etc. Den Footer und Header findest du unter _modules
Hallo Daniel, dazu noch eine doofe Frage: ich habe mir ein eigenes Template (vererbt von Responsive) erstellt, deswegen sind meine .less Ordner ja noch leer. Sollte ich mir die jeweiligen Dateien (z.B. Footer.less/global.less…) selbser neu erstellen oder soll ich mir die Dateien aus dem responsive Template kopieren und einfügen?
Shopware sucht selber nach den LESS Dateien. in dem Verzeichnis: frontend/_public/src/less/ muss eine all.less vorhanden sein, die wird dann zur Laufzeit geladen. 1. Möglichkeit: Du schreibst deine Änderungen alle in die all.less 2. Möglichkeit: Du legst für bestimmte Bereiche eine eigene .less an und lädst die über @import in der all.less hinzu. Bei wenigen Änderungen würde ich die alle in die all.less schreiben.
Ok, super danke. Ich habe schon einigermaßen hinbekommen, dass kein weißer Hintergrund mehr zu sehen ist, sondern das Bild, das ich beim theme manager hinterlegt habe. .footer-main { background:none } aber leider ist jetzt nur links und rechts von dem Footer das Bild zu sehen aber die Grundfläche ist immer noch weiß… Als ich noch nichts in footer.less geschrieben hatte und bei Element untersuchen bei “Background: #fff” das Häkchen raus genommen habe, war nichts mehr weiß. -> Mit welchem .less befehl kann ich das also herbeiführen?
Wie baue ich nun ein Hintergrundbild in das Erweiterte Menü ein.Das Menü liegt ja hier engine/Shopware/Plugins/Default/Frontend/AdvancedMenu/Views/frontend/_public/src/less/ Wo muss ich denn da den img-Ordner setzen und wie muss da der Pfad lauten? M.Koschitzki
gelöscht… probleb selbst gelöst!
Ich hätte eine kurze Frage! Ich habe ein Hintergrundbild eingebunden, hat dank eurer Beschreibung super funktioniert. Jetzt wird mir jedoch das Hintergrund Bild in der Tablet- und Handyversion auch angezeigt. Gibt es eine Möglichkeit das Hintergrundbild ab einer bestimmten Browsergröße auszublenden? Gruß Adysseus 
Hallo… wie sieht es mit weiteren css Befehlen aus? Im Gerüst habe ich eine URL für ein Hintergrundbild angelegt, dass passt und funktioniert! Auch ein no-repeat konnte ich dort direkt einfügen, leider aber auch nicht mehr?!? ich wollte jetzt noch ein scroll testen, wenn das Bild mitlaufen soll, bekomme aber irgendwie nur Fehler?!? Wie viele CSS Attribute kann man dort hinterlegen? Muss da ein Trenner rein? ; oder so!!! DANKE! :thumbup:
Habe gerade erst mit Shopware angefangen und habe mal eine Frage hierzu:
Auch ich möchte ein Hintergrundbild in das Responsive theme einfügen.
Ich habe ein Theme erstellt abgeleitet vom Responsive Theme.
Ich habe auch schon ein paar Änderungen in dem abgeleitetem Theme gemacht.
Wie mache ich das nun aber mit dem Hintergrundbild genau?
Wenn ich die global.less direkt in dem Unterordner vom responsive theme ändere, funktioniert das bestens.
Da man dieses Theme aber ja nicht verändern soll, möchte ich gern mein abgeleitetes Theme verändern.
Habe also eine global.less in dem äquivalentem Verzeichnis erstellt und den Inhalt der originalen global.less hineinkopiert.
Diese Änderung wird aber nicht umgesetzt.
Ok, in dem abgeleitetem Theme gibt es ja auch keine all.less und somit wird die neu erstellte global.less
ja auch nicht importiert, richtig ?
Meine einfache Frage: Wie bekomme ich das hin?
Muss ich die neu erstellte global.less irgendwie importieren? Muss ich auch eine neue all.less im ageleitetetem Theme Verzeichnis erstellen?
Vielen Dank für eure Hilfe
Habe gerade erst mit Shopware angefangen und habe mal eine Frage hierzu:
Auch ich möchte ein Hintergrundbild in das Responsive theme einfügen.
Ich habe ein Theme erstellt abgeleitet vom Responsive Theme.
Ich habe auch schon ein paar Änderungen in dem abgeleitetem Theme gemacht.
Wie mache ich das nun aber mit dem Hintergrundbild genau?
Wenn ich die global.less direkt in dem Unterordner vom responsive theme ändere, funktioniert das bestens.
Da man dieses Theme aber ja nicht verändern soll, möchte ich gern mein abgeleitetes Theme verändern.
Habe also eine global.less in dem äquivalentem Verzeichnis erstellt und den Inhalt der originalen global.less hineinkopiert.
Diese Änderung wird aber nicht umgesetzt.
Ok, in dem abgeleitetem Theme gibt es ja auch keine all.less und somit wird die neu erstellte global.less
ja auch nicht importiert, richtig ?
Meine einfache Frage: Wie bekomme ich das hin?
Muss ich die neu erstellte global.less irgendwie importieren? Muss ich auch eine neue all.less im ageleitetetem Theme Verzeichnis erstellen?Vielen Dank für eure Hilfe
Hallo,
dazu hilft dir die Doku sehr gut weiter: Getting started with Shopware templating . Und ja, die all.less muss auch im abgeleiteten Theme vorhanden sein. Du kannst die global.less aber auch styles.less oder ähnliches nennen, Hauptsache du hinterlegst den Namen in der all.less .
Beste Grüße
Sebastian
1 „Gefällt mir“
Ok, weiterführende Frage:
Habe ein bisschen rumprobiert. Erstelle ich eine neue all.less (egal ob copy&paste der originalen oder mit nur einem @import drin) in meinem abgeleitetem theme ordner
und versuche danach das theme neu zu kompilieren, wird dieser vorgang nicht beendet. Nur durch aktualisieren (F5) der Seite kann ich im backend weiterarbeiten.
Erstelle ich eine neue *.less mit den änderungen im originalem responsive theme und importier diese auch in der originalen all.less,
funktioniert das.
Kopiere ich jetzt beispielsweise die all.less und die neu erstellte *.less in den theme ordner des abgeleiteten responsive themes, kann shopware das theme kompilieren nicht mehr beenden.
Was mache ich falsche bzw. was übersehen ich?
Vielen Dank!
Ok, weiterführende Frage:
Habe ein bisschen rumprobiert. Erstelle ich eine neue all.less (egal ob copy&paste der originalen oder mit nur einem @import drin) in meinem abgeleitetem theme ordner
und versuche danach das theme neu zu kompilieren, wird dieser vorgang nicht beendet. Nur durch aktualisieren (F5) der Seite kann ich im backend weiterarbeiten.Erstelle ich eine neue *.less mit den änderungen im originalem responsive theme und importier diese auch in der originalen all.less,
funktioniert das.
Kopiere ich jetzt beispielsweise die all.less und die neu erstellte *.less in den theme ordner des abgeleiteten responsive themes, kann shopware das theme kompilieren nicht mehr beenden.Was mache ich falsche bzw. was übersehen ich?
Vielen Dank!
Hallo,
mach es doch einfach so, wie in der Doku beschrieben - so funktioniert es zu 100%. Wahrscheinlich hast du aber auch nur eine geschweifte Klammer } oder irgendetwas anderes in der LESS-Datei bei deinen CS-Kommandos vergessen. Du könntest beispielsweise mit Firebug oder einem anderen Konsolenprogramm einfach gucken, was bei dem Request der Theme Kompilierung als Fehler geworfen wird, warum es nicht zu Ende kompiliert wird.
Beste Grüße
Sebastian