折腾过github pages的同学都清楚使用jekyll搭建个人网站的目录结构,而导航最终的代码是在使用的主题目录中的default.html文件中的。
我的结构如下:
.
├── .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
│ ├── ---hello-world.md
│ ├── ---mysql-.md
│ └── ---to-myself.md
├── Rakefile
├── README.md
├── rss.xml
├── screenshot.png
├── _site
│ ├── .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可能会排在最前面。