如何使用hexo与github搭建自己的博客(2)

2019-07-31 10:32:01 浏览数 (1)

接着上一篇的讲,我们把该有的事情都已经准备好了,接下了就是怎么配置我们的博客了

hexo的配置文件是_config.yml,整个hexo项目里面有两个这样的文件,一个是在根目录下面,另一个是在文件夹theme里面,根目录的主要是对整个项目的配置,而theme里面的则主要是对你当前所应用的主题的一个设置。

例如:下面的代码就是我的根目录的配置项,写法如此,一个大的属性,大属性下面的小属性前面需要有空格(最后的效果和JSON一样,只不过这样写起来比JSON更直观)

我们说一下其中的一些属性

代码语言:javascript复制
# Hexo Configuration
## Docs: https://hexo.io/docs/configuration.html
## Source: https://github.com/hexojs/hexo/

# Site
title: 踏浪个人博客
subtitle: 用代码震撼世界
description: 踏浪个人博客 -- 用代码震撼世界
keywords: 踏浪,IT技术,前端,html,css,js,react,vue,框架
author: 踏浪
language:
  - zh-cn
  - en
timezone:

# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: https://github.com/tal007
root: /
permalink: :category/:title.html
permalink_defaults:

# Directory
source_dir: source
public_dir: public
tag_dir: tags
archive_dir: archives
category_dir: categories
code_dir: downloads/code
i18n_dir: :lang
skip_render:

# Writing
new_post_name: :title.md # File name of new posts
default_layout: post
titlecase: false # Transform title into titlecase
external_link: true # Open external links in new tab
filename_case: 0
render_drafts: false
post_asset_folder: false
relative_link: false
future: true
highlight:
  enable: true
  line_number: true
  auto_detect: false
  tab_replace:
  
# Home page setting
# path: Root path for your blogs index page. (default = '')
# per_page: Posts displayed per page. (0 = disable pagination)
# order_by: Posts order. (Order by date descending by default)
index_generator:
  path: ''
  per_page: 10
  order_by: -date
  
# Category & Tag
default_category: 技术
category_map:
  技术: tech-notes
  金融: finance
  其他: others
tag_map:

# Date / Time format
## Hexo uses Moment.js to parse and display date
## You can customize the date format as defined in
## http://momentjs.com/docs/#/displaying/format/
date_format: YYYY-MM-DD
time_format: HH:mm:ss

# Pagination
## Set per_page to 0 to disable pagination
per_page: 10
pagination_dir: page

# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
theme: jsimple

# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
  type: git
  repo: https://github.com/tal007/tal007.github.io
  branch: master

backup:
  type: git
  message: backup my blog https://github.com/tal007
  repository:
    github: https://github.com/tal007/blog.git,master

首先是前面的Site,主要是对整个网站属性的的一些设置,包含网站的标题,【副标题】,描述,关键字等。这一部分很简单

代码语言:javascript复制
# Category & Tag
default_category: 技术
category_map:
  技术: tech-notes
  金融: finance
  其他: others

# Category & Tag就是我们的导航,前面的中文是网页上面显示的,后面的是你的关键字,供程序读取识别

最后就是Deployment

代码语言:javascript复制
# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
  type: git
  repo: https://github.com/tal007/tal007.github.io
  branch: master

backup:
  type: git
  message: backup my blog https://github.com/tal007
  repository:
    github: https://github.com/tal007/blog.git,master

主要包含deploybackup。前一个是我们发布的一个地址,这个地址就是用我们上一节生成的那个带有.github.io的地址。后一个呢是我们备份的一个地址,需要注意的是后面的,master

其他的配置就不多说,在hexo官网上面都是有具体的说明,需要的话可以自己看看。

至于主题下面的配置文件,每个主题可能不同,这个需要对照着自己的主题进行修改。

下面说说怎么创建发布

在我们的根目录面下有一个文件夹scaffolds。这里面可能自带有一些md文件。其实这些都是我们默认的一些模版。

代码语言:javascript复制
---
title: {{ title }}
date: {{ date }}
author: 踏浪
avatar: /images/favicon.png
authorLink: https://github.com/tal007
authorAbout: https://github.com/tal007
authorDesc: 转行IT,用代码震撼世界
categories: 技术
tags:
keywords:
description: 
photos:
---

我们一般使用的都是page.mdpost.md,这两个我设置的都是一样的,上面的title就是我们通过hexo n 你的心新的文档的名字(hexo n 是 hexo new 的简写)命令所输入的title,例如我们本篇文章

代码语言:javascript复制
hexo n 如何使用hexo与github搭建自己的博客(2)

data就是发布时间,这个在配置文件里面可以设置时间格式。其余的属性根据不同的主题需求也是不同的。有一点需要说明,就是categories表示这篇文章所述的分类。

使用hexo new命令生成的是一个md格式的文件,接下来我们就是在这个文件里面写我们需要发布的内容

最后通过命令hexo g进行生成静态的文件,执行后可以看见我们的根目录下面多了一个public文件夹,我们所需要的html文件都在里面了。

你可以使用hexo s进行本地浏览测试,调试,带到没有问题以后则可以进行发布了。

使用hexo d进行发布,发布的地址就是我们在_config.yml中配置的deploy里面的repo的地址。

待github上面的代码同步了,我们就可以通过访问XXX.github.io进行访问自己的博客了。

最后还有一些关于博客的插件

自己的博客的插件可以去hexo插件中去看看,包括评论,时间线等插件,这里就不一一介绍了。

最后说明一下,这里所介绍的知识一些简单的基础,更多的命令以及配置属性都可以上hexo上面看到,希望你有时间还是能够看一看,主要就是看看Docs这一部分

关于怎么使用hexo github搭建自己的博客就先说到这里,如果有需要,以后可能会更新,还请随时关注,谢谢。

0 人点赞