快速搭建博客教程,github&hexo

经过好一会的折腾,终于搞定了属于自己的第一个博客的搭建。其中遇到了一些问题,踩了一些坑,特别感谢@崔斯特 的帮助。先贴上成果无小意的博客

一、前奏

  1. 搭建自己博客的原因
    • 看过的网站千千万,为何不能拥有一个自己的网站?
    • 曾经经历过莫名其妙的文章删除,害怕以后丢失文章信息
    • 自由自在的发表,随心的改造
  2. 整个过程的时间
    • 最开始是参考@崔斯特 的文章参考文章,看完后有了自己完成一个博客的冲动。
    • 用了大概两个下午的时间,第一天完成了第一个主题,第二天完成第二个主题。
  3. 环境配置
    • windows 8 64位系统,sublime编辑器,git bush
    • 缺啥再补啥
  4. 博客搭建
    • 采用hexo框架进行网站代码的构建,再部署在免费的github上。
    • hexo此次安装重要文档

二、GitHub配置

  1. 登录GitHub(没有的就注册地一个)
  2. 保留自己Username,保留网页或者粘贴下来。
  3. 主页中点击右上角自己的图标,点击your profile
  4. 点击repositories,新建一个
  5. Repository name (填自己的名字) yourname.github.io(yourname与你的注册用户名一致,这个就是你博客的域名了)

三、环境配置

  1. 安装Node.js
  2. 安装Git
  3. 安装完成后,在开始菜单里找到“Git”->“Git Bash”,进入
  4. $ git config –global user.name “username”
  5. $ git config –global user.email “xxx”
  6. cmd中输入npm install -g hexo-cli(管理员权限)
  7. (npm在你安装Node.js时就安装了)这个过程会比较久,如果出现WARN错误可以忽略。我记得当时,每次都会出现说有一个依赖包已经不更新,这个不影响。

四、网站代码以及设置

  1. 自己在C盘创建一个test文件夹,cmd内cd进入test文件夹(管理员权限!一定得有)
  2. 输入hexo init blog(此处如果出现了两三个WARN错误忽视就行,不影响)
    • _config.yml,网站的 配置 信息,您可以在此配置大部分的参数。
    • source,资源文件夹是存放用户资源的地方。除 posts 文件夹之外,开头命名为 (下划线)的文件 / 文件夹和隐藏的文件将会被忽略。Markdown 和 HTML 文件会被解析并放到 public 文件夹,而其他文件会被拷贝过去。
    • themes,主题 文件夹。Hexo 会根据主题来生成静态页面。
  3. 等待提示Start blogging with Hexo,就是安装成功了
  4. 文件夹中自带一篇文章“Hello World”
  5. 命令行进入blog目录下
  6. 输入hexo g,生存静态文件
  7. 输入hexo s,启动服务器。默认情况下,访问网址为: http://localhost:4000/
  8. 重新打开CMD,输入:ssh-keygen -t rsa -C “Github的注册邮箱地址”

一直Enter过来,得到信息:
Your public key has been saved in /c/Users/user/.ssh/id_rsa.pub.

  1. 找到该文件,打开(sublime text),Ctrl + a复制里面的所有内容,然后进入Sign in to GitHub:https://github.com/settings/ssh
  2. New SSH key ——Title:blog —— Key:输入刚才复制的—— Add SSH key

五、博客网站配置信息

  1. 进入blog网站,用sublime打开_config.yml文件(博客基本配置信息),修改参数
  2. 终极,特别,提醒。每个参数的:后都要加一个空格(这个坑踩的我头晕)
  3. hexo框架的blog基础信息,按照自己设置就行

    1
    2
    3
    4
    5
    6
    title: 无小意的博客
    subtitle: 不想再犹豫。
    description: 数据分析之路上~
    author: 无小意
    language: zh-CN
    timezone: Asia/Shanghai
  4. 部署服务器的相关配置信息,只需要修改repo部分,username设置为你的username

    1
    2
    3
    4
    deploy: 
    type: git
    repo: https://github.com/username/username.github.io.git
    branch: master
  5. 各类主题的配置信息,要在主题文件夹内的_config.yml上进行配置!

六、发表文章

  1. 进入blog文件夹下,输入hexo new “Hello blog”
  2. 打开info中的地址,打开文件。
  3. 文章内容采用Markdown语法进行编辑,需要用相关软件才能打开这个文件
  4. Markdown编辑使用说明
  5. 1
    2
    3
    4
    5
    6
    7
    ---
    title: Hello blog
    date:
    tags: 测试
    ---
    测试文章,欢迎关注作者博客: https://wuxingggg.github.io/
    虽然啥子都没有,以后慢慢补充
  6. 执行以下步骤

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    C:\test\blog
    $ hexo clean
    INFO Deleted database.
    INFO Deleted public folder.

    C:\test\blog
    $ hexo generate
    INFO Start processing
    INFO Files loaded in 1.48 s
    ...
    INFO 29 files generated in 4.27 s

    C:\test\blog
    $ hexo server
    INFO Start processing
    INFO Hexo is running at http://localhost:4000/. Press Ctrl+C to stop.

7.http://localhost:4000/ 打开后检查,没问题后部署到服务器上

1
2
3
4
C:\test\blog
$ hexo deploy
INFO Deploying: git
...

  • 其中,可能会出现github登录界面,正常填写就行

  • hexo deploy 后,出现 error deployer not found:git 的错误,输入以下代码

    • npm install hexo-deployer-git –save

    • 再次hexo deploy

“Hello Blog”

七、主题设置

主题设置中,最好玩的就是尝试各式各样的主题啦~

官方hexo主题大全,里面有许多主题都能尝试一下。

在这里推荐几个主题:

  1. 主题配置,首先要下载主题,到相应的Git链接,比如,Material下载Source code (zip)
  2. 下载完以后将文件解压缩后放到blog中的themes文件夹中
  3. 修改主题文件夹名称,将其改为 material 。 然后打开 站点配置文件,找到 theme 字段,并将其值更改为 material
  4. 手动将 material 文件夹中的 _config.template.yaml 复制一份并重命名为 _config.yaml
  5. 接下来,打开主题相应的博客中的文档说明,对比“主题”中的_config.yaml,针对自己需要的功能进行相关设置
  6. 有关设置中的图片,统一放到主题文件夹内\source\img。在设置中,用”/img/xigua.jpg”类似格式进行图片设置。
  7. 设置时切记 : 后面要加一个空格。这个坑有点恼人~
  8. 最后再重新进行一次,hexo clean,hexo g,hexo s,hexo,deploy 整个博客就完成主题修改啦

八、总结

  • 用了一些时间,完成了自己第一个博客的搭建,感觉还是蛮爽的,有兴趣的朋友可以立马试试。
  • 这次搭建自己的博客,过程中经常需要到百度搜索各种各样信息和问题,遇到一个解决一个就好了。
  • 了解到了,有关SSH密匙,npm包管理工具,网站搭建流程,评论功能设置,服务器部署,hexo框架的文档,blog各类功能的配置设置。
  • 发布文章时用到了Markdown,现在也顺便练习一下用法。
  • 知乎的文章往博客转移不太方便,得另外用Markdown再写一遍。

搭建一个简单的博客,还是挺简单的,花点时间琢磨一下肯定能出成果。

期末又要来了,寒假还要尽量找份深圳的实习,有空再写一下有关数据分析的文章。

This blog is belong to 无小意
本文链接:https://wuxingggg.github.io/2017/12/22/第二篇/