使用Hexo搭建github博客步骤,超简便

时间:2022-09-06 09:52:55

categories:

  • 工具

tags:

  • git
  • Windows
  • 搭建博客

你只需要node环境和一个github账号就可以开工啦!

本教程适合于Windows环境,Mac教程也大同小异

利用hexo搭建github博客很简单,甚至不需要编程的基础也可以完成,下面是我的博客成品的展示高翔的博客

1.准备工作

  • 你的电脑需要配置node环境(包括npm)
  • 你需要有github账号和git基础(上传过项目)
  • 你的电脑需要安装了git工具(git Bash)

ok,可以正式开始搭建了!

2.使用Hexo搭建框架

2.1 请使用命令行工具,执行下面命令安装Hexo
$ npm install hexo -g

2.2 在任意一个目录初始化Hexo项目

在任意一个目录下执行以下命令

hexo init

当你看到Start blogging with Hexo! 恭喜!框架就已经搭建好了

2.3接下来执行以下命令就可以在本地起服务

hexo server

然后访问http://localhost:4000/,就能看到自己博客的雏形了

3 发布一篇文章

此时你的命令行正在起服务,按ctrl+c暂停服务,输入y确定。

用下面的代码来新建一篇文章

hexo new "我的第一篇文章"

然后

hexo generate

使用Hexo搭建github博客步骤,超简便

如图,双引号中间就是你的文章的名字,此时你再用hexo server起服务,就能看到自己的文章出现在页面中了


使用Hexo搭建github博客步骤,超简便

但是现在文章只有一个标题,文章的文件是在你的目录的source_posts文件夹里面

里面有个的第一篇文章.md就是记录你文章信息的markdown文件,你可以用markdown语法来编辑它

这个.md文件用sublime或者写字本都可以打开编辑,现在也有很多可以实时预览的markdown编辑器,我使用的是有道云笔记,了解更多关于markdown


使用Hexo搭建github博客步骤,超简便

如上图:
  1. title表示文章标题
  2. tags:表示给文章添加的标签
  3. 以上的内容会在文章列表页显示,点击进入文章页以后才会显示more下面的内容

4 配置你的个性化博客主题

4.1在知乎上面的这个问题提供了很多精品主题

有哪些好看的Hexo主题?

选取你喜欢的clone或下载下来,放进你的项目目录的themes文件夹里面

4.2 更改主题的配置文件

首先打开项目根目录下的_config.yml文件

里面的每个键值对在冒号:后面都需要跟一个空格,请注意

title: 博客的名字
description: 你的描述
author: 作者名字 themes:你的主题的文件夹的名字

一般来说这些需要更改,你可以根据英文自己理解修改

themes在最下面,把它的值改为你刚放进去的主题的名字

再在命令行执行

hexo generate
hexo server

刷新就可以看到你的主题上线啦

一般来说,主题的文件夹里面都还有一个_config.yml文件,来配置里主题可更改的信息

5 部署到github

5.1 创建github博客项目

你需要在你的github页面右上角你的头像旁边点击 + 号按钮,选择repository。

在 Repository name 栏中,输入

[你的用户名].github.io

这个用户名必须和github用户名完全一样,如我的github

用户名为gaoxianglyx

项目名为 gaoxianglyx.github.io

5.2 配置里本地的项目与github连接

在你项目刚打开的_config.yml文件中,找到depoly,修改为如下

deploy:
type: git
repository: git@github.com:gaoxianglyx/gaoxianglyx.github.io.git
branch: master

repository后面的值为你刚创建的项目的地址

5.3 发布到github

在命令行执行

npm install hexo-deployer-git --save

安装完成后,使用以下命令便可以上传项目到github

hexo generate
hexo deploy

现在,你的博客就已经可以在线进入了,地址为:[你的用户名].github.io

6 其他提醒

一般常用的hexo命令为

hexo clean //清理(非必须),一般上传前线clean再generate

hexo generate //将文章生成为博客的一部分,可简写为 hexo g

hexo server //本地预览(非必须), 可简写为 hexo s

hexo deploy //推送到GitHub,可简写为 hexo d

