avatar
文章
23
标签
8
分类
0
首页
音乐
照片
友链
说说
关于
LogoLuckyHexo安装并修改主题
搜索
首页
音乐
照片
友链
说说
关于

Hexo安装并修改主题

发表于2025-02-23|更新于2025-02-24
|总字数:1k|阅读时长:3分钟

安装 Hexo 并使用 Butterfly 主题教程

一、前言

Hexo 是一个快速、简洁且高效的静态博客框架,而 Butterfly 是一款基于 Hexo 的主题,具有美观的界面和丰富的功能。本教程将指导你如何安装 Hexo 并将主题切换为 Butterfly。

二、安装 Hexo

1. 安装 Node.js 和 npm

Hexo 基于 Node.js 构建,因此在安装 Hexo 之前,需要先安装 Node.js 和 npm(Node.js 的包管理工具)。你可以通过以下步骤安装:

  • Windows 和 macOS 用户:访问 Node.js 官方网站,下载并安装最新版本的 Node.js。安装过程中会自动包含 npm。
  • Linux 用户:可以通过包管理器安装 Node.js 和 npm。例如,在 Ubuntu 上可以运行以下命令:
1
2
sudo apt update
sudo apt install nodejs npm

安装完成后,运行以下命令检查 Node.js 和 npm 是否安装成功:

1
2
node -v
npm -v

如果返回了版本号,说明安装成功。

2. 安装 Hexo

在命令行中运行以下命令安装 Hexo:

1
npm install -g hexo-cli

安装完成后,运行以下命令检查 Hexo 是否安装成功:

1
hexo -v

如果返回了 Hexo 的版本号,说明安装成功。

3. 初始化 Hexo 站点

选择一个合适的目录作为你的博客站点目录,然后运行以下命令初始化 Hexo 站点:

1
hexo init myblog

其中 myblog 是你的站点目录名称,你可以根据自己的喜好修改。

初始化完成后,进入站点目录:

1
cd myblog

4. 安装依赖

在站点目录中运行以下命令安装 Hexo 所需的依赖:

1
npm install

安装完成后,你的 Hexo 站点就初始化完成了。

三、安装 Butterfly 主题

1. 安装主题

在站点目录中运行以下命令安装 Butterfly 主题:

1
npm install hexo-theme-butterfly --save

2. 配置主题

在站点目录中找到 _config.yml 文件,打开并修改 theme 配置项,将其值设置为 butterfly:

1
theme: butterfly

保存并关闭 _config.yml 文件。

3. 配置主题选项(可选)

Butterfly 主题提供了丰富的配置选项,你可以通过修改主题的配置文件来调整主题的外观和功能。主题的配置文件位于 themes/butterfly/_config.yml,你可以根据自己的需求进行修改。

例如,你可以修改主题的颜色、布局、菜单等选项。具体配置项的说明可以在 Butterfly 主题的 官方文档 中查看。

四、启动 Hexo 服务器

在站点目录中运行以下命令启动 Hexo 服务器:

1
hexo s

启动成功后,浏览器会自动打开 http://localhost:4000,你可以看到你的博客已经使用 Butterfly 主题了。

五、生成静态文件

当你完成博客的编辑后,可以运行以下命令生成静态文件:

1
hexo g

生成的静态文件位于站点目录的 public 文件夹中,你可以将这些文件部署到服务器上,让其他人访问你的博客。

六、部署到服务器(可选)

Hexo 提供了多种部署方式,例如部署到 GitHub Pages、GitLab Pages、Vercel 等。你可以通过修改 _config.yml 文件中的 deploy 配置项来选择部署方式。

例如,如果你想要将博客部署到 GitHub Pages,可以按照以下步骤操作:

  1. 在 _config.yml 文件中添加以下配置:
1
2
3
4
deploy:
type: git
repo: https://github.com/your-username/your-repo.git
branch: main

其中 your-username 是你的 GitHub 用户名,your-repo 是你的 GitHub 仓库名称,main 是分支名称。

  1. 运行以下命令部署博客:
1
hexo d

部署完成后,你的博客就会出现在 GitHub Pages 上了。

七、总结

通过以上步骤,你已经成功安装了 Hexo 并将主题切换为 Butterfly。你可以根据自己的需求继续探索 Hexo 和 Butterfly 的更多功能,打造一个属于自己的个性化博客。

如果你在安装过程中遇到任何问题,可以查看 Hexo 和 Butterfly 主题的官方文档,或者在相关社区中寻求帮助。

文章作者: 刘同学
文章链接: https://mouhorse.github.io/2025-02-23/Hexo%E5%AE%89%E8%A3%85%E5%B9%B6%E4%BF%AE%E6%94%B9%E4%B8%BB%E9%A2%98/
版权声明: 本博客所有文章除特别声明外,均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来源 Lucky!
脱坑笔记
赞助
  • wechat
    wechat
  • alipay
    alipay
