全网最好基于hexo搭建个人博客(附挂载到Github+美化)

个人博客的搭建:

本次是基于hexo框架来搭建个人博客,可以挂载到Github上,优化会在后期进行。

Step1:

  1. 首先要在机器上安装node.js,到node.js官网下载安装就行,安装步骤=下一步

    检查安装是否成功:node -v

  2. 安装cnpm:

npm install -g cnpm --registry=https://registry.npm.taobao.org

​ 安装完成检查:cnpm -v

  1. 使用cnpm全局安装hexo:

npm install -g hexo-cli

卸载hexo: npm uninstall hexo-cli -g

​ 安装完检查:hexo -v

  1. mkdir命令创建一个空文件夹(后序博客内容全部在这里面)

  2. 使用管理员命令初下载博客:

    sudo hexo init

Step2:

进入到blog文件夹下发现Hexo自动帮我们生成了一些文件:

在这里插入图片描述

  1. 本地运行起博客:hexo s

在这里插入图片描述

  1. 创建发布我的第一篇博客:

    首先进入到 blog/source/_posts 目录下,该目录中存放的就是我们创建的博客文件,使用vim编辑器博客,然后创建.md文件。

    文件创建完成后退回到blog目录清除缓存 hexo clean

    然后重新生成博客: hexo g

    最后重新启动博客即可: hexo s

在这里插入图片描述

Step3:挂载博客到Github(不错的选择):

  1. 在GitHub上新建仓库,注意仓库名必须为 xxx.github.io 注意这里的xxx必须为你的Github用户名,否则后面访问时为404!

  2. 下载部署到Github上的插件: cnpm install --save hexo-deployer-git

  3. 修改_config.yml文件:

    通过vim编辑器进入到文件的最后新增如下代码:

deploy:
   type: git
   repo: 你的github上博客仓库的地址
   branch: master

在这里插入图片描述

  1. 更换主题:

https://hexo.io/themes/ 中挑选自己喜欢的,不推荐花里胡哨的,那种教程比较少。

推荐使用 https://github.com/litten/hexo-theme-yilia 简洁的风格,毕竟主要是用来记录学习的过程。

选择好Github主题后就 git clone到blog文件夹下,你会发现新克隆的主题存放在themes文件夹下。

最后就是 清除缓存然后重新部署到 Github上即可啦!

  1. 美化

(1).添加网易云音乐插件:

①首先打开网易云音乐首页,复制自己喜欢的音乐外分享外链:

在这里插入图片描述

点击后会生成对应的HTML代码。

②引入播放器代码:

在你的yilia主题文件夹theme中的 layout/_partial/left-col.ejs文件中添加如下代码:

!注意需要放在

posted @ 2023-02-24 21:17  Stitches  阅读(162)  评论(0)    收藏  举报