Bild über volle Breite

Conny

Sehr aktives Mitglied
7. September 2009
548
60
Hi,
ich probiere mit dem OnPage Composer ein Bild über die volle Breite zu bekommen wie auf der Startseite vom Standardshop - was mache ich da falsch ?

So ist es in der Demo und so würde ich es gerne hinbekommen. In der Demo ist es wohl ein Container.

APiiIgAATy.png

7pNugHHOyH.png
 

Conny

Sehr aktives Mitglied
7. September 2009
548
60
Hi,
Danke für deine schnelle Antwort. Nachdem ich jetzt schon ziemlich lange probiert habe, konnte ich das Problem lösen.
Ich hatte die Grafik in einen Container welcher als "boxed container" gekennzeichnet war reingelegt.

Die Grafik als Container anzuzeigen war richtig, aber man muss dann darauf Acht geben, dass dieser Container nicht gekapselt ist.
YoF5sJvdMf.png
 

Conny

Sehr aktives Mitglied
7. September 2009
548
60
Habe noch ein kleine Problem.
Ich habe das Bild wie im letzten Post von mir zu sehen ist integriert.
Das Bild habe ich auf eine Höhe von 600px eingestellt. Damit sieht es aber auf Handy etc. nicht gut aus.
Es sollte sich responsive verhalten. D.h. wenn der Bildschirm kleiner wird müsste das Bild auch in der Höhe kleiner werden.

Irgende eine Idee wie ich das verwirklichen kann ?

qDrEzeRq6c.png

sollte aber in Handygröße so aussehen

cHDGYes45t.png
 

MHillmann

Moderator
Mitarbeiter
11. Oktober 2018
1.315
449
Hallo @Conny

was hast du denn genau vor? Wenn du wirklich nur ein Bild möchtest dann kannst du einfach ein Bild-Portlet nehmen (da brauchst du nicht mal einen Container). Ansonsten geht auch wie Eas sagt ein Banner-Portlet, das kann dann noch ein bisl mehr.

Wenn du es wirklich als Background eines Containers möchtest, müsstest du selbst noch die Höhe für die verschiedenen Browsergrößen per CSS anlegen. Der Container hat momentan leider nur eine Standardhöhe für alle Breakpoints.

Viele Grüße
Michael
 

Conny

Sehr aktives Mitglied
7. September 2009
548
60
Ich möchte den "parallax" Effekt nutzen und ein Bild über die gesamte Breite anzeigen.
Diesen Effekt kann ich im Banner nicht einstellen, sondern soweit ich gesehen habe nur im Container.
Das klappt jetzt auch soweit, nur ist der responsive Effect so, dass das Hintergrundbild nicht mit einer Breite von 100% darstellbar ist, was ich aber gerne hätte, da ansonsten Bereiche aus dem Bild einfach abgeschnitten werden.
 

MHillmann

Moderator
Mitarbeiter
11. Oktober 2018
1.315
449
Hier noch der Lösungsansatz aus der privaten Konversation:

gib dem Container mit dem Parallax mal eine Benutzerdefinierte Klasse im Layout-Tab. z. B. "parallax-responsive". Dann kannst du z.B. in der custom.css folgendes einfügen:
CSS:
@media (max-width: 767.98px) {
    .parallax-responsive {
        min-height: 200px !important;
    }
}
@media (max-width: 991.98px) {
    .parallax-responsive {
        min-height: 300px !important;
    }
}

Viele Grüße
Michael
 
  • Gefällt mir
