Octopress 搭建静态博客站点 --- 为站点侧边栏添加分类列表(Categories)


一共三步,很简单。跟着走就可以。


Step 1 . 增加 category_list 插件

octopress\plugins\ 文件夹里面,新建一个文件,取名为:category_list_tag.rb。并将下面的代码粘贴到里面。

module Jekyll
  class CategoryListTag < Liquid::Tag
    def render(context)
      html = ""
      categories = context.registers[:site].categories.keys
      categories.sort.each do |category|
        posts_in_category = context.registers[:site].categories[category].size
        category_dir = context.registers[:site].config['category_dir']
        category_url = File.join(category_dir, category.gsub(/_|\P{Word}/, '-').gsub(/-{2,}/, '-').downcase)
        html << "<li class='category'><a href='/#{category_url}/'>#{category} (#{posts_in_category})</a></li>\n"
      end
      html
    end
  end
end

Liquid::Template.register_tag('category_list', Jekyll::CategoryListTag)

这个插件会向liquid注册一个名为category_listtag,该tag就是以li的形式将站点所有的category组织起来。如果要将category加入到侧边导航栏,需要增加一个aside


Step 2 . 增加 aside

octopress\source\_includes\asides\ 文件夹里面,新建一个文件,取名为:category_list.html 。并粘贴下面的代码:

注意: 去掉 % 前面的 \

<section>
    <h1>Categories</h1>
    <ul id="categories">
        {\% category_list \%}
    </ul>
</section>

Step 3 . _config.yml 文件里面 ,修改 default_asides

打开 octopress\_config.yml 文件,修改里面的 default_asides 项,将 asides/category_list.html 添加进去。

default_asides: [asides/category_list.html, ......]

搞定

现在,我们执行 rake generate 命令来生成最新的博客站点。然后执行 rake preview 命令在本地预览博客站点。 看看修改后的效果。

Alt text



参考网站:

为octopress添加分类(category)列表
http://codemacro.com/2012/07/18/add-category-list-to-octopress/


请访问:http://www.aobosir.com/

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值