hexo入门 & butterfly魔改

新建文章

1	hexo new [layout] <titie>

布局	路径
post	source/_posts
page	source
draft	source/_drafts

参数	描述
-p	–path 自定义新文章路径
-r	–replace 如果存在同名文章，将其替换
-s	–slug 文章的 Slug，作为新文章的文件名和发布后的 URL

新建文件默认地址： 2024/03/18/hexo入门/
permalink：
2024/03/18/hexo入门/

butterfly添加自定义js、css文件

推荐在根目录的source文件夹种配置，通过配置文件将
展示目录

# _config.butterfly.yml 
inject:
  head:
    # - <link rel="stylesheet" href="/xxx.css">
  bottom:
    - <script src="/js/browsersync.js"></script>

实时编辑预览

当通过hexo s开启本地调试后，预览页面无法实现实时更新
可通过hexo-browsersync配置, 3001端口对应brosersync配置页，根据配置页提示将对应代码块复制到/public/index.html文件代码块内

npm install hexo-browsersync --save
hexo s
[Browsersync] Access URLs:
 ----------------------------------
          UI: http://localhost:3001
 ----------------------------------
 UI External: http://localhost:3001
 ----------------------------------
INFO  Hexo is running at http://localhost:4000/ . Press Ctrl+C to stop.

参考链接: Hexo-Browsersync-使用方法
| yml文件改动后还是需要重新启动以生效

本地搜索功能

通过hexo-generator-search实现本地搜索，

安装配置

1 2	npm install hexo-generator-search --save

注入配置 _config.yml文件

search:
  path: search.xml
  field: post
  content: true

butterfly主题开启搜索功能 _config.butterfly.yml文件


local_search:
-  enable: false
+  enable: true

图库

图库页面是普通的页面，通过hexo n page xxxxx创建后使用标签外挂galleryGroup

<div class="gallery-group-main">
{% galleryGroup '壁紙' '收藏的一些壁紙' '/Gallery/wallpaper' https://i.loli.net/2019/11/10/T7Mu8Aod3egmC4Q.png %}
{% galleryGroup '漫威' '關於漫威的圖片' '/Gallery/marvel' https://i.loli.net/2019/12/25/8t97aVlp4hgyBGu.jpg %}
{% galleryGroup 'OH MY GIRL' '關於OH MY GIRL的圖片' '/Gallery/ohmygirl' https://i.loli.net/2019/12/25/hOqbQ3BIwa6KWpo.jpg %}
</div>