Probleme mit Kopfgrafiken

  • Hallo zusammen,

    auf meiner Page habe ich das Problem, dass der Bereich der Kopfgrafik nach unten hin viel zu groß ist, aber nur auf den ersten beiden Seiten. Bei den weiteren Seiten ist es in Ordnung, jedoch nicht auf deren Unterseiten!
    Ich bekomme das in vielen Stunden des Versuchens nicht gelöst. Was habe ich nur falsch gemacht oder übersehen?

    Äußerst fatal aber: Wo ist mein Logo abgeblieben, das ich in der Vorschau sehe?!

    Ich verwende das Layout Locus Responsive.

    Schaut bitte mal hier:

  • Hallo Norbert,

    ich vermute, dass der unerwünschte Abstand zwischen einigen Header-Bildern und Breadcrumbs, durch die Bilder selber verursacht wird. Wenn Du die PNG-Bilder mal in einem neuen Tab öffnest, wirst Du sehen, dass die eigentlichen Bilder dreiseitig von großflächiger Transparenz umgeben sind, und diese Transparenz beansprucht natürlich auch entsprechenden Platz im HTML-Dokument.

    Du müsstest die Bilder einfach mal neu zuschneiden und vielleicht auch besser als JPG-Datei speichern, da JPG keine Transparenz unterstützt, und solche Probleme dann eigentlich auch nicht unbemerkt entstehen können.

    Das Logo (Dein Konterfei) meine ich, auf allen Seiten zu sehen.

    Viele Grüße

    Tom

  • Hallo Tom,

    genau das meine ich: Das ist der Header, in den die Bilder eingebettet sind. Und dieser Header lässt sich in der Größe nicht anpassen, deshalb die dreiseitige helle Umgebung. Die Bilder selbst haben nur eine Höhe von etwa 350 px (max.), der Header aber fast doppelt so viel. Und das ist leider bei allen Layouts mit vertikalem Menü so...

    Viele Grüße

    Norbert

  • Hallo Norbert,

    die Größe kannst du im rot markierten Bereich einstellen:

    Freundliche Grüße
    Philipp

    ---------------------------------------------------------------
    Widgets für Zeta Producer: widget-zp.de

    • Offizieller Beitrag

    Dann noch folgendes genau beachten:

    Änderungen an Layout-Einstellungen bzgl. Logo oder Kopfgrafiken wirken sich nicht auf bereits vorhandene Bilder aus, sondern nur auf neu zu importierende. Wenn in einem Projekt bereits Header-Bilder vorhanden sind und dann nachträglich in den Layout-Einstellungen die Dimensionen für Header-Bilder verändert werden, empfiehlt es sich alle vorhandenen Header-Bilder wir folgt zu bearbeiten:
    1 Header-Artikel zum Bearbeiten öffnen
    2 Bild Thumbnail anklicken um das Bild auszuwählen (Schritte ab hier dann für alle im Header enthaltenen Bilder wiederholen)
    3 Klick auf die größere Voransicht und Wahl der Option "Bearbeiten"
    4 Klick auf den Button "Zurücksetzen"
    5 Klick auf "Zuschneiden" und Bild wie gewünscht verschieben
    6 Schritte 2 bis 5 für alle Header-Bilder wiederholen
    7 Klick auf OK

  • Ich habe die Kopfgrafik gelöscht und neu eingefügt; dabei bearbeitet wie immer (Schritte oben). Der Header bleibt doppelt so hoch wie die Grafik (shot1).

    Ich habe eine vorhandene Grafik wie oben bearbeitet und dabei die Vergrößerung auf 45% gesetzt: Die Bildbreite hat sich nicht verändert, der Header bleibt genau so hoch wie vorher (Shot2).

    Seltsamerweise betrifft das nur die ersten beiden Seiten, bei allen anderen sind die Header an die Grafikgöße angepasst. Allerdings sind die Inhaltsbereiche oben zu weit auseinandergezogen (Shot 3), wie überall.

  • Wie ich sehe und fürchte, hat niemand eine Idee zur Lösung meines Problems. Oder ihr habt keine Lust, weil ich nerve? ;)

    Aber was mache ich jetzt? Einfach dumm dastehen und alles so lassen? *schluchz*

  • Hallo Norbert,

    sofern Du mit „Ich habe die Kopfgrafik gelöscht und neu eingefügt“ nur das Bild meinst, solltest Du mal testen, wie es sich verhält, wenn Du auch den Header selber löscht und diesen neu einfügst.

    Ansonsten würde ich Dir empfehlen, Dir mal das Widget „Slider“ anzuschauen. Es bietet die gleiche Funktionalität wie der Header, lässt sich zudem randlos darstellen und hat meiner Meinung nach einen intuitiveren Bildzuschnitt.

    Das Slider-Widget wird nicht im Header- sondern im Inhaltsbereich als erstes Widget eingefügt. Wenn Dir der Bereich zwischen Oberkante Slider und Unterkante Navigation zu groß erscheint, kannst Du das Widget über den Darstellungsmodus weiter nach oben verschieben („Reihe > Außenabstand oben“). Ein guter Wert scheint mir hier -97px.

    Wenn Du das Widget zudem auf „randlos“ stellst (im Widget unten links auf das Schieberegler-Symbol klicken und dann unter „Darstellung“ „randlos“ wählen), erstreckt es sich über den gesamten Inhaltsbereich. Ich bin ziemlich zuversichtlich, dass Dir dieses Widget letztlich besser gefallen wird als der Header.

    Viele Grüße

    Tom

  • Hallo Donnerhuf

    Ergänzend zu den bisherigen Erläuterungen hier noch mein Input:

    Deine jetzigen Header-, bzw. Kopfgrafik-Bilder sind (wie erwähnt) allesamt als PNG mit unterschiedlichen, transparenten Rändern hinterlegt und/oder die Original-Bilder entsprechen in der Dimension mutmasslich nicht der Grössen-Einstellung des Headers.


    Gehe in ZP (16) zu "Layout -> Allgemein -> Allgemein > Max-Breite". Kopiere den Wert (hier z.B. 1200)

    Gehe zu "Kopfgrafik". Füge den Wert (hier z.B. 1200) unter "Breite" ein.
    Und wähle eine neue Höhe (z.B. 600)

    Speichern und schliessen.

    Klicke in der Kopfgrafik auf "Bearbeiten".

    Klick auf "Klick zum Ändern".

    Weiter zu "Bearbeiten". > "Zurücksetzen".

    Füllt das Bild danach die Zuschneide-Maske nicht vollständig aus (weisser Rand), ist die Bildvorlage zu klein und du musst das Bild durch ein anderes Original-Bild ersetzen, das gross genug ist – also in besagtem Beispiel mindestens 1200 px mal 600 px.

    Update: ES verhält sich offenbar etwas anders als erwartet :) ...
    Klicke anschliessend noch auf "Zuschnieden".


    Füllt das Bild danach die Zuschneide-Maske nicht vollständig aus (weisser Rand), ist die Bildvorlage zu klein und du musst das Bild durch ein anderes Original-Bild ersetzen, das gross genug ist – also in besagtem Beispiel mindestens 1200 px mal 600 px.

    Viel Erfolg und gute Tage.

    elch

    Zeta Producer 17.x - Express

    Website, zu einer nicht primär gewinnorientierten und/oder ernst zu nehmenden Nebentätigkeit: Heubeere.ch ;)
    (PS: "ß" gibt es nicht - und kann ich nicht. Sorry!)

  • @Drcymbal

    Juhuuu! :love: Bester aller Toms: Diese Lösung ist perfekt, elegant und genial zugleich... Ich kann die Grafiken sehr einfach beliebig in der Größe ändern, zuschneiden und horizontal positionieren! Und natürlich, was mir überaus wichtig war, die Abstände oben und unten zu kontrollieren. Alles das war im Header nicht möglich.

    Es hat zwar eine Weile gedauert, bis ich herausgefunden habe, warum der Text unter der Grafik fast mitten im Bild war; aber ein paar Leerzeilen über dem Text schoben diesen dann nach unten.

    Nur der Abstand zwischen "Sie befinden sich hier" und dem Menü darüber erscheint mir etwas zu groß, aber damit kann ich leben.

    Diese Erkenntnisse werde ich auch für meine anderen, offizielleren Webseiten verwenden.

    Ich schicke dir deshalb gedanklich eine Kiste Dom Perignon und für jede Flasche eine Brasil ;)

    Herzlichste Grüße und vielen Dank!

    Norbert

  • elch

    Du hast dir ja eine Menge Arbeit gemacht, vielen Dank dafür! ;)

    Ich habe deine Vorschläge ausprobiert, aber es war dann doch kompliziert und im Ergebnis nicht recht befriedigend. Deshalb habe ich den Vorschlag von Drcymbal angenommen.

    Ich freue mich aber, dass du so engagiert an diesem Thread teilgenommen hast! :)

    Viele Grüße und alles Gute

    Norbert

  • Hallo Norbert,

    vielen Dank, aber Champagner vertrage ich nicht. Eine Dose Pfeifentabak mit viel Latakia lasse ich mir aber gefallen. Spaß beiseite, das Ergebnis stellt mich jetzt noch nicht so richtig zufrieden, und Du solltest vielleicht nicht kurz vor dem Ziel aufgeben.

    Hier mal ein Screenshot wie es aussehen könnte:

    Den Navigationspfad habe ich deaktiviert („Einstellungen > Links > Navigationspfad“). Das solltest Du vielleicht auch tun, da ich keine Gefahr sehe, dass sich ein Besucher auf Deiner Seite verläuft.

    Dein Bild habe ich im Slider vergrößert. Du nimmst, wie von Elch auch schon erwähnt, aber bitte ein Bild, das mindestens so breit wie Dein Inhaltsbereich ist, also mindestens 1200 px.

    Den Slider habe ich randlos gesetzt und über den Darstellungsmodus mittels „-97 px“ nach oben versetzt, damit er mit der Navigation bündig abschließt. Dem Bild habe ich dann eine „Über“schrift „Mikesch“ gegeben, die ich mittels „Schieberegler > Text-Optionen > Position“ unter das Bild gesetzt habe.

    Leerzeilen sind nun definitiv nicht das richtige Mittel, um Absätze zu positionieren. Auch hier hilft Dir der Darstellungs-Modus gerne.

    Herzliche Grüße

    Tom

  • Jetzt aber!

    Noch nie hatte ich mich mit der Darstellungsoption beschäftigt: Das war ein Fehler! Jetzt habe ich erkannt, wie wertvoll diese Möglichkeiten sind. Ich konnte auch die nachfolgenden Reihen zusammenschieben, woran ich vorher verzeifelt bin. Nun muss ich nur noch die anderen 12 Seiten anpassen... Und meine beiden anderen HPs auch.

    Die Kopfgrafik habe ich bewusst kleiner gehalten, sie ist ja nicht das Aushängeschild meiner Page, sondern nur für die Startseite ein Erkennungsmerkmal. Alle anderen Seiten haben ebefalls eine eigene kleine Kopfgrafik

    Nochmals meinen allerbesten Dank, Tom! Du hast mich aus einem Tief wieder an die Oberfläch gespült, wo ich jetzt frei atmen kann. :)

    Alles Gute und herzlichste Grüße

    Norbert

  • Hallo Norbert,

    schön, dass Du wieder Oberwasser hast! Eine kleine Änderung solltest Du noch im Slider auf der Startseite vornehmen: Unter „Schieberegler > Darstellung > Mindesthöhe mobil“ solltest Du den Wert auf „0“ setzen. Dann wird auch in der mobilen Ansicht das ganze Bild angezeigt. Gegenwärtig ist nur ein Ausschnitt zu sehen.

    Wenn Du den Slider dann auch auf weiteren Seiten einsetzt, wäre auch hier diese Einstellung meiner Meinung nach ratsam.

    Herzliche Grüße

    Tom

  • Ich verzweifle schon wieder... Es ist noch nicht lange her, und schon habe ich die Schritte zu den Darstellungsoptionen nicht mehr gefunden, die meine Page in eine annehmbare, ansprechbare Größe zusammenschieben sollte, wie es dank eurer Hilfe auf der Startseite geschen war! *schluchz*

    @Drcymbal: Tom, kannst du mir bitte eine eine Anleitung für Dummies dazu geben? Ich blicke nicht durh!

    Ein sehr frustierter Norbert

  • Hallo Norbert,

    das hast Du damals über den "Darstellungsmodus" gemeistert. Du klickst einfach auf das Widget und wählst "Darstellung-Einstellungen". Anschließend kannst Du Dich in der rechten Spalte bei Container, Reihen (diese wirst Du am meisten brauchen) und Spalten austoben.

    Viele Grüße

    Tom

  • Wie blöd kann ein einzelner Mann in diesem biblischen Alter sein? Ich habe überall gesucht, auch im Wireframe. Diese von dir rot umkringelte Auswahl hatte ich völlig übersehen, vergessen, ignoriert...

    Ganz herzlichen Dank für deine Erlösung, Tom!

    Ein völlig unfrustrierter, ja, hoffnungsvoller Norbert

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!