关注网络资源
用心与您分享

面包屑导航的作用是什么,怎样设置面包屑导航?

大家在浏览网页的时候,经常能在对方正文上方看到一条当前位置的菜单,如下图 招财喵 的面包屑导航,为什么叫面包屑导航?来自于童话故事,”汉赛尔和格莱特”,当汉赛尔和格莱特穿过森林时,不小心迷路了,于是就沿途一直撒面包屑,最终找到了回家的路。了解这个故事后,就应该知道面包屑导航的作用是什么了。

 

网站中的面包屑导航的作用可以告诉访问用户,他们目前在网站的什么位置,根据需要直接点击面包屑导航的超链接就可以返回到指定位置。让用户可以非常方便的了解网站的层级结构,增加用户体验友好度和用户粘度。同时对于搜索引擎也是有好的,蜘蛛可以顺着面包屑导航一直抓取下去,增加个页面分栏之间的关联,增加蜘蛛停留时间,可以有效提高文章收录利用网站目录关键词排名。

面包屑导航的作用是什么

 

面包屑导航的添加方式

1、用插件添加

各类博客主题都有相应的面包屑导航插件,比如WP,zblog等,不想修改代码的可以在插件中心选择一款下载用户多,评价高的插件安装,用插件的好处是方便装卸,不用修改源代码,方便维护,缺点是可能会拖慢网站速度,这个看插件代码效率高不高,同时也会造成数据库内容的增加。

2、修改源代码添加

如果想自定义面包屑样式,又喜欢修改代码的可以用这种方式,相比用插件,这个执行效率更高,代码更精简,同时对网站速度不会有太大的影响,缺点是如果不做好记录,后期可能不知道怎么改回来,主题升级的时候也可能需要重新设置。

拿招财喵的WP-DUX主题网站来说,通过修改以下页面3步即可实现面包屑导航:

a.修改functions.php

在自己的主题文件中找到functions.php,并在文件中添加下面代码。DUX主题修改functions-theme.php文件。

//面包屑导航生成函数
function qgg_breadcrumbs(){
 if( !is_single() ) return false;
 
 $categorys = get_the_category();
 $category = $categorys[0]; 
 return '当前位置:<a href="'.get_bloginfo('url').'">'.get_bloginfo('name').'</a> <small>></small> '.get_category_parents($category->term_id, true, ' <small>></small> ').get_the_title();
}

b.修改single.php

这里是把面包屑导航显示到文章页面,所以我们第二步是修改主题single.php文件,把下面代码加到自己想显示的位置即可。

<!-- 面包屑导航前端显示代码 -->
<div class="breadcrumbs">
 <div class="container"><?php echo qgg_breadcrumbs() ?></div>
</div>

如果是想显示到文章内容页面的导航栏下,请把上面代码添加到“<?php get_header(); ?>”下即可。

c.添加样式代码

将下面这段代码添加到style.css文件,DUX主题是添加到main.css文件。

.breadcrumbs{padding: 15px 0;font-size: 12px;line-height: 1;text-align: left;background-color: #fff;margin-bottom: 15px;margin-top: -15px;border-bottom: 1px solid #EBEBEB; box-shadow: 0 1px 3px rgba(0,0,0,.04);color: #999;}
.breadcrumbs small{font-size: 12px;font-family: serif;color: #bbb;margin: 0 2px;font-weight: bold;}
.breadcrumbs a{color: #999;}
.breadcrumbs a:hover{color: #666;}
@media (max-width:640px){
 .breadcrumbs{margin-top: 1px;margin-bottom: 0;padding: 10px 15px;border-bottom: none;margin-bottom: 1px;}
}

 

面包屑导航对SEO的作用

面包屑导航对用户的作用上面已经说过了,这里说下对搜索引擎,对网站seo的作用

1、方便搜索引擎了解网站层级结构,有利于栏目关键词优化排名,方便爬虫抓取网站的广度和深度。

2、对URL更清晰,层次分明,能够构建合理的网站架构,对网站排名非常有帮助。

3、通过该导航可以建立起完善的复杂的网站内部链接结构,自动构建网站的内部链接,提高关键词排名,方便搜索引擎通过一个页面,访问其他任何一个页面。

 

总结

面包屑导航是网站SEO必不可少的部分,对收录和用户喜爱度都是有好处的,可以让网站结构和文章内容得到充分的展现,有利于收录,但是网站最重要的还是要生产优质的文章内容,否则有可能通过面包屑导航收录的文章过一段时间又不会收录,所以还是要摆正心态,以内容为主,SEO为辅。

 

未经允许不得转载:招财喵 » 面包屑导航的作用是什么,怎样设置面包屑导航?

About 招财喵

招财喵声明【声明】:招财喵站内所分享的APP均来自腾讯应用宝、360手机助手、百度手机助手、安智软件等正规APP下载站,但是网络有风险,各手赚APP的规则也会有变化,使用前请自行甄别!请按手赚APP的要求正常操作获取收益,对因违规操作导致处罚的请自行承担!

评论 抢沙发