1.基础准备

  1. github账号
  2. 安装git
  3. 安装node.js、npm

2.创建repo

3.配置SSH key

这一步并不重要,配置SSH key与否,并不影响博客的搭建和使用,只是配置了之后,更新博客方便一点,不用每次都输用户名和密码。

  • 打开终端,输入如下命令
cd .ssh
ls -la

检查终端输出的文件列表中是否已经存在id_rsa.pub 或 id_dsa.pub 文件,如果文件已经存在,那么你可以跳过步骤

  • �创建SSH key
    $ ssh-keygen -t rsa -C "your_email@example.com"
    注:此处邮箱为注册github账号的邮箱
    回车,接着会提示你,让你输入文件名,直接回车会创建使用默认文件名的文件(推荐使用默认文件名);
    然后会提示你输入两次密码(输入密码之后没有反馈,显示还是空白,但是你确实已经输入了),当然密码也可以不输,直接回车,如果这里没有输入密码,以后提交博客更新的时候就不需要输入密码了。
  • 添加SSH key到github
    经过第二步,如果你没有指定文件名(也就是使用的默认文件名),那么你的.ssh文件夹下,应该有一个id_rsa.pub文件了,打开该文件,复制里面的文本。
    然后登陆github,点击右上角头像右边的三角图标,点击Settings,然后在左边菜单栏点击SSH and GPG keys,点击new ssh key,title 随意填,在key 栏填入你复制的内容,点击add ssh key,就可以添加一个ssh key了。
  • 验证SSH key是否配置成功
    终端输入:
    ssh -T git@github.com
    回车,你会看到如下回复,说明你的ssh key添加成功了。
    Hi chenglaiyong! You’ve successfully authenticated, but GitHub does not provide shell access.
    如果过程中提示你perimission deny相关错误,就在命令前加上sudo 然后执行命令的时候输入你的appleid密码应该就可以了。sudo用来说明用管理员权限运行。

4.安装Hexo

  • 终端输入:
    npm install -g hexo
  • 初始化,创建所需资源
    新建任意名字文件夹,cd进入该文件夹后,执行如下命令
hexo init
npm install
  • 生成并发布
hexo g  // 全拼是:hexo generate,可以简写成 hexo g
hexo s // 全拼是:hexo server,可以简写成 hexo s

这样就开启了一个本地博客服务器,打开浏览器,在地址栏输入http://localhost:4000,就可以查看本地博客了,hexo默认生成了一片hello world博客。
注:以上hexo开头的命令,执行目录必须是你创建的博客文件夹目录,因为只有在那个文件夹下才有创建和发布hexo的所有资源。

5.同步Hexo到Github

  • 安装
    npm install hexo-deployer-git --save
  • 打开本地博客目录的_config.yml文件,编辑其中的deploy节点
deploy:
type: git
repository: https://github.com/chenglaiyong/chenglaiyong.github.io.git
branch: master

注:“: ”后面的空格,这是个坑
repository地址从下图中即可获取

url.jpeg

保存即可
当然可以使用SSH地址作为repository地址,点击右上角Use SSH,之后操作相同。

  • 生成和发布
hexo clean  // clean本地项目,防止缓存
hexo g // 根据你编辑的md格式的博客,生成静态网页
hexo d // 将本地博客发布到github

然后,在浏览器地址栏输入yourusername.github.io就可以访问你的博客了,别人也可以通过这个地址访问你的博客。

6.Hexo常用命令行

hexo init      //在指定目录执行该命令,会将当前目录初始化为hexo站点,生成hexo站点所需的一切文件
hexo new “my new blog title” //新建一篇文章。如果没有设置 layout 的话,默认使用 _config.yml 中的 default_layout 参数代替。如果标题包含空格的话,请使用引号括起来。
hexo clean // 清除缓存,如果对本地文件做了修改,同步到远程验证修改的效果之前,先clean,清除缓存
hexo generate // 可以简写成hexo g 根据markdown文件生成静态文件
hexo server // 或者简写成hexo s 启动本地hexo 服务器,默认localhost:4000可以访问
hexo deploy // 或者简写成hexo d 将本地修改,部署到远端
hexo version // 显示hexo版本

7.其他常用操作

  • 新建博文
    hexo new "the title of your blog"
    建议学习 写作 | Hexo
  • 删除博文
    删除自动生成的hello world
    找到/source/_posts文件夹,里面放了所有我们写的博客,想删除哪篇,直接在这里删除,然后再重新发布到github,这篇博文就不见了
  • 给博文添加tag和分类
    创建的新博文文件,打开之后顶部会有一段自动生成的文本,在其中加入tag和category标签即可指定tag和分类。
  1. 编辑_config.yml
    post_asset_folder: true
    这样hexo会在每次使用hexo new title命令时在文章源文件目录下创建同名文件夹来存储资源.
  2. 实现
 
photo.jpeg

markdown中引用这么写:

{% asset_img newRepository.png 创建repository%}

asset_img 表示要引用图片, newRepository.png是标题, 后面的是图片显示的标题和悬浮时的提示。

8.安装Theme

  1. 终端cd到hexo所在文件夹执行如下命令:
    git clone https://github.com/iissnan/hexo-theme-next themes/next
  2. 将hexo目录下_config.yml里theme的名称landscape修改为next,重新部署就可以了。
  3. fork me on github
    如果你访问我的个人博客,你会发现右上角有一个倾斜的fork me on github 图标,想要集成这个图标,去这里挑选你喜欢的样式,把样式代码复制过来。
    本地博客目录下的themes/next/layout/layout.swig文件,然后把你复制过来的样式代码粘贴到如下位置。
  1. 可以选择其他主题Themes | Hexo,方法同上。

