5 分钟带你读懂 Hexo 源码设计模式
Hexo是什么? {#Hexo是什么} =================== 官方定义是快速、简洁且高效的博客框架,实际不仅仅于此,它是一个JS语言编写的静态网站生成器,主要作用是解析Markdown语法,并配合模板引擎,快速生成静态网站。同时,还可以自定义主题,引用第三方插件,除了搭建个人博客之外,Hexo还被许许多多的项目拿来生成API文档,如阿里开源项目[Weex](...
Hexo是什么? {#Hexo是什么} =================== 官方定义是快速、简洁且高效的博客框架,实际不仅仅于此,它是一个JS语言编写的静态网站生成器,主要作用是解析Markdown语法,并配合模板引擎,快速生成静态网站。同时,还可以自定义主题,引用第三方插件,除了搭建个人博客之外,Hexo还被许许多多的项目拿来生成API文档,如阿里开源项目[Weex](...
方法 {#方法} ======== > bilibili默认给的是一个iframe,在iframe中添加css样式:style="position:absolute; height: 100%; width: 100%;" > 在原来的iframe外面嵌套一层div,div添加样式:style="position:relative...
修改 pug 代码 {#修改-pug-代码} ====================== [butterfly-swiper下载](https://github.com/Zfour/Butterfly-swiper) 将资源包中的`sliderbar.pug`复制到文件夹`blog\themes\butterfly\layout`中。 将`index.pug`复制并重命...
安装插件 {#安装插件} ============ |-------------------|-------------------------------------------------------------------------------------------------------------| | ``` 1 2 3 4 5 ``` | ``` npm i...
安装插件 {#安装插件} ============ 在博客根目录\[blog\]下打开终端,运行以下指令: |-----------|----------------------------------------------------| | ``` 1 ``` | ``` npm install hexo-filter-gitcalendar --save ``` | ...
引言 {#引言} ======== Hexo 是一个轻量、快速,简单和强大的博客框架,当我们需要发布博文的时候,只需要将写好的文章(MarkDown文件)放入本地的 `\source\_posts` 文件夹,然后再推送上去就行了,原理就是当我们在执行 `hexo g` 命令时,`.md` 文件就会被转化成 `HTML` 文件,但是有时候我们需要新建一个独立的页面,这个页面不使...
前言 {#前言} ======== 不知道大家对于默认的butterfly版权怎么看?如果不太满意可以按照如下教程进行美化。 教程 {#教程} ======== 修改post-copyright.pug {#修改post-copyright-pug} -------------------------------------------- 打开`ROOT\themes\...
前言 {#前言} ======== 看到了大佬的文章页一页到底,效果如下图所示: ![](data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7) 那么怎么样修改才能做到这一点呢? 教程 {#教程} ======== > 适用范围:butterfly3.3....
介绍 本文将会详细介绍一图流背景与顶部图的修改过程。 设置图片 {#设置图片} ============ 这个是 Butterfly 自带的功能,修改主题的配置文件 `_config.butterfly.yml`。 编辑 `index_img`、`background`、`footer_bg` 选项。 设置网站背景,并将主页顶部图和页脚背景改为透明。 (需要将...
前言 {#前言} ======== 如果你的 [Butterfly](https://butterfly.js.org/) 版本高于 4.3.0,则主题自带 CDN 自定义格式功能。 可参考 [主题文档的 CDN 部分](https://butterfly.js.org/posts/ceeb73f/#CDN) 进行配置,无需继续以下步骤。 教程 {#教程} ======...