面包屑导航在 SEO 与用户体验中都有着很大的优化,面包屑导航能让用户了解当前所处位置,以及当前页面在整个网站中的位置。体现了网站的架构层级,能够帮助用户快速学习和了解网站内容和组织方式,从而形成很好的位置感。提供返回各个层级的快速入口,方便用户操作。 Google 已经将面包屑导航整合到搜索结果里面,因此优化面包屑导航每个层级的名称,多使用关键字,都可以实现 SEO 优化。面包屑路径,对于提高用户体验来说,是很有帮助的。方便用户,面包屑主要用于为用户提供导航一个网站的次要方法,通过为一个大型多级网站的所有页面提供面包屑路径,用户可以更容易的定位到上一次目录,引导用户通行,减少返回到上一级页面的点击或操作,不用使用浏览器的 「返回」 按钮或网站的主要导航来返回到上一级页面。不用常常占用屏幕空间,因为它们通常是水平排列以及简单的样式,面包屑路径不会占用页面太多的空间。降低跳出率,面包屑路径会是一个诱惑首次访问者在进入一个页面后去浏览这个网站的非常好的方法。比如说,一个用户通过谷歌搜索到一个页面,然后看到一个面包屑路径,这将会诱使用户点击上一级页面去浏览感兴趣的相关主题。有利用百度蜘蛛对网站的抓取,蜘蛛直接沿着那个链走就可以了,很方便。面包屑有利于网站内链的建设,用面包屑大大增加了网站的内部连接,提高用户体验。
好了扯了这么多的面包屑导航的好处,现在小编就来教大家在 WordPress 网站中如何来添加面包屑导航。
1 、打开 functions.php 文件并加入以下代码:
function dimox_breadcrumbs() { $delimiter = '»'; $name = '首页'; $currentBefore = '<span>'; $currentAfter = '</span>'; if ( !is_home() && !is_front_page() || is_paged() ) { global $post; $home = get_bloginfo('url'); echo '<a href="'%20.%20$home%20.%20'">' . $name . '</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 $currentBefore . '当前分类 ''; single_cat_title(); echo ''' . $currentAfter; } elseif ( is_day() ) { echo '<a href="'%20.%20get_year_link(get_the_time('Y'))%20.%20'">' . get_the_time('Y') . '</a> ' . $delimiter . ' '; echo '<a href="'%20.%20get_month_link(get_the_time('Y'),get_the_time('m'))%20.%20'">' . get_the_time('F') . '</a> ' . $delimiter . ' '; echo $currentBefore . get_the_time('d') . $currentAfter; } elseif ( is_month() ) { echo '<a href="'%20.%20get_year_link(get_the_time('Y'))%20.%20'">' . get_the_time('Y') . '</a> ' . $delimiter . ' '; echo $currentBefore . get_the_time('F') . $currentAfter; } elseif ( is_year() ) { echo $currentBefore . get_the_time('Y') . $currentAfter; } elseif ( is_single() ) { $cat = get_the_category(); $cat = $cat[0]; echo get_category_parents($cat, TRUE, ' ' . $delimiter . ' '); echo $currentBefore; the_title(); echo $currentAfter; } elseif ( is_page() && !$post->post_parent ) { echo $currentBefore; the_title(); echo $currentAfter; } elseif ( is_page() && $post->post_parent ) { $parent_id = $post->post_parent; $breadcrumbs = array(); while ($parent_id) { $page = get_page($parent_id); $breadcrumbs[] = '<a href="'%20.%20get_permalink($page->ID)%20.%20'">' . get_the_title($page->ID) . '</a>'; $parent_id = $page->post_parent; } $breadcrumbs = array_reverse($breadcrumbs); foreach ($breadcrumbs as $crumb) echo $crumb . ' ' . $delimiter . ' '; echo $currentBefore; the_title(); echo $currentAfter; } elseif ( is_search() ) { echo $currentBefore . 'Search results for '' . get_search_query() . ''' . $currentAfter; } elseif ( is_tag() ) { echo $currentBefore . '当前标签页 ''; single_tag_title(); echo ''' . $currentAfter; } elseif ( is_author() ) { global $author; $userdata = get_userdata($author); echo $currentBefore . '当前文章页 ' . $userdata->display_name . $currentAfter; } elseif ( is_404() ) { echo $currentBefore . 'Error 404' . $currentAfter; } if ( get_query_var('paged') ) { if ( is_category() || is_day() || is_month() || is_year() || is_search() || is_tag() || is_author() ) echo ' ('; echo __('Page') . ' ' . get_query_var('paged'); if ( is_category() || is_day() || is_month() || is_year() || is_search() || is_tag() || is_author() ) echo ')'; } } }
然后在需要显示面包屑导航的地方加入以下代码:
<?php if (function_exists('dimox_breadcrumbs')) dimox_breadcrumbs(); ?>
好了这样就完成了 WordPress 的面包屑导航。