首页    >    新闻资讯    >   WordPress如何添加面包屑导航

WordPress如何添加面包屑导航

面包屑导航是一系列连接的导航链接,这些链接显示了您浏览网站页面的路径,面包屑通常显示在页面顶部,以方便访问。主要目的是使用户能够轻松地回溯,从而改善站点的UX,除此以外,面包屑导航对于整体网站体验和SEO都有好处。那么WordPress如何添加面包屑导航?

WordPress添加面包屑导航

我们可以通过自定义代码实现面包屑,将以下代码添加到现用主题的functions.php文件中:

  1. // WordPress Breadcrumb Function
  2. // Add this code into your theme function file.
  3. function ah_breadcrumb() {
  4. // Check if is front/home page, return
  5. if ( is_front_page() ) {
  6. return;
  7. }
  8. // Define
  9. global $post;
  10. $custom_taxonomy = ''; // If you have custom taxonomy place it here
  11. $defaults = array(
  12. 'seperator' => '»',
  13. 'id' => 'ah-breadcrumb',
  14. 'classes' => 'ah-breadcrumb',
  15. 'home_title' => esc_html__( 'Home', '' )
  16. );
  17. $sep = '<li class="seperator">'. esc_html( $defaults['seperator'] ) .'</li>';
  18. // Start the breadcrumb with a link to your homepage
  19. echo '<ul id="'. esc_attr( $defaults['id'] ) .'" class="'. esc_attr( $defaults['classes'] ) .'">';
  20. // Creating home link
  21. echo '<li class="item"><a href="'. get_home_url() .'">'. esc_html( $defaults['home_title'] ) .'</a></li>' . $sep;
  22. if ( is_single() ) {
  23. // Get posts type
  24. $post_type = get_post_type();
  25. // If post type is not post
  26. if( $post_type != 'post' ) {
  27. $post_type_object = get_post_type_object( $post_type );
  28. $post_type_link = get_post_type_archive_link( $post_type );
  29. echo '<li class="item item-cat"><a href="'. $post_type_link .'">'. $post_type_object->labels->name .'</a></li>'. $sep;
  30. }
  31. // Get categories
  32. $category = get_the_category( $post->ID );
  33. // If category not empty
  34. if( !empty( $category ) ) {
  35. // Arrange category parent to child
  36. $category_values = array_values( $category );
  37. $get_last_category = end( $category_values );
  38. // $get_last_category = $category[count($category) - 1];
  39. $get_parent_category = rtrim( get_category_parents( $get_last_category->term_id, true, ',' ), ',' );
  40. $cat_parent = explode( ',', $get_parent_category );
  41. // Store category in $display_category
  42. $display_category = '';
  43. foreach( $cat_parent as $p ) {
  44. $display_category .= '<li class="item item-cat">'. $p .'</li>' . $sep;
  45. }
  46. }
  47. // If it's a custom post type within a custom taxonomy
  48. $taxonomy_exists = taxonomy_exists( $custom_taxonomy );
  49. if( empty( $get_last_category ) && !empty( $custom_taxonomy ) && $taxonomy_exists ) {
  50. $taxonomy_terms = get_the_terms( $post->ID, $custom_taxonomy );
  51. $cat_id = $taxonomy_terms[0]->term_id;
  52. $cat_link = get_term_link($taxonomy_terms[0]->term_id, $custom_taxonomy);
  53. $cat_name = $taxonomy_terms[0]->name;
  54. }
  55. // Check if the post is in a category
  56. if( !empty( $get_last_category ) ) {
  57. echo $display_category;
  58. echo '<li class="item item-current">'. get_the_title() .'</li>';
  59. } else if( !empty( $cat_id ) ) {
  60. echo '<li class="item item-cat"><a href="'. $cat_link .'">'. $cat_name .'</a></li>' . $sep;
  61. echo '<li class="item-current item">'. get_the_title() .'</li>';
  62. } else {
  63. echo '<li class="item-current item">'. get_the_title() .'</li>';
  64. }
  65. } else if( is_archive() ) {
  66. if( is_tax() ) {
  67. // Get posts type
  68. $post_type = get_post_type();
  69. // If post type is not post
  70. if( $post_type != 'post' ) {
  71. $post_type_object = get_post_type_object( $post_type );
  72. $post_type_link = get_post_type_archive_link( $post_type );
  73. echo '<li class="item item-cat item-custom-post-type-' . $post_type . '"><a href="' . $post_type_link . '">' . $post_type_object->labels->name . '</a></li>' . $sep;
  74. }
  75. $custom_tax_name = get_queried_object()->name;
  76. echo '<li class="item item-current">'. $custom_tax_name .'</li>';
  77. } else if ( is_category() ) {
  78. $parent = get_queried_object()->category_parent;
  79. if ( $parent !== 0 ) {
  80. $parent_category = get_category( $parent );
  81. $category_link = get_category_link( $parent );
  82. echo '<li class="item"><a href="'. esc_url( $category_link ) .'">'. $parent_category->name .'</a></li>' . $sep;
  83. }
  84. echo '<li class="item item-current">'. single_cat_title( '', false ) .'</li>';
  85. } else if ( is_tag() ) {
  86. // Get tag information
  87. $term_id = get_query_var('tag_id');
  88. $taxonomy = 'post_tag';
  89. $args = 'include=' . $term_id;
  90. $terms = get_terms( $taxonomy, $args );
  91. $get_term_name = $terms[0]->name;
  92. // Display the tag name
  93. echo '<li class="item-current item">'. $get_term_name .'</li>';
  94. } else if( is_day() ) {
  95. // Day archive
  96. // Year link
  97. echo '<li class="item-year item"><a href="'. get_year_link( get_the_time('Y') ) .'">'. get_the_time('Y') . ' Archives</a></li>' . $sep;
  98. // Month link
  99. echo '<li class="item-month item"><a href="'. get_month_link( get_the_time('Y'), get_the_time('m') ) .'">'. get_the_time('M') .' Archives</a></li>' . $sep;
  100. // Day display
  101. echo '<li class="item-current item">'. get_the_time('jS') .' '. get_the_time('M'). ' Archives</li>';
  102. } else if( is_month() ) {
  103. // Month archive
  104. // Year link
  105. echo '<li class="item-year item"><a href="'. get_year_link( get_the_time('Y') ) .'">'. get_the_time('Y') . ' Archives</a></li>' . $sep;
  106. // Month Display
  107. echo '<li class="item-month item-current item">'. get_the_time('M') .' Archives</li>';
  108. } else if ( is_year() ) {
  109. // Year Display
  110. echo '<li class="item-year item-current item">'. get_the_time('Y') .' Archives</li>';
  111. } else if ( is_author() ) {
  112. // Auhor archive
  113. // Get the author information
  114. global $author;
  115. $userdata = get_userdata( $author );
  116. // Display author name
  117. echo '<li class="item-current item">'. 'Author: '. $userdata->display_name . '</li>';
  118. } else {
  119. echo '<li class="item item-current">'. post_type_archive_title() .'</li>';
  120. }
  121. } else if ( is_page() ) {
  122. // Standard page
  123. if( $post->post_parent ) {
  124. // If child page, get parents
  125. $anc = get_post_ancestors( $post->ID );
  126. // Get parents in the right order
  127. $anc = array_reverse( $anc );
  128. // Parent page loop
  129. if ( !isset( $parents ) ) $parents = null;
  130. foreach ( $anc as $ancestor ) {
  131. $parents .= '<li class="item-parent item"><a href="'. get_permalink( $ancestor ) .'">'. get_the_title( $ancestor ) .'</a></li>' . $sep;
  132. }
  133. // Display parent pages
  134. echo $parents;
  135. // Current page
  136. echo '<li class="item-current item">'. get_the_title() .'</li>';
  137. } else {
  138. // Just display current page if not parents
  139. echo '<li class="item-current item">'. get_the_title() .'</li>';
  140. }
  141. } else if ( is_search() ) {
  142. // Search results page
  143. echo '<li class="item-current item">Search results for: '. get_search_query() .'</li>';
  144. } else if ( is_404() ) {
  145. // 404 page
  146. echo '<li class="item-current item">' . 'Error 404' . '</li>';
  147. }
  148. // End breadcrumb
  149. echo '</ul>';
  150. }

然后还需要将以下行添加到主题的header.php文件中:

  1. <?php
  2. // Call the breadcrumb function where you want to display
  3. if ( function_exists('ah_breadcrumb') ) ah_breadcrumb();
  4. ?>

第一个片段将面包屑添加到您的主题。第二个“调用”相关功能,以便导航链接出现在页眉中。请注意,您可能需要删除开头的<?php,此代码才能与主题的现有文件一起使用。

分类:新闻资讯

标签:

* 版权声明:作者WordPress啦! 转载请注明出处。