使用Hexo搭建github博客步骤,超简便的更多相关文章

  1. 使用Hexo搭建GitHub博客(2018年Mac版)

    关于本文 本文仅记录自己学习搭建Hexo博客之时,搭建过程中掉坑的历程总结,对零基础起步的观众朋友可能缺乏某些基础技术的指导,请优先食用下述两篇优质教程: [2018更新]小白独立搭建博客-Githu ...

  2. Linux下使用Hexo搭建github博客

    找到一篇靠谱的博客,备份一下: ---------以下原文------------------ Nodejs安装 因为hexo是基于nodejs的应用,所以要先安装nodejs才可以.我这里以Ubun ...

  3. 转:20分钟教你使用hexo搭建github博客

    注册Github账号 这里我们就不多讲了,小伙伴们可以点击这里,进入官网进行注册. 创建仓库 图片来自Github 登录账号后,在Github页面的右上方选择New repository进行仓库的创建 ...

  4. 使用hexo搭建github博客

    Win7系统已经安装了node.js和npm npm install -g hexo-cli 全局安装hexo客户端 hexo init blog 在喜欢的位置初始化blog目录 cd blog np ...

  5. Windows下通过GitHub+Hexo搭建个人博客的步骤

    Windows下通过GitHub+Hexo搭建个人博客的步骤  https://blog.csdn.net/namechenfl/article/details/90442312 https://bl ...

  6. Linux下使用 github+hexo 搭建个人博客01-hexo搭建

    为什么要搭建自己的博客系统? 原因有好几个吧,归类如下:1.自己搭建博客系统很有成就感,可以自己选定页面风格和页面排版: 2.自己搭建博客系统可以根据自己的需要添加各种插件功能,因此整体上比网上的第三 ...

  7. 使用github和hexo搭建静态博客

    获得更多资料欢迎进入我的网站或者 csdn或者博客园 终于写这篇文章了,这是我使用github和hexo搭建博客的一些心得,希望能给大家一点帮助.少走点弯路.刚接触github,只是用来存项目的版本, ...

  8. 使用Hexo搭建个人博客并部署到GitHub或码云上全过程

    一.前言 如上图所示:GitHub有Github Pages,而码云也有码云 Pages 1.Github Pages或Gitee Pages是什么呢? Github Pages或者Gitee Pag ...

  9. Linux下使用 github+hexo 搭建个人博客07-next主题接入搜索和站点管理

    这是搭建个人博客系统系列文章的最后一篇,如果你是从第一篇一路跟下来的,那么恭喜你,即将完成整个博客网站的搭建.OK,话不多说,开始我们的收官之战. 不知你想过没有,如果我们的文章少,一眼看完整个目录, ...

随机推荐

  1. java.sql.SQLException: Incorrect key file for table 'C:\Windows\TEMP\#sql578_6e2_68d.MYI'; try to repair it

    java.sql.SQLException: Incorrect key file for table 'C:\Windows\TEMP\#sql578_6e2_68d.MYI'; try to re ...

  2. 使用URL访问网络资源

    URL(Uniform  Resource  Locator)对象代表统一资源定位器,它是指向互联网“资源”的指针.资源可以是简单的文件或目录,也可以是对更复杂的对象的引用,例如对数据库或搜索引擎的查 ...

  3. [转] FDA批准首个莫米松植入式给药系统用于治疗慢性鼻窦炎

    from: http://www.qqyy.com/jibing/erbihouke/111020/3fd2f.html http://www.chemdrug.com/news/231/5/2494 ...

  4. 开源的.Net ORM微型框架SuperHelper

    SuperHelper——灵活通用的.开源的.Net ORM微型框架 SuperHelper是博主利用业余时间编写的一个ORM微型框架,除了可以提高开发效率,与其它ORM框架相比,博主更加喜欢Supe ...

  5. POJ1422Air Raid(二分图,最小不相交路径覆盖)

    Air Raid Consider a town where all the streets are one-way and each street leads from one intersecti ...

  6. MVC学习笔记(分享)

    一.SpringMVC基础入门,创建一个HelloWorld程序 1.首先,导入SpringMVC需要的jar包. 2.添加Web.xml配置文件中关于SpringMVC的配置 <!--conf ...

  7. AutoDesk Forge 获取令牌认证

    创建应用程序 在开始使用Forge Platform之前,您需要设置一个应用程序并获取您的客户端ID和密码. 步骤1:登录Dev Portal 去开发门户网站:https://developer.au ...

  8. mysql收集统计信息

    一.手动  执行Analyze table innodb和myisam存储引擎都可以通过执行“Analyze table tablename”来收集表的统计信息,除非执行计划不准确,否则不要轻易执行该 ...

  9. 【vim】把当前文件转化为网页

    这会生成一个 HTML 文件来显示文本,并在分开的窗口显示源代码: :%TOhtml (译者注:原文是 :%Tohtml,但在我的电脑上是 :%TOhtml) 转载自:https://linux.cn ...

  10. python-pandas 高级功能(通过学习kaggle案例总结)

    方法.iterrows()遍历循环df中的元素. for index,row in df.iterrows(): pass 更改df一个元素中的变量值. data1.set_value(index,' ...