Reaktionen: mobade
Ähnliche Themen
Titel Forum Antworten Datum
Neu JTL Wawi Bild-Upload unvollständig oder nur als mit meinem PC hochgeladen zu sehen User helfen Usern - Fragen zu JTL-Wawi 2
Neu List & Label Neue Vorlage Projektbaustein Bild Logo nur auf erstem Exemplar anzeigen User helfen Usern - Fragen zu JTL-Wawi 2
Neu Variations bild statt Artikelbild? JTL-Shop - Fehler und Bugs 4
Neu Exportvorlage Facebook: Mehr als ein Bild übergeben? Allgemeine Fragen zu JTL-Shop 0
Bug: Fail to update Product Data. There are missing Attributes Titel, Bild, FSK-Einstufung kaufland.de - Anbindung (SCX) 2
Neu Webp Bild aufruf Fehler beim ersten mal laden JTL-Shop - Fehler und Bugs 2
Neu Kategoriebilder werden immer mit großem leeren Platz (wie für das 2.Bild) angezeigt Allgemeine Fragen zu JTL-Shop 6
Neu gelöst: PHP Abfrage Versandklasse und passendes Bild aussteuern Betrieb / Pflege von JTL-Shop 2
Neu Bild für Kinderartikel zuordnen User helfen Usern - Fragen zu JTL-Wawi 1
Neu Bestellungen importieren über SFTP Server User helfen Usern - Fragen zu JTL-Wawi 0
Neu Exportformate neu über alles Allgemeine Fragen zu JTL-Shop 0
Neu Rechner über Nacht runter fahren? User helfen Usern - Fragen zu JTL-Wawi 11
JTL Shop Gutscheine über JTL-Vouchers erstellen Allgemeine Fragen zu JTL-Vouchers 1
Neu JTL Shop Gutscheine über JTL-Vouchers erstellen Allgemeine Fragen zu JTL-Shop 0
Neu Freitextfeld über Variation - Zeichenbeschränkung für Gravur Allgemeine Fragen zu JTL-Shop 8
In Bearbeitung Artikel über csv-Datei bearbeiten und importieren Allgemeine Fragen zu JTL-POS 3
Neu Verordnung über die allgemeine Produktsicherheit (GPSR) JTL-Wawi - Ideen, Lob und Kritik 0
Neu Kundenpreise in Artikelübersicht (über Umwege)? Arbeitsabläufe in JTL-Wawi 0
Neu Verbindungsproblem Wawi (1.8.12.0) zum JTL-Shop (5.2.4) über localhost User helfen Usern - Fragen zu JTL-Wawi 0
Auftragsimport über eBay - Bezeichnung der Versandart auf der Rechnung leer JTL-Wawi 1.8 1
Wie kann ich eine Benachrichtigung bei einem Wareneingang auslösen mit einer Mail über die Artikel die eingebucht wurden JTL-Wawi 1.8 2
Artikel wurden über Weclapp über FFN-Connect an JTL FFN übermittelt jedoch leider nicht an Wawi & WMS JTL-Wawi 1.8 0
Gutschrift über einen Set-Artikel JTL-Wawi 1.7 0
Teilrechnung Erstellen über/nach Packtisch+ JTL-Wawi 1.8 1
Neu SCSS-Datei bearbeiten über FTP Allgemeine Fragen zu JTL-Shop 6
Neu Email Versand über OAuth JTL-Wawi - Ideen, Lob und Kritik 2
Neu Informationspflicht über Sicherstellung der Echtheit von Kundenbewertungen Business Jungle 5
Neu SQL Abfrage über ODBC für Bewegunghistorie (WMS) Eigene Übersichten in der JTL-Wawi 4
Neu PayPal - Benachrichtungen über Zahlung -> EMail. Wo kann man den Betreff bearbeiten? User helfen Usern - Fragen zu JTL-Wawi 6
Neu Mails über Microsoft 365 User helfen Usern - Fragen zu JTL-Wawi 17
Neu Verkaufte Stückzahl pro Artikel über Ameise ausgeben JTL Ameise - Eigene Exporte 1
Statistik über ALLE Kunden mit Umsatz JTL-Wawi 1.6 1
Neu Anbindung kaufland und Otto über JTL 1.7.15.4 noch möglich? User helfen Usern - Fragen zu JTL-Wawi 1
Neu Artikelname für WMS über Ameise importieren JTL-Ameise - Fehler und Bugs 6
Positionen alle auf einmal z.B über csv in einen bestehenden Auftrag einfügen JTL-Wawi 1.8 2
Neu Exportvorlage Hermes wir über Packtisch nicht mehr ausgegeben JTL-ShippingLabels - Fehler und Bugs 0
Neu Überverkäufe in Amazon, wenn Artikel über "Dranhängen"/ Jetzt Verkaufen in Amazon/ Seller Central erstellt wird. Amazon-Anbindung - Fehler und Bugs 3

Ähnliche Themen