01基本信息
1.1 Jekyll
本站主要使用Jekyll框架+Github Pages部署。Jekyll 是一个简单的静态网页框架,它有一个模版目录,其中包含原始文本格式的文档,通过 Markdown 或者 Textile 转化成一个完整的可发布的静态网站,可以发布在任何服务器上。结合GitHub Pages,可以免去个人没有服务器的困扰,搭建一个免费、高效的个人网站。
使用 Jekyll 搭建博客之前要确认下本机软件安装,Git(用于从本地部署到远端)、Ruby(Jekyll 是基于 Ruby 开发的)、包管理器 RubyGems
1.2 主题
leopard 是一个简洁的博客模板,响应式主题, 适配了电脑、手机各种屏幕。
选择该主题的原因包括:
- 主界面是一张大图,比较好看,想换的时候就换张图片,很方便
- 把鼠标放到我的头像上,会发现它可以翻盖
- 支持打赏功能(万一有大冤种打钱呢
- 自带的页面数够多
- 支持文章分类,查找方便
该主题的特色有:
- 自适应屏幕
- 响应式设计
- 个性化头像
- 支持站点总数访问统计,每篇文章访问统计
- 支持打赏功能
- 支持文章自动生成目录
- 支持标签分类
- 支持代码高亮
- 支持数学公式显示
- 支持标题样式多样化
- 支持第三方社交网页显示
1.3 博客主要模块介绍
_config.yml
_config.yml
是整个博客的基础信息配置文件,修改这个文件可以直接把别人的博客变成自己的。
重要字段说明
- comment/livere: livere评论系统,支持微信、qq、微博、豆瓣、twitter等登录后可以直接评论
- comment/disqus: disqus评论系统,支持facebook、twitter等登录后可以直接评论
- social/weibo、github、zhihu、jianshu等: 个人站底部展示的微博等三方社交按钮,点击后直接跳转到个人微博或其他社交主页
- enableToc: 是否开启文章自动生成目录,设置为false文章不会自动生成目录
- baidu/id: 百度统计,用来统计你个人站点的用户访问情况
- ga/id: google统计,用来统计你个人站点的用户访问情况
_config.yml 文件除以上字段还有一些可以自行修改,例如title之类的字段。
_posts
_posts
目录是用来存放文章的目录,写新文章,直接放在这个目录即可。
自定义页面
about.md、support.md 等为自定义页面,如果想添加自动页面可以直接复制about.md 文件修改即可,比如本次课程要求四个页面,我的页面就包括:博客主页、所有文章、标签、 技术支持、关于我。
如果需要在导航显示新增的页面,直接在_config.yml
文件的nav字段中添加新页面配置。
02 搭建过程
Jekyll 环境配置
安装 jekyll:下载windows需要的安装包,解压并运行即可。顺便也下了Ruby和rvm。
创建博客
$ jekyll new test
$ cd test
启动本地服务
$ jekyll serve
在浏览器里输入: http://localhost:4000,就可以看到博客效果了。
目录结构
Jekyll 的核心是一个文本转换引擎。它的底层逻辑是: 把标记语言写好的文章,Markdown,Textile or HTML 套入一个或一系列的布局中。
目录结构:
.
├── _config.yml
├── _includes
| ├── footer.html
| └── header.html
├── _layouts
| ├── default.html
| ├── post.html
| └── page.html
├── _posts
| └── 2016-10-08-welcome-to-jekyll.markdown
├── _sass
| ├── _base.scss
| ├── _layout.scss
| └── _syntax-highlighting.scss
├── about.md
├── css
| └── main.scss
├── feed.xml
└── index.html
目录结构可以参考 官网文档
使用模板
首先安装bundler再启动服务,就可以在本地看到文件了。
$ gem install bundler
Fetching gem metadata from https://rubygems.org/...........
Fetching version metadata from https://rubygems.org/..
Fetching dependency metadata from https://rubygems.org/.
......
Installing jekyll-watch 1.3.1
Installing jekyll 3.1.1
Bundle complete! 3 Gemfile dependencies, 17 gems now installed.
Use `bundle show [gemname]` to see where a bundled gem is installed.
$ jekyll server
接着把本地仓库push到这个github 仓库(注意仓库名是有要求的)下,就可以输入网址访问博客了。
03 一点个人体会
首先写博客贵在坚持,不然就会像我一样搞得乱七八糟。
最开始这个博客是在大四搭的,当时我用它记录了一些毕业论文相关的知识体系。
后来看着不爽全删了(希望我不要再删任何东西了),打算用它写点影评,结果爱死机太好看了卧槽,停不下来,写影评这事只坚持了一集。
再之后上学期的算法课和数学课,感觉知识体系有点大,我想为复习写个博客,结果这样复习进度太慢,遂放弃。
希望以后可以静下心来写点东西。