186° 2017926字评论

Bitcron主题的所有分类和所有标签页面

欢迎来到《Bitcron主题制作系列教程》。这篇承接上一篇说一下所有分类页面和所有标签页面的写法。当然,从标题里应该可以猜测出,之所以又放在一起讲,肯定是因为又能机智地拼合在一起了。确实如此,不过比起这点,掌握了所有分类或所有标签的代码,不论是合并jade文档以达到精简模板文件的目的,还是直接写在archive.jade归档页面来整合功能,都变得唾手可得。所以赶紧来看看简单又高能的代码吧!

categories.jade

// 引入index.jade
extends index
// 修改标题为「所有分类 - 网站标题」格式
block title
    title= '所有分类 - ' + site.title

// 开始修改main内容
block content
    h2 所有分类
        // 取得所有分类数
        span= d.get_data(types='folder', return_count=true, level=1, min_posts_count=1, render=true)
    for category in posts.categories
        // 取得各分类名称及对应链接
        a(href=category.url)= category.title
            // 取得各分类下的文章数
            span= category.posts_count

tags.jade

同理,就省略注释了,看着也清楚些。

extends index

block title
    title= '所有标签 - ' + site.title

block content
    h2 所有标签
        span= site.tags.length
    for tag_name, tag_count in site.tags
        a(href='/tag/{{tag_name}}')= tag_name
            span= tag_count

categories+tags.jade

又到了激动人心的合并时刻!依旧是加上判断来对应不同的访问地址:

extends index

block title
    if request.path.startswith('/categories')
        title= '分类'  + ' - ' + site.title
    elif request.path.startswith('/tags')
        title= '标签' + ' - ' + site.title

block content
    if request.path.startswith('/categories')
        #categories
            h2 分类
                span= d.get_data(types='folder', return_count=true, level=1, min_posts_count=1, render=true)
            for category in posts.categories
                a(href=category.url)= category.title
                    span= category.posts_count
    
    elif request.path.startswith('/tags')
        #tags
            h2 标签
                span= site.tags.length
            for tag_name, tag_count in site.tags
                a(href='/tag/{{tag_name}}')= tag_name
                    span= tag_count

关于Bitcron中的各种计数请参考「Bitcron 中的计数代码」

只要一个多功能页面

上面介绍的写法不论是分成两个jade文档还是合并为一个categories+tags.jade,最终都能实现访问/categories时显示所有分类,访问/tags时显示所有标签。如果分类和标签的数量不多,也可以写在同一个页面里,甚至写进归档页面里。如果所有分类和所有标签都在同一个页面的话,建议先判断是否有分类或标签再加载样式,如此一来如果遇上不使用分类或标签的情况,样式也不会崩塌(多么缜密的处女座设计师)。

// 如果有分类
if posts.categories
    #catlist
        h2 所有分类
        for category in posts.categories
            a(href=category.url)= category.title
                sup= category.posts_count
// 如果有标签
if site.tags
    #taglist
        h2 所有标签
        for tag_name, tag_count in site.tags
            a(href='/tag/{{tag_name}}')= tag_name
                sup= tag_count  

好像教程写得越来越偷懒了,不过我相信聪明的你们一定能看懂,如果有什么不懂的可以爬梯留言或者发邮件给我,我再更新于此。当然有错误或者不严谨的地方也欢迎指正!

好了,本章结束。下次我来说说如何把搜索框扩展为搜索页面,同样的,也是非常灵活的编排。再次感谢Bitcron的强大和便捷,API也是个伟大的发明。那么下次见了各位!

相关阅读

下一篇:Bitcron主题的搜索页面
返回目录:Bitcron主题制作系列教程
上一篇:Bitcron主题的各分类和各标签下的文章列表

EOF
193°
Bitcron主题的搜索页面
点击加载Disqus