In mobiler Ansicht 2 menubars

looks

Hallo zusammen,

arbeite mit WP 4.5.3, Theme Make mit Child und dem Plugin Max Mega Menu.

Nun habe ich das Problem, dass ich bei mobilen Geräten jeweils zwei Balken habe mit dem Icon der drei Striche, um das Menü zu öffnen. Mir ist klar, dass dies durch das Plugin max mega Menü und dem eingebaute Menü entstanden ist. Die Struktur sieht so aus:

Hauptmenüpunkt "Werk" -> Seite "werk" -> auf dieser Seite hat es verschiedene Links auf verschiedene Beiträge.

Nun will ich, dass wenn ich auf einen dieser Beiträge klicke trotzdem oben noch der Menüpunkt "Werk" fett angezeigt wird. Dies habe ich mit dem zusätzlichen Plugin erreicht, denn dort kann ich Untermenüs erstellen und diese Unsichtbar machen.
Der Nachteil ist dabei, dass dadurch eben bei mobiler Ansicht zwei Menübalken angezeigt werden.

Ich habe dann mit diesem Code im style.css versucht:

-----
Media screen and (max-width: 800px) {
.site-navigation {
display: none;
}
-----

Dieser Code aber nimmt mir beide Menübalken weg, das heisst ich habe gar keine Navi mehr.

Kann mir da jemand weiter helfen, wie ich nur die im Wordpress installierte Navi weg bekomme?
Oder gibt es einen anderen Ansatz für das Ganze?

Gruss
Looks

Werbepost

Hallo!

Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
✔️ Deutsche Server & DSGVO-konform
✔️ Persönlicher Support (kein 0815-Ticket-System)

Mehr erfahren

helix

Evtl. über die Body-Classes. Haben die Beiträge, die unterhalb „Werk“ erscheinen, eine gemeinsam? z.B. eine gemeinsame Kategorie / Überkategorie, die an anderer Stelle nicht verwendet wird – ließe sich evtl. auch als zusätzliche Kategorie anlegen und zuweisen, wenn du nicht anzeigen lässt, in welcher Kategorie ein Beitrag gepostet ist.

Dann im Stylesheet definieren, dass #menu-item-soundsoviel (Werk) fett angezeigt wird, wenn es in der entsprechenden Body-Class steckt.

Gruß
helix

looks

Hallo helix,

Wieder mal an einem anderen Ort.

Also ich habe eine Kategorie Werk in der es Unterkategorien Werkgruppen und Ausstellungen gibt, wo dann jeweils mehrere Beiträge sind.

Das mit dem menu-item, muss ich mir morgen mal anschauen, wie ich das bewerkstelligen könnte.

Danke schon mal für den Tip.

Gruss
Looks

helix

ja, dann müsste die (Ober-)Kategorie Werk als eine Klasse im body-Tag auftauchen, z.B. category-werk. Und dein Link „Werk“ hat eine eigene id, mindestens #menu-item-soundsoviel.
Dann ist die Bedingung für deine Formatierung einfach .category-werk #menu-item-soundsoviel => formatiere so.

Gruß
helix

looks

Hallo helix,

Ich habe jetzt mal mit dem Entwicklertool im Browser folgendes gesehen:

wenn ich auf irgendeiner anderen Seite (ausser Werk) bin, dann ist Werk nicht fett und dazu gibt es folgenden Code:
<li id="menu-item-88" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-88"><a href="http://colettecouleau.ch/wordpress/werk/">Werk</a></li>

wenn ich auf werk klicke und die Seite werk offen ist, dann ist werk in der Navi fett und es sieht so aus:
<li id="menu-item-88" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-14 current_page_item menu-item-88"><a href="http://colettecouleau.ch/wordpress/werk/">Werk</a></li>

wenn ich aber einen Beitrag (hier Lichtung) auf Werk anklicke, dann finde ich im Body folgenden code:
<body class="single single-post postid-215 single-format-standard logged-in admin-bar custom-background view-post full-width header-bar-flipped wpb-js-composer js-comp-ver-4.12 vc_responsive customize-support">
und weiter unten noch diesen code, wo eine category drin hat:
<article id="post-215" class="post-215 post type-post status-publish format-standard hentry category-werkgruppen">

Jetzt weiss ich zwar Id class etc., aber nun den Code zu machen, das übersteigt meine Möglichkeiten.
Wichtig wäre, dass man diesen Code irgendwie übergeordnet eingeben könnte, so dass er dann bei allen Beiträgen der Unterkategorien werkgruppen und austellungen funktioniert.
Kannst DU mir da weiter helfen?

Gruss
Looks

helix

Ah, nicht ganz gut. Ich hatte gehofft, dass die Kategorie schon als Klasse im body-Tag auftaucht. Dein article-Tag ist ja im Quelltext an völlig anderer Stelle, wenn du nicht sehr großes Glück hast, ist es unmöglich, über die Kategorieklasse im article-Tag dein Menü anzusprechen.

Schau dir mal bitte dieses PlugIn an: https://wordpress.org/plugins/wp247-body-classes/
Damit müsstest du eine kategorispezifische Bodyclass ergänzen können.

Und dann ist der Code, den du in deine CSS-Datei (Childtheme oder custom CSS) eingeben musst, ganz einfach:

Code

.category-werkgruppen #menu-item-88, .category-ausstellungen #menu-item-88 {
    und hier die css-Anweisung für den aktiven Link
}

