Hallo, kann mir bitte jemand sagen, wie ich das Shop Logo, welches sich oben links am Rand befindet, ein Stückchen weiter in die Mitte bekomme? Ich habe heute den ganzen Tag damit verbracht, das Logo richtig hinzubekommen. Auf dem Tablet wird es ganz nach unten (herunter gerutscht ) angezeigt oder eigentlich erst gar nicht ... Auf dem iPhone sieht das Responsive Design auch sehr merkwürdig aus. Die Testshops sind in diesem Fall keine Hilfe, da ich meinen Shop anders aufgebaut habe und das Logo doppelt so groß wie in den Testshops ist. Mein Logo hat eine Größe von 400 x180 Px. ******* Auch sind meine Bilder auf der Startseite, die ich mir zusammengestellt habe für die Kategorien, nicht responsiv für ein Tablet und Handy. Sie stehen komplett über und das sieht "verboten" aus.... Die Bilder haben jedoch eine Länge von 750x140. Gibt es dafür ein Code für CSS, damit sich die Bilder anpassen? Vielen lieben Dank im Voraus.
Wenn im Tablet alles verschoben ist, stimmen die Gridspalten hier nicht. Das musst du für jede Größe anpassen, nicht nur für den PC. Logo + Suche + Freier Bereich + Warenkob sollten = 12 sein. ist das Ergebnis 13, oder höher, rutscht etwas in die 2. Zeile. Ohne einen Link zum Shop, wo man sich das css im Hintergrund ansehen kann, kann Dir aber kaum jemand helfen.
Das mit den Gridspalten habe ich alles durchprobiert. ...zig Mal alles ausprobiert, es wird einfach nicht besser.
Wenn ich das richtig sehe, hast Du die Datei etwa geändert, was die Reihenfolge angeht. Das sieht nach Suche - Freier Bereich - Warenkorb - Logo aus. Für den PC (ab 1300px) hast Du das ganze zwei Zeilig gemacht Logo = 6 Gridspalten, Suche = 4 Gridspalten - Freier Bereich = 3 Gridspaltern und Warenkorb = 2 Gridspalten Das sind 15 Gridspalten Darunter ist es aber nicht mehr so (etwa von 990px - 1299px) da hast du Logo = 3 Gridspalten, Suche ist geblieben, Freier Bereich = 2 Gridspalten und Warenkorb = 3 Gridspalten Hier hast Du alles in einer Zeile, deshalb sieht das so anders aus. Da Du für das Logo eine Feste Höhe von 260px bzw. 240px eingetragen hast, ist der Header so groß. Unter 990px hast du das: Code: @media (max-width: 991px) and (min-width: 768px){ #header .custom-container { display: none; }} Das blendet den Freien Bereich aus. Entweder ist es im SE ausgeschaltet, oder Du hast den Code im eigenen css. Wenn nur mal das Logo auf 50 setzte sieht das schon mal so aus: Wenn jetzt der freie Bereich noch dazu kommt, wäre es ähnlich wie auf dem PC. ändert man für diese Bildschirmgröße ncoh die Höhe des logos auf 200px: ist der Header nciht mehr so riesig. Was die nicht responsiven Bilder angeht: Das ist Dein Quellcode für ein Bild: <img alt="" src="images/Baby-Ausstattung-Shop k.jpg" style="width: 750px; height: 111px;"> Und so müsste der aussehen, wenn das bild responsive sein soll: <img alt="" src="images/Baby-Ausstattung-Shop k.jpg" class="img-responsive"> solange Du feste Größen angibst, wird immer diese Größe genommen, deshalb sollte man keine fixen Größen verwenden.
Hallo liebe Barbara, herzlichen Dank für Deine nette Hilfe. Ich verstehe zur Zeit gar nichts mehr ... bin einfach total überarbeitet. Bin nun schon 2 Monate fast Tag und Nacht daran, alle Artikel einzeln von 3 Shops in den jetzigen rüber zu bringen. Es nimmt und nimmt kein Ende... Was genau, soll ich wo jetzt für das Logo und so weiter eingeben? Entschuldigung, hört sich jetzt vielleicht blöd an, aber ich möchte nicht wieder alles zerschießen... Liebe Grüße
Setzte das Logo erstmal nur überall auf mindestens 5 Gridspalten. Dann wird das von der Breite einheitlicher
Ich kann beim Bild helfen. Was Barbara meint: Gehe in den Content-Manager zu der Seite, in dem das Bild enthalten ist. Klicke auf das Bild, dann Rechtsklick und auf Bildeigenschaften. Dann den Reiter "Erweitert". Bei "Formatvorlagenklassen" folgendes einsetzen: img-responsive Alle anderen Felder, auch im Register Bildinfo, leer lassen. Dann sind die Bilder responsive. Beim Logo einfach ein kleineres nehmen und nach einer Vorlage eines Gambio-Testshops (z.B. Gridspalteneinstellungen übernehmen) einfügen. Dann erst mit Änderungen nach den Anleitungen im Gambio-Blog experimentieren. Dann kann man erst mal entspannen
Vielen Dank Barbara und Alexander, ich werde es jetzt gleich alles mal durchprobieren! Werde mich melden, wenn es geklappt hat oder nicht ...
Hallo Barbara, das mit den jeweils 5 Gridspalten funktioniert nicht, da ist alles restlos verschoben und noch schlimmer. Ich weiß nicht wie ich die Aufteilung machen soll in PC, Tablet u. Handy. Damit komme ich einfach nicht klar, weil man das nicht einzeln einstellen kann.
Doch, das kannst Du. du hast für jeden Header-Bereich die Einstellung Grid-Spalten Klein Grid-Spalten Medium Grid-Spalten Groß Klein ist für Tablet Portrait Medium ist für Landscape und groß ist für PC Wenn Du den Style für PC anpasst, muss Du überall (Logo, Suche, Freier Bereich Warenkorb) die Einstellungen für Grid-Spalten Groß machen. Danach machst Du die Einstellungen für Landscape, indem Du überall die Werte für Grid-Spalten Medium bearbeitest. Eine Zeile hat 12 Gridspalten. du hattest für die PC Einstellung 15 Gridspalten und das ganze in 2 Zeilen. Das würde ich dann auch versuchen in den anderen Größen zu zu machen. Die 5 Gridspalten waren ein Beispiel, da Du für PC 6 Gridspalten hattest. 50% könnte aber bei einem kleinen Tablet zu viel sein, 3 Gridspalten (die Du da hattest) sind aber zu wenig.
Die Responsive Bilder habe ich gut hinbekommen. Vielen Dank Barbara. Die Grid-Spalten muss ich wohl noch lange probieren... Vielen lieben Dank erst einmal.
Orientiere Dich einfach am Gambio Testshop und gehe da in den Styledit: Dupliziere parallel Dein Style und stelle dann im neuen Style alle Gridspalten so ein, wie im Gambio Testshop. Wenn es funktioniert, dann auf aktiv stellen.
Danke Alexander! Das mit den Bildern habe ich wie gesagt schnell hinbekommen. Aber die Tablet-Version macht mir zu schaffen, egal was ich ausprobiere ... es funktioniert nichts. Nur die großen Grid-Spalten und kleinen Grid-Spalten sind ok. Medium ist einfach nicht hinzubekommen.... Herzliche Grüße