Mac搭建github Page的Hexo免费个人博客的更多相关文章

  1. Github Pages和Hexo创建静态博客网站

    Github Pages和Hexo创建静态博客网站 安装Node.js 本人是window环境,所以下载window版. 下载地址:https://nodejs.org/en/download/ 下载 ...

  2. 使用Github Pages和Hexo构建个人博客

    Github Pages可以创建免费的静态站点,支持自带主题.支持自制页面等,并且可以使用Jekyll或者Hexo等静态博客框架进行管理. 独立博客是博客园等博客平台之外的一个良好补充,相比使用虚拟主 ...

  3. Github Pages 搭建HEXO主题个人博客

    跌跌撞撞,总算是建立起来了.回首走过的这么多坑,也真的是蛮不容易的.那么就写点东西,记录我是怎么搭建的吧. 准备工作 安装Node.js: 用于生成静态页面,我们需要到官网上去下载即可.http:// ...

  4. github page 和 hexo 搭建在线博客

    目录: 安装node.js与git 常用git命令 安装hexo 配置hexo hexo发布到github 1.安装node.js和git工具 https://nodejs.org/en/ 直接下载安 ...

  5. 基于Github&Hexo的个人博客搭建过程

    大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...

  6. 使用 GitHub, Jekyll 打造自己的免费独立博客

    使用 GitHub, Jekyll 打造自己的免费独立博客 GitHub是一个代码托管网站,现在很多开源项目都放在GitHub上. 利用GitHub,可以让全球各地的程序员们一起协作开发.GitHub ...

  7. 使用 github Pages 服务建立个人独立博客全过程

    你是否有这样子的需求,只是想简单的写写文章,记录下自己的学习心得.成长经历等,都是些文字内容,不需要配置使用数据库.不想购买服务器自己搭建站点,只是想安安静静的用比较舒服的方式来写篇文章. 静态博客就 ...

  8. 换了电脑如何使用hexo继续写博客

    前言 我们知道,使用 Github+hexo 搭建一个个人博客确实需要花不少时间的,我们搭好博客后使用的挺好,但是如果我们有一天电脑突然坏了,或者换了系统,那么我们怎么使用 hexo 再发布文章到个人 ...

  9. 使用hexo,创建博客

    下载hexo工具 1 npm install hexo-cli -g 下载完成后可以在命令行下生成一个全局命令hexo搭建博客可用thinkjs 创建一个博客文件夹 1 hexo init 博客文件夹 ...

随机推荐

  1. MINIUI grid学习笔记

    grid 控件a.事件的绑定和移除         grid.on("rowclick", fn); //绑定事件 (这个的话类似jquery的绑定事件)         grid ...

  2. zencart产品批量采集伪原创方法,再也不用担心与别人的数据重复了

    首先,请你提供与产品相关的关键词一份,至于关键词如何来,相信做SEO的你很清楚了,SEO关键词搜索工具应该很多,比如谷歌相关关键词搜索,用记事本的形式保存为每行一个关键词.采集产品的时候,我会帮你将关 ...

  3. tomcat CATALINA_HOME与CATALINA_BASE的区别

    区别 https://blog.csdn.net/cfydaniel/article/details/41351927 Tomcat启动分析(我们为什么要配置CATALINA_HOME环境变量) ht ...

  4. 前端每日实战:140# 视频演示如何用纯 CSS 创作文本的淡入动画效果

    效果预览 按下右侧的"点击预览"按钮可以在当前页面预览,点击链接可以全屏预览. https://codepen.io/comehope/pen/ZMwgqK 可交互视频 此视频是可 ...

  5. scrapy五大核心组件和中间件以及UA池和代理池

    五大核心组件的工作流程 引擎(Scrapy) 用来处理整个系统的数据流处理, 触发事务(框架核心) 调度器(Scheduler) 用来接受引擎发过来的请求, 压入队列中, 并在引擎再次请求的时候返回. ...

  6. LOJ-6279-数列分块入门3(分块, 二分)

    链接: https://loj.ac/problem/6279 题意: 给出一个长为 的数列,以及 个操作,操作涉及区间加法,询问区间内小于某个值 的前驱(比其小的最大元素). 思路: 同样的分块加二 ...

  7. 对JavaScript 引擎基础:原型优化的研究 -----------------------引用

    一.优化层级与执行效率的取舍 介绍了现代 JavaScript 引擎通用的工作流程: 我们也指出,尽管从高级抽象层面来看,引擎之间的处理流程都很相似,但他们在优化流程上通常都存在差异.为什么呢?为什么 ...

  8. 创建一个Django项目

    创建一个django项目: 1. django-admin  startproject student_manage(项目名) 2. cd student_manage python manage.p ...

  9. SQLite为何要用C语言来开发?

    SQLite 选择 C 语言的理由是?为什么不选择 Go 或者 Rust? C 语言是最好的 SQLite 在 2000 年 5 月 29 日发布,并一直使用 C 语言实现.C 语言一直是实现 SQL ...

  10. Java面试题系列(六)优化tomcat配置

    序言 资料 如何优化tomcat配置(从内存.并发.缓存3个方面)优化