Willkommen bei Schnipsel, Code Schnipsel zu Wordpress, PHP, HTML, CSS, jQuery und so weiter...

Navigation für statische Webseiten

05.2009 / von: David Hellmann / 5 Kommentare / Kategorie: PHP / Tags: ,

Von Thomas geklaut. Eine statische Seite besteht meistens aus mehreren HTML Dateien. Bestenfalls sind es aber keine HTML Dateien sondern PHP Dateien da man dort wie der Name schon sagt PHP einsetzen kann. Man könnte jetzt in der Navigation auf jeder Seite von Hand den aktuellen Manüpunkt hervorheben. Ein wenig einfacher geht das aber mittels PHP. Die Navigation wird dann in die Datei "header.php" ausgelagert und später in den jeweiligen Seiten per "include" eingefügt.

Als erstes gibt man jeder Datei eine kleine PHP Zeile mit, diese kommt ganz oben in die Datei und sieht wie folgt aus:

1
2
3
4
5
6
7
8

<?php $pageID = "startseite"; ?>
<?php include('include/header.php'); ?>
// In der "header.php" befindet sich dann die Navigation
 
<h2>Startseite</h2>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin pellentesque, est ut venenatis aliquam, lorem quam porttitor ligula, eget ultrices velit dui sed quam. Praesent vehicula placerat lectus. Nulla pede. Quisque a nulla quis massa pulvinar sagittis. Pellentesque neque massa, mattis vulputate, pellentesque nec, vehicula volutpat, purus. Proin pretium dui et nulla cursus eleifend. Aenean aliquam urna eget urna. Vestibulum euismod elit. Donec eget augue sit amet neque elementum pretium. Proin posuere lacus id lacus. Duis vel justo suscipit neque ornare iaculis.</p>
 
<?php include('include/footer.php'); ?>

Jetzt kommt die Navigation die dann wie folgt aussehen könnte:

1
2
3
4
5
6

<ul id="navi">
	<li><a class="<?php if($pageID == startseite) echo('aktiv'); ?>" href="index.php">Home</a></li>
	<li><a class="<?php if($pageID == portfolio) echo('aktiv'); ?>" href="portfolio.php">Pension</a></li>
	<li><a class="<?php if($pageID == about) echo('aktiv'); ?>" href="about.php">Mosel</a></li>
	<li><a class="<?php if($pageID == kontakt) echo('aktiv'); ?>" href="kontakt.php">Briedel</a></li>
</ul>

Hier wird nun einfach abgefragt "Wenn pageID gleich startseite dann gebe "aktiv" aus. Somit wird nur auf der aktuellen Seite das "aktiv" ausgegeben und der Menüpunkt wird hervorgehoben.

Statistik: read: 3512 / today: 3 / last: 16.05.2012
‹ // ›

  1. 5 Kommetare • Eintrag schreiben

  2. Marvin →
    #1 Permalink Am 20. May 2009 um 22:17 Uhr

    Ich würde das “class” ja mit in die if anweisung machen, sonst hat man ja auf den meisten seiten leere class atribute :)

  3. David Hellmann →
    #2 Permalink Am 20. May 2009 um 22:26 Uhr

    OK, meistens hat man ja in der Navi eh meist .start .portfolio etc noch davor. Aber stimmt schon, wenn es so ist ist man keine hat sollte man vielleicht eine IF Abfrage machen :)

  4. Nico
    #3 Permalink Am 1. December 2010 um 18:28 Uhr

    noch ne kleine anmerkung bei den active links würde ich eher short if conditionals verwenden

    1

    ($bedingung != "wert") ? true : false;

  5. Niko
    #4 Permalink Am 6. April 2012 um 22:27 Uhr

    Das geht noch einfacher, dann musst du keine Variable mehr ändern, da in basename immer der aktuelle dateiname enthalten ist. LG Niko

    1
2
3

     
 
&lt;a href=&quot;seite1.php&quot;  class="active" &gt;ja </a>

  6. Niko
    #5 Permalink Am 6. April 2012 um 22:29 Uhr 

    1
2
3

    PHP $page = basename($_SERVER['SCRIPT_NAME']);?PHP 
 
&lt;a href=&quot;seite1.php&quot; target=&quot;_blank&quot;  class="active" &gt;ja </a>

Kommentar schreiben

Code einfügen: <pre lang="php" line="1"> Code hier </pre>