WordPress实现面包屑导航【无插件】

WordPress面包屑导航是一种显示当前页面在站点结构中位置的导航元素。通常,面包屑导航以层次结构的形式显示当前页面的路径,使用户能够轻松导航到上一级页面或站点的其他部分。从网站面包屑导航的作用来看,它对于我们做网站SEO优化有着相当的作用。那么如何做网站时能够制作出网站面包屑导航呢?以下是一个简单的WordPress面包屑代码示例:

将以下的代码复制到模板函数functions.php里:

function custom_breadcrumbs() {
    // 获取当前页面的信息
    $post_id = get_queried_object_id();
    $post_type = get_post_type($post_id);
    $post_title = get_the_title($post_id);

    // 设置面包屑导航的*页链接
    $home_link = home_url('/');
    $home_label = 'Home';

    // 输出面包屑导航的开始部分
    echo '<div class="breadcrumbs">';
    echo '<a href="' . esc_url($home_link) . '">' . esc_html($home_label) . '</a>';

    // 如果是文章类型,则添加文章分类
    if ($post_type === 'post') {
        $categories = get_the_category();
        if (!empty($categories)) {
            $category = $categories[0];
            echo '<span class="separator"> &raquo; </span>';
            echo '<a href="' . esc_url(get_category_link($category->term_id)) . '">' . esc_html($category->name) . '</a>';
        }
    }

    // 如果是单页面,添加其父页面
    if (is_page() && $post_id !== get_option('page_on_front')) {
        $ancestors = get_ancestors($post_id, 'page');
        foreach (array_reverse($ancestors) as $ancestor_id) {
            echo '<span class="separator"> &raquo; </span>';
            echo '<a href="' . esc_url(get_permalink($ancestor_id)) . '">' . esc_html(get_the_title($ancestor_id)) . '</a>';
        }
    }

    // 输出当前页面的标题
    echo '<span class="separator"> &raquo; </span>';
    echo '<span class="current">' . esc_html($post_title) . '</span>';

    // 输出面包屑导航的结束部分
    echo '</div>';
}

将上述代码添加到你的主题的functions.php文件中或创建一个单独的功能文件,并确保在主题中引入该文件。接下来,在你的主题模板文件中调用custom_breadcrumbs函数,通常放置在适当的位置,比如在header.php文件中的页面标题下方。

<?php custom_breadcrumbs(); ?>
自定义WordPress主题面包屑导航

这个简单的面包屑导航代码会根据当前页面的类型(文章、页面等)和层次结构来动态生成导航。你可以根据自己的需求对代码进行修改和扩展。

滚动至顶部
扫描微信二维码联系我们 关闭