Breadcrumb (面包屑)插件实现网站层级关系,起路径引导功能,有利于博客和网站的 SEO和用户浏览网站内容。本文内容为 suffusion 主题安装 Breadcrumb NavXT 插件, 其它主题的 Breadcrumb 安装方法类似。
breadcrumb(面包屑)简介
使用breadcrumb的网站效果:
图1. 使用breadcrumb的网站的google搜索结果
图2. 使用breadcrumb的Wordpress博客效果图
breadcrumb这个概念在”精通正则表达式”这本书中提过,用来解释传统正则表达式引擎的工作方式.大意是这样: 在你前面有N个分支,然后你选择第一个分支,其它分支则洒上面包屑;进入第一个分支后,可能在你前面又有N个分支,然后你再选择一个分支,如果匹配成功, 返返回匹配成功的信息,如果这个分支的所有选择的匹配都失败了,那么就返回去,进入洒有面包屑的分支继续匹配;一直到所有分支尝试完毕,如果都不匹配,则 匹配失败.
一句话,breadcrumb就是起一个路径引导的作用.
suffusion主题安装Breadcrumb NavXT插件
suffusion自带了breadcrumb功能,但是我在用google搜索时,在搜索结果中并没有层级关系,它并不是使用Schema.org这个标准.
在本文中使用的breadcrumb插件是Breadcrumb NavXT, 还有另外一款插件: Breadcrumbs, 两个插件功能类似, 后一款插件是由WordPress SEO的作者写的, 也非常不错.
首先把suffusion主题自带的breadcrumb功能不启用:
选择外观–>Suffusion Options–>Other Graphical Elements–>Breadcrumbs and Page Navigation,设置如下:
图3.不启用suffusion自带的breadcrumb功能
第一步是从http://wordpress.org/extend/plugins/breadcrumb-navxt/下载插件,解压
第二步将插件上传到website_root/wp-content/plugins目录,然后到wordpress后台启用插件
第三步是在设置界面设置选项,我的设置如下:
General(通用)设置界面: 将Home Title改成Home,其它未改动
图4. Breadcrumb NavXT插件General设置
Current Item(当前条目)选项: 当前条目是指最后一层,在图5中即Breadcrumb NavXT这一层
Link Current Item选项设置是否链接当前条目,一般不选择
图5. Breadcrumb NavXT插件Current Item设置
Posts & Pages(日志和页面)设置:
修改了Template, 将”go to … “ 改成了”View all post in …”
图6. Breadcrumb NavXT插件Posts & Pages设置
Categories & Tags(分类和标签)设置:
与Posts & Pages设置修改的地方类似
图7. Breadcrumb NavXT插件Categories & Tags设置
杂项设置:
图8. Breadcrumb NavXT插件杂项设置
第四步是关键,有两种方法将breadcrumb添加到文章中
1) 按照Breadcrumb NavXT的官方安装文档将代码插入到主题的header.php文件的适当位置,如下:
实现效果如下:
图9. 插入header.php后Breadcrumb NavXT实现效果图
与主题不太符,字体太小了,效果不大好
2) 第二种方法是使用小工具来实现
选择”外观–>小工具”,添加小工具”Breadcrumb NavXT”,添加位置选择” Widget Area Below Header”,其它设置如下图:
图10.Breadcrumb NavXT小工具设置
添加之后,打开”suffusion Options”, 选择”Sidebars–> Widget Area Below Header”,进行以下设置:
图11. suffusion主题添加Breadcrumb NavXT的Widget
这样就完成了,效果图如下:
图12.suffusion主题添加Breadcrumb NavXT小工具效果图
推荐使用第二种方法, 插件升级,主题升级之后都不会影响使用.