Breadcrumb-Navigation mit PHP

von Florian Fischer

Brotkrumen als Navigationshilfe sind zwar kein zentrales Instrument, doch allemal hilfreich – besonders wenn es zahlreiche Rubriken gibt. Man kann das manuell, mit Javascript oder mit PHP realisieren. Angenehmer Zusatznutzen der PHP-Variante: barrierearm und suchmaschinentauglich ist diese Lösung ebenfalls.

Dabei wird die URL zur jeweiligen Seite untersucht, die einzelnen Unterordner ermittelt und verlinkt. Eine so genannte Breadcrumb-Navigation entsteht.


Brotkrume bei Yahoo

Der Usability-Experte Steve Krug schreibt in „Don’t make me think!“ ab Seite 75 über das optimale Erscheinungsbild von Breadcrumbs.

Demnach sollte eine Breadcrumb-Navigation im Idealfall:

  • oben platziert sein
  • zwischen den einzelnen Levels ein größer-als-Zeichen ‚>‘ enthalten (Doppelpunkt ‚:‘ oder ein Slash ‚/‘ geht auch)
  • in einer kleinen Schriftart geschrieben sein
  • die Worte ‚Sie befinden sich hier:‘ enthalten und
  • die angezeigte Seite auf der man sich befindet, sollte in fetter Schrift gesetzt und nicht klickbar sein.

Alles klar! Aufbauend auf diesen Vorschlägen, hier nun das folgende PHP-Script:

 <?php
    $an="Sie befinden sind hier: ";
    $home="http://www.drweb.de/"; // Hier Ihre Domain 
    $pie=explode("/","$_SERVER[PHP_SELF]");
    $tr=" > "; // Alternativ: ':', '/'
    $b=count($pie);
    echo $an."<a href=\"".$home."\">Startseite</a>";
    // Alternativ: 'Home', 'Start'
    for($a=1;$a<$b-1;$a++){
    $ta=$ta.$pie[$a]."/";
    echo $tr."<a href=\"".$home.$ta."\">".ucfirst($pie[$a])."</a>";}
    $file=explode('.',ucfirst($pie[$b-1]));
    echo "<b>".$tr.$file[0]."</b>";
    ?>

Fügen Sie diesen Codeabschnitt auf allen Seiten die mit der Breadcrumb-Navigation ausgestattet werden sollen, an der gewünschten Position ein.

Das Script arbeitet recht einfach:

  • per ‚explode(„/“,“$_SERVER[PHP_SELF]“)‘ wird die momentan aktuelle URL mit Hilfe des Trennzeichens ‚/‘ aufgelöst und in ein Array geschrieben.
  • ‚Startseite‘ wird mit einem Link zu Ihrer Domain ausgegeben.
  • Anschließend wird mit einer Schleife jedes Element aus dem Array mit sich selbst verlinkt, per ‚ucfirst‘ das erste Zeichen jedes vorhandenen Ordners grossgeschrieben und mit dem Trennzeichen ‚/‘ ausgegeben.
  • Und in der Folge die momentan aktuelle Datei, diesmal ohne Verlinkung und auch ohne Dateiendung, angezeigt.

Da das Script die Ordner- und Dateinamen anzeigt, achten Sie bereits bei der Vergabe von Bezeichnungen der einzelnen Ordner auf eine lesbare Struktur. Immerhin liest sich:

Sie befinden sich hier: Startseite > Onlineshop > Computer > Eingabegeräte

besser als

Sie befinden sich hier: Startseite > Sho > Comp > Index

Nach dem Einbau, steht den Benützern Ihrer Website eine voll-funktionsfähige Breadcrumb-Navigation zur Verfügung, die nicht auf aktiviertes JavaScript angewiesen ist, sich bestes für eine korrekte Indexierung durch Suchmaschinen eignet und auch den Segen von Steve Krug bekommen sollte.

Sortiert nach:   neueste | älteste | beste Bewertung
Volker
Gast
7 Jahre 10 Monate her

Danke, endlich mal ein richtig gute anleitung, um die seiten zu optimieren. nochmals danke

Volker
Gast
7 Jahre 10 Monate her

das kommt davon, wenn man zu schnell mit dem tippen ist. sorry