Gruß
helix

looks

Ich habe mal das Plugin runter geladen, aber da finde ich nur unter archive eine Kategorie Möglichkeit und nicht bei post.
da gibt es die Bodyclass Ergänzung [COLOR=#444444][FONT=&quot]is_category() [/FONT][/COLOR] für eben archive. So wie ich Dich aber verstanden habe, müsste ich ja so etwas in den post body eingeben.
Oder habe ich da was falsch verstanden?

helix

Nein, hast du ganz richtig verstanden.

Jetzt kannst du entweder die ganzen PlugIns durchsuchen, ob du eines findest, das kann, was du brauchst. Oder – du hast ja bereits ein Child-Theme – ergänzst du dort an passender Stelle eine Klasse.

Sorry, wenn ich vielleicht manchmal etwas umständlich bin. Ich hätte gleich meine Templatedateien entsprechend angepasst, ohne mir erst die Mühe zu machen nachzusehen, ob mir vielleicht ein PlugIn die Arbeit abnehmen kann …

Und das würde ich dann konkret so machen, dass ich diesen Codeschnipsel in der functions.php des Child-Themes ergänze:

PHP

<?php
function mychild_body_classes( $classes ) {
    if ( in_category( 'werkgruppen' ) || in_category( 'ausstellungen' ) ) {
        $classes[] = 'werk';
    }


    return $classes;
}
add_filter( 'body_class', 'mychild_body_classes' );
?>

Alles anzeigen

Hoffe, das hilft weiter. (Du solltest dann bei Beiträgen innerhalb der Kategorien „werkgruppen“ und „ausstellungen“ die zusätzliche Klasse „werk“ im body-Tag haben.)

Gruß
helix

Gruß

looks

hallo helix,

Ich habe jetzt diesen PHP-Code in die function.php eingesetzt und dann sehe ich im body unter class "werk".
danach habe ich, Dein Code von oben abgeändert, aber das hat nicht funktioniert. ich habe es so gemacht, frage mich aber ob es da auch noch category braucht.

ausprobiert habe ich dies hier:

Code

.category-werk #menu-item-88 {    font-weight: bold;
}

oder so

Code

.werk #menu-item-88 {    font-weight: bold;
}

aber beides hatte keinen Effekt.

gruss
Looks

bearbeitet: diesen code habe ich in die style.css gemacht.

helix

Nein, die category braucht es nicht. Die Klasse heißt ja nur „werk“.

Dass es nicht greift, kann daran liegen, dass die Menü-items durch weitere Klassen oder IDs bereits „genauer“ definiert sind (eben cascading Stylesheet …)

Probier mal, ob es mit einem nachgestellten !important geht?

Und sonst: Schau mal in der CSS-Datei deines Ursprungs-Themes – oder lies über Webentwickler-Tool aus, wie der fett gesetzte „aktive“ Link sonst definiert ist. Im Prinzip kannst du dir die Definition für die Anzeige des current-menu-item schnappen. Vor den ganzen Sermon schreibst du deine Klasse .werk und statt .current-menu-item schreibst du #menu-item-88

Gruß
helix

looks

Helix, Du bist mein Held, so hat es nun funktioniert:

Code

.werk .site-navigation .menu .current_page_item > a, .site-navigation .menu #menu-item-88 > a, .site-navigation .nav-menu .current_page_item > a, .site-navigation .nav-menu .current-menu-item > a {    font-weight: bold;
}

Vielen Dank für Deine Geduld mit mir, denn ich bin da noch ziemlicher Anfänger, aber lerne täglich dazu.

Gruß und schönes Wochenende
Looks

helix

Zitat von looks

Helix, Du bist mein Held, so hat es nun funktioniert: […]

Ach danke, keine Ursache.

Wenn ich deinen Code sehe … vielleicht hätte es genügt, hinter das ursprünglich gedachte css gerade noch das a-Element anzuhängen. Das ist es ja, was eigentlich angesprochen werden soll. Wäre es mir selber passiert, wäre ich vielleicht schnell drauf gekommen … (Wobei, wenn man das CSS „ganz von Anfang“ aufbaut, dann fallen manche Sachen schneller auf, weil dann alle Links eben zunächst mal den Browser-Standard zeigen: blau, wenn bereits besucht, violett.)
Nein, brauchst du jetzt nicht auszuprobieren.

Gruß
helix

looks

ich lasse es jetzt mal so. Ist ja meine erste Wordpress Website, die ich jetzt da bastle und wenn ich dann da weiter mache, dann werde ich sicher besser und weniger chaotisch als jetzt.

Gruss
Looks

looks

Korrektur: Erst später habe ich gemerkt, dass der Code so nicht geht, weil damit immer der Begriff "Werk" fett angezeigt wurde und zwar überall. Ich habe nun den Code verkürzt und so geht es :

Code

.werk .site-navigation .menu #menu-item-88 > a{    font-weight: bold;
}

Willkommen! Melden Sie sich an oder registrieren Sie sich.

In mobiler Ansicht 2 menubars

Jetzt mitmachen!

Benutzer online in diesem Thema