WordPress sieht «Out of the Box» keine Breadcrumb-Navigation vor. Dabei ist eine solche besonders bei umfangreichen Webprojekten hilfreich und sinnvoll – auch weil Suchmaschinen die Breadcrumbs lieben. Zwar gibt es Plugins, welche nachhelfen; wir haben aber eine Lösung erdacht, die ganz ohne zusätzliche Plugins auskommt.
Viele der gängigen Plugins, welche im WordPress-Directory zum Thema «Breadcrumbs» zu finden sind, haben vor allem mit verschachtelten Hierarchien ein Problem. Darum ziehen wir den Selbstbau vor.
Kopieren Sie folgenden Code in die Datei functions.php Ihrer WordPress-Website. Die Datei finden Sie unter Design/Theme-Editor:
function nav_breadcrumb() {
$delimiter = '»';
$home = 'Home';
$before = '<span class="current-page">';
$after = '</span>';
if ( !is_home() && !is_front_page() || is_paged() ) {
echo '<nav class="breadcrumb">';
global $post;
$homeLink = get_bloginfo('url');
echo '<a href="' . $homeLink . '">' . $home . '</a> ' . $delimiter . ' ';
if ( is_category()) {
global $wp_query;
$cat_obj = $wp_query->get_queried_object();
$thisCat = $cat_obj->term_id;
$thisCat = get_category($thisCat);
$parentCat = get_category($thisCat->parent);
if ($thisCat->parent != 0) echo(get_category_parents($parentCat, TRUE, ' ' . $delimiter . ' '));
echo $before . single_cat_title('', false) . $after;
} elseif ( is_day() ) {
echo '<a href="' . get_year_link(get_the_time('Y')) . '">' . get_the_time('Y') . '</a> ' . $delimiter . ' ';
echo '<a href="' . get_month_link(get_the_time('Y'),get_the_time('m')) . '">' . get_the_time('F') . '</a> ' . $delimiter . ' ';
echo $before . get_the_time('d') . $after;
} elseif ( is_month() ) {
echo '<a href="' . get_year_link(get_the_time('Y')) . '">' . get_the_time('Y') . '</a> ' . $delimiter . ' ';
echo $before . get_the_time('F') . $after;
} elseif ( is_year() ) {
echo $before . get_the_time('Y') . $after;
} elseif ( is_single() && !is_attachment() ) {
if ( get_post_type() != 'post' ) {
$post_type = get_post_type_object(get_post_type());
$slug = $post_type->rewrite;
echo '<a href="' . $homeLink . '/' . $slug['slug'] . '/">' . $post_type->labels->singular_name . '</a> ' . $delimiter . ' ';
echo $before . get_the_title() . $after;
} else {
$cat = get_the_category(); $cat = $cat[0];
echo get_category_parents($cat, TRUE, ' ' . $delimiter . ' ');
echo $before . get_the_title() . $after;
}
} elseif ( !is_single() && !is_page() && get_post_type() != 'post' && !is_404() ) {
$post_type = get_post_type_object(get_post_type());
echo $before . $post_type->labels->singular_name . $after;
} elseif ( is_attachment() ) {
$parent = get_post($post->post_parent);
$cat = get_the_category($parent->ID); $cat = $cat[0];
echo get_category_parents($cat, TRUE, ' ' . $delimiter . ' ');
echo '<a href="' . get_permalink($parent) . '">' . $parent->post_title . '</a> ' . $delimiter . ' ';
echo $before . get_the_title() . $after;
} elseif ( is_page() && !$post->post_parent ) {
echo $before . get_the_title() . $after;
} elseif ( is_page() && $post->post_parent ) {
$parent_id = $post->post_parent;
$breadcrumbs = array();
while ($parent_id) {
$page = get_page($parent_id);
$breadcrumbs[] = '<a href="' . get_permalink($page->ID) . '">' . get_the_title($page->ID) . '</a>';
$parent_id = $page->post_parent;
}
$breadcrumbs = array_reverse($breadcrumbs);
foreach ($breadcrumbs as $crumb) echo $crumb . ' ' . $delimiter . ' ';
echo $before . get_the_title() . $after;
} elseif ( is_search() ) {
echo $before . 'Ergebnisse für Ihre Suche nach "' . get_search_query() . '"' . $after;
} elseif ( is_tag() ) {
echo $before . 'Beiträge mit dem Schlagwort "' . single_tag_title('', false) . '"' . $after;
} elseif ( is_404() ) {
echo $before . 'Fehler 404' . $after;
}
if ( get_query_var('paged') ) {
if ( is_category() || is_day() || is_month() || is_year() || is_search() || is_tag() || is_author() ) echo ' (';
echo ': ' . __('Seite') . ' ' . get_query_var('paged');
if ( is_category() || is_day() || is_month() || is_year() || is_search() || is_tag() || is_author() ) echo ')';
}
echo '</nav>';
}
} Folgende Anpassungen sind denkbar:
- Zeile 3: Da steht der «Delimiter» – also das (oder die) Zeichen, welcheS zwischen den einzelnen Navigationsebenen erscheint. im Code ist dies ein »
- Zeile 10: Da könnten Sie zusätzlich noch einen Text eingeben, der vor den Links erscheinen soll. Z.B. …breadcrumb»>Sie befinden sich hier: ‹; oder sowas.
Nun ist WordPress für die Breadcrumbs bereit. Für deren Anzeige müssen Sie nun noch folgende Zeile im Template Ihres Post-Types einfügen. Idealerweise tun Sie dies natürlich in Ihrem Child-Theme:
<?php if (function_exists('nav_breadcrumb')) nav_breadcrumb(); ?>Jetzt können Sie die auszugebenden Breadcrumbs-Links noch ein wenig stylen. Im ersten Code ist die CSS-Klasse «breadcrumb» hinterlegt. So können Sie nun im CSS-Stylesheet Ihrer Website (unter Design/Customizer) folgenden Code einfügen:
.breadcrumb {
color: #ffffff;
background-color: #293280;
margin-right: 3px;
padding: 5px;
}Das ist natürlich nur ein Beispiel, wie es zu dieser Website passen täte. Sie können die Werte auf den Zeilen 2 bis 5 natürlich selber anpassen.
Werbung
Werbung