trackback

[…] und Gretel" hei

Domenico
Gast
Domenico
7 Jahre 4 Monate her

Muss schon sagen, genau so was habe ich gesucht
danke

Petra
Gast
Petra
7 Jahre 3 Monate her

Supergeschichte, nur leider habe ich eine interne Umleitung auf meiner Domain. Da muss ich wohl etwas weiterpfriemeln. Gruß. Petra.

Mike
Gast
7 Jahre 19 Tage her

Stammt der Begriff Breadcrumb (deutsch: Brotkrumen) nicht aus dem Märchen „Hänsel und Gretel“?

Yassine
Gast
Yassine
6 Jahre 1 Monat her

Also ich dachte mit meinem jetzigen PHP Stand könnte ich sowas noch nicht, aber das Beispiel hier ist so simpel, dass es schon wieder genial ist!
Danke! ;D

sohel
Gast
sohel
4 Jahre 2 Monate her

Danke für gute anleitung

jonas
Gast
4 Jahre 1 Monat her

super Anleitung, trotzdem eine Frage:

wie muss der Code aussehen, wenn die Ordnerstruktur nicht verlinkt sein soll, d.h. nur die Startseite soll als Link nutzbar sein, der Rest als einfacher Text?

OSTTFA
Gast
OSTTFA
3 Jahre 6 Monate her

Super Anleitung. Nur eine Frage hierzu:

Da ich die verschiedenen index.php in Unterordnern nicht über .htaccess umschreiben kann, habe ich folgende Linkstruktur für die Startseiten der Unterordner:

http://www.domain.de/ordner anstelle von http://www.domain.de/ordner/index

Leider Gibt die Breadcrumb den Index auch mit aus, obwohl die Datei gar nicht in der URL steht:

Sie befinden sich hier: Startseite > Ordner > Index

Kann man eine Regel anwenden, dass die Index in der Breadcrumb nicht angezeigt wird?

Danke für Tipps vorab!

Gruß

Markus27
Gast
Markus27
2 Jahre 10 Monate her

Dieser Beschreibung schließe ich mich an.

Lukas
Gast
Lukas
2 Jahre 9 Monate her

Das würde mich auch brennend interessieren ob es für dieses Problem eine Lösung gibt…?

RGM
Gast
RGM
3 Jahre 3 Monate her

Hallo,
bekomme die folgende Fehlermeldung wenn ich es in einem Unterordner anlege!‘

Notice: Undefined variable: ta in /var/www/web4/html/include/breadcrumb.php on line 10 >

Was muss ich hier ändern?

Torsten Sack-Müller
Gast
3 Jahre 1 Monat her

Ziemlich alter Artikel, den ich hier gefunden habe. Das Skript funktioniert wohl nur im Falle von statischen HTML-Seiten. Bei aus Datenbanken generiertem Inhalt (zentrale index.php + Theme-Dateien + Datenbankinhalte) klappt es nicht. Aber für aktuelle Content-Management-Systeme kann man meistens eine Brotkrumen-Navigation als Add-on bekommen.

Marcel
Gast
2 Jahre 10 Monate her

Vielen Dank für das klasse Script. Erfüllt genau seinen Zweck.

Jürgen
Gast
2 Jahre 6 Monate her

Das Script funktioniert nach wie vor einwandfrei. Man benötigt jedoch auf jeder Ebene eine index.html oder index.php Datei, damit der gewünschte Effekt erzielt wird.

wpDiscuz

Mit der Nutzung unseres Angebots erklärst du dich damit einverstanden, dass wir Cookies verwenden. Weitere Informationen

Wir verwenden Cookies, um Inhalte und Anzeigen zu personalisieren, Funktionen für soziale Medien anzubieten und die Zugriffe auf unsere Website zu analysieren. Dadurch geben wir nicht personenbezogene Informationen zur Nutzung unserer Website an unsere Partner für soziale Medien, Werbung und Analysen weiter. Nähere Informationen findest du in unserer Datenschutzerklärung. Durch die Weiternutzung unserer Website (oder das ausdrückliche Klicken auf "Einverstanden") gehen wir davon aus, dass du mit der Verwendung von Cookies einverstanden bist.

Schließen