Support » Themes » [TwentyTwelve] Seperates Menü im Header

  • Gelöst fuenfzigccm

    (@fuenfzigccm)


    Hallo Leute,

    ich versuche gerade TwentyTwelve in meinem Child- Theme um ein Menü im Bereich des Headers zu erweitern. Hierfür hab ich in der functions.php durch folgenden Code ein neues Menü registriert.

    function register_my_menu() {
      register_nav_menu('head-menu',__( 'Header Menu' ));
    }
    add_action( 'init', 'register_my_menu' );

    Weiterhin hab ich dann in der header.php über dem schließenden </hgroup> folgenden Code eingefügt, damit er mir das Menü im Header anzeigt:

    <?php wp_nav_menu( array( 'theme_location' => 'head-menu', 'menu_class' => 'head-menu' ) ); ?>

    Das funktioniert auch soweit. Das Menü lässt sich in der style.css über folgenden Code- Block auch stylen.

    .head-menu {
    
    	background-color: #fff;
    	margin-top: -50px;
    	margin-right: 250px;
    	max-width: 96px;
    	float: right;
    }
    
    .head-menu li {
    	font-size: 24px;
    	font-size: 0.857142857rem;
    	line-height: 1.42857143;
    }
    
    .head-menu a {
    	color: #5e5e5e;
    	background-color: #fff;
    
    }
    .head-menu a:hover,
    .head-menu a:focus {
    	color: #000;
    }

    Jedoch hätte ich es nun gerne, dass das Menü horizontal sortiert wird.
    Hab es schon mit .head-menu ul li { display: inline-block;} versucht, jedoch ohne Erfolg.
    Gibt leider kein Beispiel zur Seite, da diese nur lokal vorliegt. Bis auf die beschriebenen Veränderungen ist es aber das stock- TwentyTwelve- Theme. Vielleicht hat ja jemand einen Ratschlag für mich ?

    Liebe Grüße,

    fuenfzigccm

Ansicht von 4 Antworten - 1 bis 4 (von insgesamt 4)
  • Wenn ich es richtig verstehe, geht es doch nur darum, dass die für das Navigationsmenü verwendete, unsortierte Liste (<ul class="head-menu">) horizontal ausgegeben wird? (Die Sortierung ergibt sich entweder aus dem benutzerdefinierten Menü oder – als Rückfalloption – aus dem numerischen Wert der Seitentreihenfolge, der bei der Erstellung der Seite als Attribut eingegeben werden kann. Ist auch kein numerischer Wert vorhanden, erfolgt die Darstellung alphabetisch sortiert.)

    Die horizontale Darstellung kann entweder mit Flexbox erreicht werden oder klassisch, in dem man die Listen-Elemente als inline-block anzeigen lässt:

    ul.head.menu li {
     display:inline-block;
    }
    a {
     display: block;
     width: 100%;
     background: #e0e0e0;
     padding: 10px;
    }
    a:hover {
     background: #444;
    }

    Vielen Dank für den Tipp!
    Ich hatte das jetzt zwischenzeitlich einfach ohne php gelöst und einfach ein Menü in CSS und HTML erstellt. Da das im Header steht und eh nicht erweitert werden soll, reicht das für mich jetzt erstmal.
    Ich werd deinen Lösungsweg trotzdem noch ausprobieren.
    Markiere den Thread damit jetzt mal als gelöst.

    lg fuenfzigccm

    zwischenzeitlich einfach ohne php gelöst und einfach ein Menü in CSS und HTML erstellt

    Das kann man so machen, sieht dann aber … nicht nach einem Content Management System aus.

    Da hast du wohl Recht. In dem Menü sind aber nur ein Link zum Impressum und zur Kontaktseite. Da ist ja nicht besonders Inhalt zu verwalten. Ich find das tatsächlich auch nicht so elegant, aber nun läuft es erstmal.
    Trotzdem Danke.

Ansicht von 4 Antworten - 1 bis 4 (von insgesamt 4)
  • Das Thema „[TwentyTwelve] Seperates Menü im Header“ ist für neue Antworten geschlossen.