Hallo, ich versuche seit einiger Zeit mich durch das GX3 zu beissen, was sich ohne jede Vorkenntnisse ziemlich..ähm.. interessant gestaltet. Gerade beisse ich mir die Zähne am Kachelabstand der Produktübersicht aus. Im Testshop 3 sind alle Produkte mit Abstand zueinander zu sehen, in jedem anderen Shop den ich gesehen habe, ist da aber nur eine dünne Linie. Wie kann ich den Abstand verbreitern? Und wie bekomme ich eine andere (eigene) Schriftart auf meine Seite? Falls ich dafür ins CSS muss, erklärt es mir bitte als wäre ich 5 Jahre alt *hüstel* Liebe, wenn auch leicht verzweifelte Grüße, Sandra
Hallo Sandra, Für die Boxen: Gehe in den Style Editor, öffne Deinen Style zum Bearbeiten , klicke auf den Namen Deines Styles, jetzt erscheint ein Link "eigenes css hinzufügen" Da klickst du drauf, wenn Du css-Codes einfügen möchtest. Wenn ich das im Testshop gerade richtig gesehen habe, müsste der Code den Abstand zwischen den Kacheln verursachen: Code: .productlist-viewmode-grid .product-container, .productlist-swiper .product-container, .product-container.flyover { padding-left: 15px; padding-right: 15px; } Damit wirst Du aber vermutlich ein Artikel weniger in die Reihe bekommen. Es könnte sein, dass das im Style Editor dann angepasst werden muss. Was meinst Du mit eigene Schriftart? Du kannst eine Google-Web-Font einbinden, das geht über den Style Editor.
Das mit dem 'eins weniger' dachte ich mir schon, das wäre okay, da kann ich ja dann mit den Grids rumtesten. Wo genau in meinem CSS muss ich den Text denn dann zufügen? Ich hab mal ein Bild gemacht davon, wie mein CSS aussieht wenn ich das aufmache. Die Schriftart, die ich nutzen will, soll nur an wenigen Stellen genutzt werden und sie ist leider nicht bei den Google-Web-Fonts dabei. Kann ich sie trotzdem einbinden?
Den Code einfach ganz unten, unter die letzte klammer einfügen. Ob auch eine andere Schrift da funktioniert, kann ich Dir leider nicht sagen. Handelt es sich denn um eine Web-Font?
Ich habs eingefügt und ein wenig rumprobiert. Es macht die Kacheln selbst schmaler und breiter, wenn ich mit den Werten spiele, aber es bringt leider keinen Abstand zwischen die Produkte. Weisst du, was ich meine oder soll ich mal ein Bild machen? Die Schrift, die ich nutzen will ist zumindest eine frei im Netz runterladbare, wenn du das meinst.
O.K. neuer Versuch: Code: .product-container { background-color: transparent; margin-bottom: 30px; } und Code: .product-container .inside { background-color: #fff; } Was die Schrift angeht: Wenn Du eine PC Schrift hast, können Browser die nicht unbedingt erkennen und fallen auf deine Standard-Schrift zurück. Web-Fonts sind von den meisten Browsern lesbar und man kann sie per html / css einbinden
Ich mach mich mal schlau, ob das ein Webfont ist, danke. Zu den Boxen, das hat grundsätzlich funktioniert, der Weg ist also offenbar richtig. Allerdings steht eine meiner Ribbons nun quasi aus der Kachel heraus und ragt in den Hintergrund. Ich dachte also, es müsste ja dann mit dem ersten Code von dir kombinierbar sein (der die Kacheln breiter gemacht hat) und hab da rumprobiert... leider ist die Sache so einfach nicht, der (die? das?) Ribbon schaut weiterhin stur aus meiner Kachel *seufz* Ich bin übrigens heilfroh, dass du auch so ein Nachtschattengewächs bist Sonst bedeutet zu "meinen Zeiten" Fragen stellen immer erstmal lange warten, vielen Dank, dass du dir hiermit die Nacht um die Ohren schlägst!
Das mit den Ribbons liegt daran, dass die Boxen nicht kleiner geworden sind, sondern der äußere Hintergrund wurde nur transparent. Man muss jetzt die Ribbons per css verschieben. Dazu muss man das aber auf der Seite sehen. Man könnte es noch mit einem margin-left oder margin-right versuchen, dann verschieben sich jedoch die swiper unschön Ja, ich bin auch gerne in den späten / frühen Stunden am Werkeln. Da ist es so schön ruhig ringsum. Allerdings werde ich jetzt in kürze auch in mein Bettchen verschwinden
Barbara, hast du eine Idee, wie man die Produkteliste Mobile etwas breiter machen kann? Wir haben zum Teil echt lange Wörter im Titel un dadurch wird alles verschoben bei Handys. Die Silbentrennung ist schlecht und das laden der Seite sehr unruhig.:-(