Headergrafik wird komisch angezeigt

    Hallo!


    Ich bin bis jetzt höchst zufrieden mit Zeta Producer gewesen, doch gestern bin ich auf ein mir unerklärliches Problem gestoßen. Als ich eine Headergrafik (Slider) hochladen wollte, hat in der Vorschau noch alles sehr schön ausgesehen. Als ich die Seite jedoch veröffentlicht habe, wurde auf einmal das Headerbild sehr komisch angezeigt (siehe https://www.wetterlambach.at/test.html ) und ich weiß nicht was der Grund dafür ist.


    Im Moment habe ich an Stelle der Headergrafik einfach einen Slider platziert, allerdings schließt dieser nicht bündig an die Menüleiste an, was ich optisch nicht sehr ansprechend finde. (siehe https://www.wetterlambach.at/ )


    Meine Frage jetzt: Könnte mir bitte jemand helfen, entweder die Headergrafik, was meine favorisierte Lösung wäre, anzupassen, damit diese ordentlich angezeigt wird, oder den Abstand zwischen Slider und Menüleiste zu entfernen.


    Vielen Dank schon im Voraus für eure Hilfe!


    LG aus Oberösterreich,

    Paul ;)

    Hallo,


    ich vermute mal mit "komisch" meinen Sie, dass die Bilder im Header von der Höhe her nicht vollständig angezeigt werden, richtig? Das liegt daran, dass der Header eine feste Höhe hat. Da die Bilder randlos im Header angezeigt werden und diese Breite abhängig von der Browser-Fensterbreite ist, werden die Bilder nicht vollständig angezeigt.


    Der Slider hingegen hat keine feste Höhe. Damit dieser direkt unterhalb der Menüleiste anfängt müssen Sie unter "Einstellungen > CSS" folgendes einfügen:

    Code
    1. <style>
    2.     .zpwSlider {
    3.     margin-top: 0 !important;
    4.     }
    5.     .zpwSlider .zpRowInner {
    6.     padding-top: 0 !important;
    7.     }
    8. </style>

    Des Weiteren scheint ein Spacer-Widget enthalten zu sein, welches einen weiteren Abstand verursacht. Diesen bitte einfach entfernen.

    Freundliche Grüße
    Steffen T. (Zeta Producer-Support)

    Hallo!


    Danke für die schnelle Antwort! Ich bin inzwischen selbst auf die Lösung des Problems gekommen, ein nicht gelöschtes Codeschnipsel hat mir da ein bisschen reingefunkt, der Header wird jetzt richtig angezeigt. Vorher waren die Bilder quasi "über die ganze Seite verstreut" habe leider keinen Screenshot gemacht.


    Danke auch für den CSS - Code, wird auch noch in Zukunft nützlich sein! (Und nein, ich habe vorher kein Spacer Element eingefügt ;-) )


    Danke für die rasche und professionelle Hilfe!

    LG, Paul

    Hallo Paul,


    direkte Lösung habe ich zwar nicht, aber eventuell einen Ansatz, wo Du suchen solltest. Wenn ich die Chrome Console aufrufe, findet sich im Bereich des Headers folgender Codeabschnitt:

    Code
    1. @media screen and (max-width: 640px)
    2. .objectfit #slider .slides>li img {
    3. width: 100vw;
    4. height: 100vw;
    5. object-fit: cover;

    Wenn ich jetzt die Höhe auskommentiere (Häkchen entfernen in der Console), wird der Header normal angezeigt.

    Hallo Paul,


    ich nehme eher an, dass es an der Einheit wvliegt, die dort vermerkt ist. Eventuell kann der Support dort morgen mehr sagen. Du kannst ja mal in den Layouteinstellungen suchen, ob dort im Bereich Header eine Einheit wvverwendet wird.

    Salut Paul


    Das Verhalten der Headergrafik ist in Falt Responsive so gewollt (und ist hier im Forum schon öfters beschrieben).

    Lösung (aus meiner Sicht die beste): Die Grafik so gestalten, dass diese auch in der schmnalen/beschnittenen Version passt.

    Oder allenfalls dies ... >>>
    (Arrg... falscher Link gesetzt - jetzt ist gut, sorry!)


    Gute Tage und viele Grüsse

    elch