Abstand ÜBER dem Header/Menü verkleinern

„… und wie alt ist der Kapitän?“

So ähnlich enden doch Fragen, die man nicht beantworten kann, weil wesentliche Informationen fehlen? (Nennt sich übrigens Kapitänssyndrom.)

Nein, im Ernst – so ganz ohne Infos zur Website können wir deine Frage kaum beantworten. Wir wissen nicht, welches Theme du nutzt, haben keine URL um uns das anzuschauen und der Website-Bericht fehlt auch.

Ich nutze das Theme Twenty-Twenty One. Einen Link kann ich nicht hinzufügen, da es sich um eine Firmenseite handelt, welche vor Fertigstellung nicht gesehen werden soll. Ich dachte es gibt vielleicht einen allgemeinen CSS-Code, der das regeln kann.

Eine Universallösung gibt es nicht, weil sich die Themes zu sehr voneinander unterscheiden.

Das Theme Twenty Twenty-One sieht keine Einstellungsmöglichkeit im Customizer für den Abstand oberhalb des Headers vor. Du kannst das also nur mit einer eigenen CSS-Regel einrichten, die du im Customizer unter Zusätzliches CSS einträgst, sinngemäß so etwas wie

.site-header {
  margin-top: 200px; /* Wert bitte anpassen */
}

Der Header bekommt außerdem über das Stylesheet des Themes einen Innenabstand zugewiesen, der je nach Display-Größe unterschiedlich ausfällt:

  @media only screen and (min-width: 822px) {
.site-header {
  padding-top: calc(2.4 * var(--global--spacing-vertical));
}
}
  @media only screen and (min-width: 482px) {
.site-header {
  padding-top: calc(var(--global--spacing-vertical) / 0.75);
}
}

Diese Werte kannst du auch mit eigenen CSS-Regeln anpassen.

Rasch noch der obligatorische Hinweis, dass wir hier eigentlich keine Grundlagen in HTML, CSS, PHP, JavaScript usw. vermitteln möchten und auch nicht auf Zuruf CSS-Regeln zur Verfügung stellen. Ich habe hier eine Ausnahme gemacht, aus der andere Anwender/-innen aber keine Ansprüche ableiten sollten.

 

This site will teach you how to build a WordPress website for beginners. We will cover everything from installing WordPress to adding pages, posts, and images to your site. You will learn how to customize your site with themes and plugins, as well as how to market your site online.

Buy WordPress Transfer