Tutorial
Kopfbereich mit HTML gestalten - WordPress
Hier möchte ich vorstellen, wie man einen Custom-Header in HTML für WordPress erstellt.
Zuerst installiert man Simple Custom CSS and JS
Dann erstellt man einen neuen HTML-Code
Nun fügt man HTML ein, zum Beispiel folgenden Schnipsel für ein Bild mit Titel:
<div class="c-top">
<span>Big Headline</span>
</div>
<span>Big Headline</span>
</div>
Select Code
Man kann beliebiges HTML einfügen!
Das wars auch schon!
Nun fügt man CSS ein, zum Beispiel folgenden Schnipsel für ein Bild mit Titel:
.c-top {
width:100%;
background:url('pfad-zum-bild.jpg');
aspect-ratio:1920/400; /*Auflösung des Bildes*/
display: flex;
color: #fff;
flex-direction: row;
align-content: center;
justify-content: center;
align-items: center;
}
.c-top span {
font-size:40px;
}
width:100%;
background:url('pfad-zum-bild.jpg');
aspect-ratio:1920/400; /*Auflösung des Bildes*/
display: flex;
color: #fff;
flex-direction: row;
align-content: center;
justify-content: center;
align-items: center;
}
.c-top span {
font-size:40px;
}
Select Code
Das Ergebnis könnte so aussehen:
