Page 1 of 2

Aktives Menüelement

Posted: Mon Oct 24, 2016 8:29 pm
by AndiLeni
Hallo,
gibt es eine Möglichkeit das aktive Menüelement mit der Klasse 'active' zu versehen?
Ich möchte also, dass die Seite auf der ich mich gerade befinde im Menü diese Klasse zugewiesen bekommt.

Re: Aktives Menüelement

Posted: Mon Oct 24, 2016 10:06 pm
by Edi
Beispiele dafür enthält das Plugin "Menü aller Seiten".

Als Klasse für einen aktiven Hauptmenüpunkt beispielsweise wird definiert:

Code: Select all

$html .= '<a class="parent'.( ($parent->key()==$Url->slug())?' active':'').'" href="'.$parent->permalink().'">'.$parent->title().'</a>';
Als Klasse wird bei einem aktiven Hauptmenüpunkt also die Klasse "active" mit (($parent->key()==$Url->slug())?' active':'') hinzugefügt.

Re: Aktives Menüelement

Posted: Tue Oct 25, 2016 1:58 pm
by AndiLeni
Wo genau muss ich diesen Code nun in meiner Navigation einsetzen?

Code: Select all

<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
            <ul class="nav navbar-nav navbar-right">
            <?php
                $parents = $pagesParents[NO_PARENT_CHAR];
                foreach($parents as $Parent) {
                    echo '<li><a href="'.$Parent->permalink().'">'.$Parent->title().'</a></li>';
                }
            ?>
            </ul>
        </div>

Re: Aktives Menüelement

Posted: Tue Oct 25, 2016 11:33 pm
by Edi
Versuche es einmal so:

Code: Select all

<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
            <ul class="nav navbar-nav navbar-right">
            <?php
                $parents = $pagesParents[NO_PARENT_CHAR];
                foreach($parents as $Parent) {
                    echo '<li><a class="parent'.( ($parent->key()==$Url->slug())?' active':'').'" href="'.$parent->permalink().'">'.$parent->title().'</a></li>';
                }
            ?>
            </ul>
        </div>
Und nicht vergessen, im CSS die Klasse "active" zu definieren.

Re: Aktives Menüelement

Posted: Wed Oct 26, 2016 1:52 pm
by AndiLeni
Ich habe den Code so eingesetzt. Merkwürdigerweise erhalte ich den Error, dass 'parent' nicht definiert ist. Eigentlich verwende ich diese doch bereits?

Notice: Undefined variable: parent in C:\MAMP\htdocs\bludit\bl-themes\cleanblog2\php\navbar.php on line 21

Fatal error: Uncaught Error: Call to a member function key() on null

Re: Aktives Menüelement

Posted: Wed Oct 26, 2016 2:32 pm
by kwwd
moin,

da steht doch auch $Parent im Schleifenkopf und nicht $parent ...

Re: Aktives Menüelement

Posted: Wed Oct 26, 2016 7:33 pm
by AndiLeni
Puh. Da hast du Recht. Das habe ich übersehen. :roll:
Das beseitigt den Error.
Vielen Dank

Re: Aktives Menüelement

Posted: Wed Oct 26, 2016 7:43 pm
by kwwd
;)

Re: Aktives Menüelement

Posted: Thu Nov 21, 2019 9:38 am
by planlos
Hallo liebe Community!
Verzeihung das ich diesen alten Topic wieder hochhole. In der Version 3.10.0 ist der beschriebene Codeschnippsel nicht mehr zu finden. Ich selbst, bin leider nicht befähigt, das in die neue Version zu übersetzen.
Mag mir da jemand helfen?

Viele Grüße
planlos

Re: Aktives Menüelement

Posted: Thu Nov 21, 2019 6:39 pm
by kohbarg
Eine Möglichkeit: Such dir in deinem Theme im Ordner /php die navbar.php.
Dort findest du meist:

Code: Select all

<!-- Static pages -->
<?php foreach ($staticContent as $staticPage): ?>
	<li class="nav-item">
 		<a class="nav-link " href="<?php echo $staticPage->permalink(); ?>"><?php echo $staticPage->title(); ?></a>
	</li>
<?php endforeach ?>
Das ergänzt du dann zB. zu diesem Code:

Code: Select all

<!-- Static pages -->
<?php foreach ($staticContent as $staticPage): ?>
	<li class="nav-item">
           <?php $active = ($staticPage->key() == $url->slug())? 'active': ''; ?> 
            <a class="nav-link <?php echo $active; ?>" href="<?php echo $staticPage->permalink(); ?>"><?php echo $staticPage->title(); ?></a>
				</li>
				<?php endforeach ?>
Immer wenn der pageKey mit dem urlSlug übereinstimmt, wird der nav-link-Klasse eine active-Klasse hinzugefügt. So mach ich das bei mir. Die active-Klasse kannst du dann nach Wunsch mit css stylen.