Layout Locus Responsive Abstand zur Kopfgrafik verkleinern

Können wir den Link zur Seite bekommen, die man im Screenshot sieht?

Hallo,

den Abstand über dem 1. Container einer Seite können Sie mit folgendem CSS von 5em auf z.B. 2em reduzieren (den Rand unten würden Sie mit padding-bottom anpassen).

• Klicken Sie im Menü Website auf "Einstellungen"
• Klicken Sie auf CSS
• Fügen Sie folgende Textzeilen (ohne Überschrift und ohne Zeilennummern – am besten über das Dokumente-Icon rechts oben im Quellcode-Kasten kopieren) in das Feld "CSS" ein und schließen Sie den Dialog dann mit Klick auf "OK"

<style>
    wrapper > .main{
        padding-top: 2em;
    }
</style>

Anschließend müssen Sie evtl. Ihre Seiten neu erstellen (Erweitert > Erstellen > Alle Seiten erstellen) und ggf. veröffentlichen.

Große Abstände auf anderen Seiten z.B. http://holzamwerk.de/holzblick.html resultieren aber daraus, dass Sie dort vor jeder <h3>Headline zusätlzich im Quelltext noch leere <h3> Tags haben.

In den Layouteinstellungen unter "Inhaltsbereich" kann man dann auch noch den "Artikelabstand" anpassen.

Hallo liebes Zeta Team,

aus Datenschutztechnischen Gründen darf ich leider kein Bild öffentlich stellen, kann ich es euch auf andere Wege zukommen lassen damit ihr das Problem vor Augen habt?

Ich habe das erste Template gewählt ( local responsive- cube) und bearbeitet. Bin jetzt aber auf ein Problem gestoßen, undzwar will ich den Abstand vom Titelbild zum Text Kästchen (der drunter liegt verringern. Bzw das Titelbild von der Höhe verkleinern. Im Layout habe ich jedoch schon alles versucht, lässt sich aber nicht großartig verändern. :wacko:

Vielen Dank im voraus.

Hallo Marko,

mache mal auf https://hosting.zeta-producer.com/5450121777/index.html einen Screenshot und markiere, wo Du die Höhe ändern möchtest. Das verwendete Layout ist "locus responsive cube". Die Verringerung des Abstandes von Kopfgrafik zu Text war auch schon mal Thema hier im Forum, ich tue mich bloß immer schwer damit, Suchbegriffe zu definieren, wenn andere User (in diesem Falle Du), die Suchfunktion im Forum nicht nutzen (wollen).

Bitte mal unter https://community.zeta-producer.com/wcf/search-res…tand+kopfgrafik durchblättern, ob da was passendes bei ist. Nahezu alle Treffer führen auf die Anwendung von eigenem CSS hin, weshalb ich das Thema jetzt mal in die Web-Plauderecke verschiebe (individuelle Erweiterung vorhandener Layouts).

Beim nächsten Mal legst Du einfach ein neues Projekt mit dem selben Layout an und veröffentlichst dieses auf dem Testserver von Zeta. Da kannst Du dann auch gleich beschreiben, um welche Elemente es geht.

Hallo Hanabi,

den CSS Text habe ich bereits eingefügt und auf allen Seiten neu erstellt, es hat sich nichts geändert (veröffentlichen mag ich diesen noch nicht da diese Seite noch nicht fertig ist). Habe im Anhang den Abstand Markiert. Am Besten wäre es wenn nur eine Leerzeile zwischen Grafik und den unteren Container wäre.

Fehlt die Raute vor wrapper

Scheint sich immernoch nichts zu tun. Habe auch auf allen Seiten erstellt gedrückt.

Habe zum Testen auch verschiedene eM größen hergenommen um zu sehen was sich verändert

Hallo Marko,

zum selben Layout un der selben Fragen gibt es schon dieses Thema: Layout Locus Responsive Abstand zur Kopfgrafik verkleinern vom 20. Dezember. Wenn man dem Link im letzten Beitrag folgt und dann auf "Quelltext anzeigen" geht, findet man folgendes CSS zur Umsetzung der Abstandsfrage:

<style>

    #header>.topline{
        padding-top: 1.5em;
        padding-bottom: 1.5em;
    }

    #wrapper>.main{
        padding-top: 1em;
    }

    #wrapper>.main{
        padding-bottom: 1em;
    }

</style>    

Manchmal kommt es gar nicht darauf an, spezielle CSS-Kenntnisse zu haben, sondern man muss nur suchen, ob jemand anders dieses oder ein ähnliches Problem auch schon hatte und wie die endgültige Lösung auf der Homepage aussieht.

Hinweis: die Beiträge #5 bis #11 wurden aus einer anderen Fragestellung in dieses Thema überführt, da identisches Layout und Fragestellung.

Hallo Hanabi,

ich habe auch den neuen Code bereits eingegeben, jedoch hat sich die ganze Sache nur um ca 1 mm nach links verschoben. Der Abstand ist jedoch noch gewaltig groß.

Frohes neues Jahr an das Zeta Team,

der Fehler lässt sich leider mit keiner mir bekannten Methode beheben.

Hallo Zeta Team,

mir scheint leider dass ich übers Forum nicht so ganz weiter komme. Wäre es ok wenn ich Ihnen meine Datei durchschicke, damit Sie diese mit Ihrem Programm bearbeiten?

Das Zeta Team hat bis 8. Jänner Betriebsferien.

Da können wir nur helfen, wenn wir die Seite live ansehen können. Sie müssten uns dazu also die entsprechende URL nennen.

Hallo Stefan,

da habe ich aber dann ein kleines Problem, diese Website ist für einen Kunden von uns und sollte deshalb nicht vorzeitig ins öffentliche Netz gestellt werden.

Aus Datenschutz gründen darf ich den Link hier leider nicht reinstellen. (Die Homepage ist noch nicht Online)

Wäre es möglich es über Optionen "Projekt senden" euch zukommen zu lassen?

Bitte ggf. auf einen entsprechend abgesicherten Testserver veröffentlichen und uns dann den Link zu diesem Artikel (als Referenz) mit der URL zum Testserver per Mail an support[ät]zeta-producer.com ([ät] durch @ ersetzen) senden. Alternativ ein Support-Ticket lösen und wir schauen uns das dann per Fernwartung an.

Marko Tortorelli ,

Sie haben uns das Projekt ja nun auf einen Testserver veröffentlicht. Sie nutzen ein anderes Layout, nämlich "Stripe Responsive" und Sie möchten den Abstand unter dem Logo, das Sie in Ihrem Projekt aber nicht als "Logo" eingebaut haben, sondern in der Kopfgrafik verringern.

Entfernen Sie bitte sämtlichen CSS-Code, den Sie bisher im Projekt eingefügt haben. Der CSS-Code ist layout-spezifisch und sie haben code eingefügt, der für ein anderes Layout gedacht ist.

Anschließend passen Sie bitte in den Layout-Einstellungen die Mindesthöhe der Kopfgrafik wunschgemäß an.

Danach können die Abstände unter der Kopfgrafik mit folgendem CSS weiter verkleinert werden:

<style>
#header{
    margin-bottom: 0;
}
div.flex-caption{
    padding-bottom: 0;
}
</style>

Weitergehenden Support für angepasstes CSS können wir vom Zeta-Team ihnen zu diesem Fall nicht bieten.