WordPress如何添加面包屑导航？实现网站内容的层次导航体验

在WordPress中，添加面包屑导航可以让用户更清晰地了解网站内容的层次结构，本文将指导您如何轻松为WordPress网站添加面包屑导航。，确保已安装并激活了适合您网站的插件，如Breadcrumbs或Super Breadcrumbs，打开WordPress后台，转到“外观”>“屏幕选项”，勾选“显示所有盒子”，然后找到Breadcrumbs插件，点击设置按钮开始自定义，在设置页面中，您可以选择使用预设样式、颜色和标签，完成设置后，插件将自动生成面包屑导航并显示在网站每个页面的底部，这样，用户可以更方便地浏览和定位到相关内容。

在现代的网站上,面包屑导航是一种常见的元素，它为访问者提供了快速返回上一级的路径，增强了用户体验，对于WordPress用户来说，可以通过简单的插件或自定义代码来实现这一功能，本文将介绍如何在WordPress中添加面包屑导航。

使用现成的WordPress插件

许多WordPress主题和插件已经内置了面包屑导航功能,以下是一些推荐的插件：

Breadcrumbs by Redactor：这是一个功能强大的面包屑导航插件，支持多语言和自定义标签，你只需安装并激活插件，然后根据插件的说明进行配置即可。
BuddyPress breadcrumbs：如果你使用的是WordPress的BuddyPress社交平台，这个插件会自动为你的帖子添加面包屑导航。
CSS-Tricks Breadcrumbs：这是一个简单易用的插件，通过自定义CSS来实现面包屑导航效果。

手动添加面包屑导航

如果上述插件不适合你的需求,或者你想了解更多自定义技巧，可以手动添加面包屑导航，以下是具体步骤：

创建面包屑菜单项
- 登录到你的WordPress后台。
- 进入“外观”>“菜单”。
- 在左侧选择你想要为其添加面包屑导航的菜单项（例如页面或自定义文章类型）。
- 在右侧的“菜单设置”中，勾选“显示面包屑”，然后保存更改。
使用HTML和PHP代码
- 创建一个新的WordPress页面,面包屑”，并将其保存为屑路.html或其他文件名。
- 打开该页面,在代码编辑器中添加以下代码：

<?php
/*
 Template Name: Breadcrumbs
*/
get_header(); ?>
<div id="main-content">
  <?php
    if (have_posts()) :
      while (have_posts()) : the_post();
        get_template_part('template-parts/content', get_post_format());
      endwhile;
      the_posts_navigation(array(
        'prev_text' => __('&laquo; 阅读更多'),
        'next_text' => __('&raquo; 返回文章列表'),
      ));
    endif;
  ?>
</div>
<?php get_footer(); ?>

自定义样式
- 创建一个新的CSS文件,例如styles.css。
- 在文件中添加自定义样式来美化面包屑导航,

.breadcrumb {
  display: none;
}
@media screen and (min-width: 768px) {
  .breadcrumb {
    display: block;
    text-align: center;
    margin-top: 20px;
  }
}

将CSS文件链接到WordPress
- 打开你的WordPress主题的functions.php文件。
- 在文件末尾添加以下代码：

function add_breadcrumbs() {
  if (function_exists('get_template_part')) {
    get_template_part('functions/css', get_stylesheet());
  }
}
add_action('wp_head', 'add_breadcrumbs');