Hallo zusammen, wie kann man im Theme Malibu die Größen für die Bilder ermitteln, ich möchte gerne zwei Bilder neben einander einfügen, dabei sollte das eine Bild 75% und das andere 25%, dabei ist die Aufteilung der Sektion ebenfalls 75% zu 25%. Dabei sollten beide Bilder die selbe Höhe aufweisen. (Einstellung zentriert) Doch wie ermittelt man am besten welche Größe das Bild haben darf?
Ich würde die maximale Seitenbreite (wird im Style Editor eingestellt) nehmen. 75% bzw. 25% davon ist die Seitenbreite der Bilder, die Höhe kannst Du entsprechend selber fest. Oder, Du nimmst ein Bild und machst das 2. um 2 drittel kleiner (in der Breite) Beispiele: Der Shop ist 1400px breit, dann könnten die Bilder 1050px und 350px breit sein Hast Du ein Bild mit einer Größe von 1500 x 300px, dann müsste das 2. Bild 500 x 300px groß sein
Das hatte ich auch schon gedacht, allerdings funktioniert dies nur unter einer Bedienung, wenn man beim Bild "Bild responsive anpassen" deaktiviert, allerdings hat man dann das Problem das bei nicht voller Bildschirmgröße, dass Bild nicht verkleinert wird und das sieht dann natürlich nicht mehr schön aus. Maximale Breite im Styleditor ist 1400px eingestellt. Aufteilung der Sektion ist (links) 75% zu (rechts) 25%. Bild links hat eine Breite von 1050px und eine Höhe von 190px. Bild rechts hat eine Breite von 170px und eine Höhe von 190px. (Da es sich um ein Siegel handelt, kann ich die Breite hier nicht verändern, es stört mich auch nicht wenn etwas weißer Rand zwischen beiden Grafiken ist). Hier die Version, mit Bild responsive anpassen. Hier die Version, ohne Bild responsive anpassen. Persönlich gefällt mir natürlich das letztere Bild, allerdings nur solange wie man die Seite mit voller Bildschirmgröße betrachtet. Wie kann ich die letzte Version erhalten und dennoch "Bild responsive anpassen" aktiviert lassen? Oder gibt es da einen Trick, der mir gerade nicht einfällt?
Ich habe das mal auf die Startseite gesetzt, ganz unten. (Link nur für registrierte Nutzer sichtbar.)
Du hast das Siegel nicht als Bild eingefügt, sondern als html-code, oder? Das hat kein img-responsive, sondern feste Größen, deshalb passt das nciht richtig. Speicher das Bild bei Dir im Shop ab, lade es als bild auf die Seite (z.B. mit der Klasse "img-responsive center-block", dann ist es zentriert) und verlinke es einfach zu der externen Seite. Das spart Ladezeit und du hast keine Probleme in Deinem Shop, wenn die andere Seite mal nicht verfügbar ist.
Leider funktioniert das nicht, das Siegel wird dann größer dargestellt, passe ich das Bild rechts an mit 350px an (also 350px+1050px=1400px) wird das Bild rechts in der Höhe kleiner dargestellt.
Dann setzte entweder das Siegel auf einen weißen Hintergrund in passender Breite, oder mach das große Bild höher Die Bilder werden nach der verfügbaren Breite angepasst. Nachtrag: oder Du musst dem Siegen ein "max-height: ...px" geben und es so auf die maximale Höhe einstellen. (die ... mit der px-Zahl ersetzen)