• wordpress CMS主题:ssmay主题 wordpress CMS主题:ssmay主题
  • 首页 > wordpress CMS主题制作 > WP开发15:在wordpress网站模板开发中,怎样添加面包屑导航?

    WP开发15:在wordpress网站模板开发中,怎样添加面包屑导航?

    作者: 分类:wordpress CMS主题制作 点击: 58 次
    wordpress CMS主题:ssmay主题

      扫描下面的二维码,“关注”我的头条号,我会每天更新免费视频课程。

      几乎在所有的wordpress网站中,我们都可以看到面包屑导航的身影。面包屑导航,可以很方便地让我们了解到我们在这个wordpress网站中所在的位置,而且,我们还可以通过点击面包屑导航中的链接,进入到对应的页面。可见面包屑导航不仅让wordpress网站更加便利,而且提升了wordpress网站的用户体验。

      WP开发15:在wordpress网站模板开发中,怎样添加面包屑导航?

      那么,我们怎样在wordpress网站模板中添加面包屑导航呢?请随我来,我们可以通过2种方式来实现。具体操作,可以观看《wordpress网站模板开发中,怎样添加面包屑导航功能?》视频教程。

      WP开发15:在wordpress网站模板开发中,怎样添加面包屑导航?

      方法一:每个wordpress模板页添加对应的面包屑导航代码。

      也就是说,我们可以在wordpress模板中,想要显示面包屑导航的地方,添加面包屑导航代码就可以了。一般情况下,需要面包屑导航的地方有:wordpress网站的分类页模板、文章页模板、单页面模板、tag标签页模板、搜索页模板、作者页模板等等。

      wordpress网站分类页模板面包屑导航代码:

      <?php
      echo '< a href="'.get_option("home_url").'">首页</a> > ';
      the_category(' > ');
      ?>

      wordpress网站文章页模板面包屑导航代码:

      <?php
      echo '< a href="'.get_option("home_url").'">首页</a> > ';
      the_category(' > ');
      echo " > ";
      the_title();
      ?>

      wordpress网站单页面模板面包屑导航代码:

      <?php
      echo '< a href="'.get_option("home_url").'">首页</a> > ';
      the_title();
      ?>

      这种方式的缺点:需要在wordpress网站的每个需要面包屑导航的模板中添加面包屑导航代码,后期维护比较麻烦。

      方法二:在wordpress模板中创建面包屑导航的函数。

      为了更加方便地在wordpress网站模板中调用面包屑导航,我们可以给面包屑导航创建一个函数,然后,在需要用到面包屑导航的页面直接调用这个函数就可以了。因为面包屑导航会在wordpress网站的很多页面中使用,所以,我们在函数中要做不同页面的判断,根据不同的页面调用不同的面包屑导航。

      在wordpress网站模板的functions.php文件中添加如下代码:

      // 面包屑导航
      function the_breadcrumb() {
      echo '<ul id="crumbs">';
      if (!is_home()) { //如果不是首页
      echo '<li><a href="'.get_option("home_url").'">首页</a> > </li>';
      if (is_category() || is_single()) { //如果是分类或文章页
      echo '<li>';
      the_category(' </li><li> ');
      if (is_single()) { //如果是文章页
      echo " > </li><li>".get_the_title().'</li>';
      }
      } elseif (is_page()) { //如果是单页面
      echo '<li>'.get_the_title().'</li>';
      }elseif(is_tag()){ //如果是tag标签页
      single_cat_title();
      }elseif (is_author()) { //如果是作者页
      echo"<li>作者页面"; echo'</li>';
      }elseif (isset($_GET['paged']) && !empty($_GET['paged'])) { //如果是分页
      echo "<li>列表分页"; echo'</li>';
      }elseif (is_search()) { //如果是搜索页
      echo"<li>搜索页"; echo'</li>';
      }elseif (is_day()) {
      echo"<li>日期归档(天) "; the_time('F jS, Y'); echo'</li>';
      }elseif (is_month()) {
      echo"<li>日期归档(月)r "; the_time('F, Y'); echo'</li>';
      }elseif (is_year()) {
      echo"<li>日期归档(年) "; the_time('Y'); echo'</li>';
      }
      }
      echo '</ul>';
      }

      面包屑函数创建好了,就可以在wordpress网站模板中调用它,代码如下:

      < div class="breadcrumb">
      <?php the_breadcrumb(); ?>
      </div>

      通过上面的2种方式,我们都可以为我们的wordpress网站模板添加面包屑导航的功能。当然,我们还可以通过wordpress的面包屑导航插件来实现,不过,这么简单的功能,没必要耗费系统资源来使用插件,纯代码更加有效。

      如果还有什么疑问,欢迎在下面给我留言,我会尽快给你回复。谢谢参阅。



      欢迎“关注”我的头条号,我会每天更新免费视频课程。

      头条二维码
      关注我的头条号
      头条二维码
      加入我的QQ群

    文章作者:码不停蹄
    本文地址:http://wanlimm.com/77202007209274.html
    版权所有 © 转载时必须以链接形式注明作者和原始出处!

    上一篇:
    下一篇:
    wordpress CMS主题:ssmay主题

    或许你会感兴趣的文章:

    发表评论

    电子邮件地址不会被公开。 必填项已用*标注

    This site uses Akismet to reduce spam. Learn how your comment data is processed.