cover of previous post
上一篇
MNE脑电预处理
MNE官网链接 导包12import mneimport matplotlib.pyplot as plt 加载数据集不同格式数据集使用的函数不同,具体在官网搜索 1raw = mne.io.read_raw_brainvision(r"test.vhdr", preload=True) 此语句为了画图方便 1%matplotlib 降采样1raw.resample(200) 查看数据12345# 一屏展示10个位置信号,长10秒raw.plot(duration=10, n_channels=10) # 绘制PSDraw.plot_psd(fmax=60) plt.show() 滤波高通滤波、低通滤波 1raw.filter(1, 60) 过滤市电1raw.notch_filter(50) 查看数据123raw.plot(duration=10,...
cover of next post
下一篇
Butterfly 个性化配置教程
Butterfly 个性化配置教程官方教程Butterfly 文档 1. 前言Butterfly 是一款基于 Vue.js 和 Markdown 的静态博客生成器,以其简洁、灵活和强大的主题系统而受到许多开发者的喜爱。通过个性化配置,你可以轻松打造一个独一无二的个人博客或项目网站。本教程将带你一步步完成 Butterfly 的个性化配置。 2. 安装与初始化2.1 安装 HexoButterfly 是基于 Hexo 的主题,因此首先需要安装 Hexo。在终端中运行以下命令: 1npm install -g hexo-cli 安装完成后,创建一个新的 Hexo 站点: 12hexo init myblogcd myblog 2.2 安装 Butterfly 主题在站点目录下,运行以下命令安装 Butterfly 主题: 1npm install hexo-theme-butterfly --save 安装完成后,修改 _config.yml 文件,将主题设置为 butterfly: 1theme: butterfly 2.3...
相关推荐
cover
2025-02-23
Butterfly 个性化配置教程
Butterfly 个性化配置教程官方教程Butterfly 文档 1. 前言Butterfly 是一款基于 Vue.js 和 Markdown 的静态博客生成器,以其简洁、灵活和强大的主题系统而受到许多开发者的喜爱。通过个性化配置,你可以轻松打造一个独一无二的个人博客或项目网站。本教程将带你一步步完成 Butterfly 的个性化配置。 2. 安装与初始化2.1 安装 HexoButterfly 是基于 Hexo 的主题,因此首先需要安装 Hexo。在终端中运行以下命令: 1npm install -g hexo-cli 安装完成后,创建一个新的 Hexo 站点: 12hexo init myblogcd myblog 2.2 安装 Butterfly 主题在站点目录下,运行以下命令安装 Butterfly 主题: 1npm install hexo-theme-butterfly --save 安装完成后,修改 _config.yml 文件,将主题设置为 butterfly: 1theme: butterfly 2.3...
cover
2025-02-24
解决 Hexo 部署到 GitHub Pages 自定义域名失效
解决 Hexo 部署到 GitHub Pages 自定义域名失效问题在使用 Hexo 部署博客到 GitHub Pages 时,可能会遇到每次运行 hexo d 后自定义域名失效的问题。以下是两种解决方法,帮助你实现自定义域名的永久配置。 方法一就够用了 方法一:手动添加 CNAME 文件 找到 source 文件夹在 Hexo 博客的根目录下,找到名为 source 的文件夹(注意不是主题的 source 文件夹)。 创建 CNAME 文件在 source 文件夹中新建一个文件,命名为 CNAME(全部大写,无后缀,不是CNAME.yml)。 写入自定义域名在 CNAME 文件中写入你的自定义域名(不包含 http:// 或 www. 等),例如: 1bilicili.com 保存并部署保存文件后,运行以下命令进行部署: 1hexo clean && hexo generate && hexo deploy 每次部署时,CNAME 文件都会被同步到 GitHub Pages,从而避免域名失效。 方法二:使用...
cover
2025-02-25
Hexo本地与云端布局不同处理办法
前两个方法都用过的话,直接使用第三个方法。 1.清空缓存浏览器打开云端网址。 shift + F5,强制清空缓存。 2.Hexo clear运行 hexo c && hexo g 然后重新部署hexo d 接着再使用第一步的shift + F5 3.删除文件删除hexo根目录下的这两个文件夹 然后再用2的方法部署项目。 if (typeof lightGallery !== 'undefined') { var options = { selector: '.gallery-item' }; lightGallery(document.getElementsByClassName('.article-gallery')[0], options); }
avatar
刘同学
欢迎光临我的博客
文章
23
标签
8
分类
0
Follow Me
公告
欢迎来到我的博客!
可以交换友链
联系方式:485182274@qq.com
目录
  1. 1. 安装 Hexo 并使用 Butterfly 主题教程
    1. 1.1. 一、前言
    2. 1.2. 二、安装 Hexo
      1. 1.2.1. 1. 安装 Node.js 和 npm
      2. 1.2.2. 2. 安装 Hexo
      3. 1.2.3. 3. 初始化 Hexo 站点
      4. 1.2.4. 4. 安装依赖
    3. 1.3. 三、安装 Butterfly 主题
      1. 1.3.1. 1. 安装主题
      2. 1.3.2. 2. 配置主题
      3. 1.3.3. 3. 配置主题选项(可选)
    4. 1.4. 四、启动 Hexo 服务器
    5. 1.5. 五、生成静态文件
    6. 1.6. 六、部署到服务器(可选)
    7. 1.7. 七、总结
最新文章
Hexo本地与云端布局不同处理办法
Hexo本地与云端布局不同处理办法2025-02-25
解决 Hexo 部署到 GitHub Pages 自定义域名失效
解决 Hexo 部署到 GitHub Pages 自定义域名失效2025-02-24
Butterfly 个性化配置教程
Butterfly 个性化配置教程2025-02-23
Hexo安装并修改主题
Hexo安装并修改主题2025-02-23
MNE脑电预处理
MNE脑电预处理2024-10-07
©2018 - 2025 By 刘同学
框架 Hexo 7.3.0|主题 Butterfly 5.3.3
活出个样子给自己看
搜索
数据加载中