Die primäre Menüleiste in Divi mit einem Hintergrundbild auszustatten, ist gar nicht so schwer. Daraus ergeben sich mannigfaltige grafische Möglichkeiten von denen ich eine im heutigen Video erklären möchte.

 

 

Hier Beispiel-PNG, mit die Ihr Euch auch gerne herunterladen und zum testen nehmen könnt. Dazu einfach aufs Bild klicken, rechte Maustaste, speichern unter…

Background 1
Background 2
Background 2
Beispiellayout:

Mit diesem CSS-Codeblock kannst Du die primäre Menüleiste in Divi mit einem eigenen Hintergrundbild ausstatten. Bei der Background URL musst Du natürlich Deinen eigenen Bildpfad eintragen!

#main-header{
 background: url(https://divi24.cordmedia.de/wp-content/uploads/2016/11/divi_header_001_0001_Ebene-1-2.png) no-repeat !important;
 background-size: 100% 100% !important;
}

 

Den Schatten des gesamten Inhaltscontainers kannst Du mit diesem Code ausschalten:

#page-container { 
-moz-box-shadow:none !important; 
-webkit-box-shadow:none !important; 
box-shadow:none !important; 
}

 

 

 

Die Menüpunkte, das Suchsymbol und das Suchformular kannst Du, wenn notwendig, mit diesem Code anpassen:

#et-top-navigation nav > ul > li > a {
 padding-bottom: 10px!important;
 padding-top: 25px!important;
}

#et_top_search {
 display: block;
 float: right;
 position: relative;
 width: 18px;
 margin: 25px 0 0 22px;
}

.et-search-form {
 position: absolute;
 z-index: 1000;
 top: 75px;
 right: 0;
 bottom: 0;
 width: 100%;
}