折腾过github pages的同学都清楚使用jekyll搭建个人网站的目录结构,而导航最终的代码是在使用的主题目录中的default.html文件中的。
我的结构如下:
. ├── 404.html ├── about.html ├── archive.html ├── assets │ └── themes ├── atom.xml ├── categories.html ├── changelog.md ├── _config.yml ├── _drafts │ └── jekyll-introduction-draft.md ├── History.markdown ├── _includes │ ├── JB │ └── themes ├── index.md ├── _layouts │ ├── default.html │ ├── page.html │ └── post.html ├── pages.html ├── _plugins │ └── debug.rb ├── _posts │ ├── 2015-01-29-hello-world.md │ ├── 2015-02-01-mysql-00.md │ └── 2015-02-01-to-myself.md ├── Rakefile ├── README.md ├── rss.xml ├── screenshot.png ├── _site │ ├── 404.html │ ├── about.html │ ├── archive.html │ ├── assets │ ├── atom.xml │ ├── categories.html │ ├── History.markdown │ ├── index.html │ ├── mysql │ ├── pages.html │ ├── rss.xml │ ├── screenshot.png │ ├── sitemap.txt │ ├── tags.html │ └── untitled ├── sitemap.txt ├── tags.html └── _theme_packages └── hooligan
也就是图中画红线的目录中,里面是使用的主题目录
在使用的主题中有四个文件:default.html、page.html、post.html、setting.yml,跟导航相关的代码就在default.html中
<ul class="nav"> {% assign pages_list = site.pages %} {% assign group = 'navigation' %} {% include JB/pages_list %} {% assign pages_list = site.pages %} {% assign group = 'aboutme' %} {% include JB/pages_list %} </ul>
ul标签中前三行是默认的,后面三行是我为了添加一个自己介绍的页面而添加的。
自我介绍的页面头部是这样的:
--- layout: page title: About me header: About me group: aboutme --- {% include JB/setup %} <h1> hh </h1>
需要注意的是group这个地方,它的值是单独的aboutme,这也是为什么我在default.html页面中添加了三行的缘故,因为默认的三行只导入group为navigation的页面。
同样,如果所有页面都为navigation,则我们是无法控制他们的顺序的。也就是说aboutme可能会排在最前面。