魔改-《友链页面》
新建文件输入友链格式路径: [Blogroot]\source\_data\link.yml
1234567- class_name: 糖果屋のVIP class_desc: 售后服务享五折优惠2333 link_list: - name: Akilar link: https://akilar.top avatar: /img/siteicon/favicon.png descr: 欢迎光临糖果屋
修改flink.pug路径:[Blogroot]\themes\butterfly\layout\includes\page\flink.pug
此处添加判断机制,使得可以通过修改配置文件来切换友链风格
1234567case theme.flink_style when 'volantis' include ./flink_style/volantis.pug when 'flexcard' include ./flink_style/flexcard.pug default inc ...
魔改-《侧边栏个性定位欢迎语》
获取key进入 腾讯位置服务 应用管理界面
点击创建应用,应用名称和类型随便填
在新创建的应用中点击添加 key ,产品选择 WebServiceAPI ,域名白名单填自己的域名或不填
把得到的 key 记下; 如果开启白名单记得把localhost也加上
新建js文件创建一个js文件,并写入以下代码
12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115 ...
魔改-《侧边栏电子时钟》
安装NPM插件1npm install hexo-butterfly-clock-anzhiyu --save
如果有安装过其他的电子时钟,需要先卸载
1npm uninstall <package name>
_config.yml添加配置信息123456789101112131415161718192021# electric_clock# see https://blog.anheyu.com/posts/fc18.htmlelectric_clock: enable: true # 开关 priority: 5 #过滤器优先权 enable_page: all # 应用页面 exclude: # - /posts/ # - /about/ layout: # 挂载容器类型 type: class name: sticky_layout index: 0 loading: https://cdn.cbd.int/hexo-butterfly-clock-anzhiyu/lib/loading.gif #加载动画自定义 clock_ ...
魔改-《侧边栏那年今日》
安装NPM插件1npm i hexo-history-calendar --save
_config.yml添加配置信息123456789history_calendar: priority: 4 enable: true enable_page: all layout: type: class name: sticky_layout index: 0 temple_html: '<div class="card-widget card-history"><div class="card-content"><div class="item-headline"><i class="fas fa-clock fa-spin"></i><span>那年今日</span></div><div id="history-baidu" style="h ...
魔改-《随机跳转一篇文章》
安装NPM插件1npm install hexo-generator-baidu-sitemap --save
添加自定义js1234567891011function randomPost() { fetch('/baidusitemap.xml').then(res => res.text()).then(str => (new window.DOMParser()).parseFromString(str, "text/xml")).then(data => { let ls = data.querySelectorAll('url loc'); while (true) { let url = ls[Math.floor(Math.random() * ls.length)].innerHTML; if (location.href == url) continue; l ...
魔改-《首页双栏布局》
安装NPM插件1npm i hexo-butterfly-article-double-row --save
修改_config.yml12butterfly_article_double_row: enable: true
重新运行1hexo clean && hexo g && hexo s
魔改-《文章链接持久化》
安装NPM插件1npm install hexo-abbrlink --save
_config.yml添加配置信息123456789101112131415161718permalink: posts/:abbrlink/# 文章链接持久化# abbrlink configabbrlink: alg: crc32 #支持crc16(默认)和crc32 rep: hex #支持dec(默认)和hex drafts: false #(true)处理草稿,(false)不处理草稿。false(默认) # 从目录树生成类别 # depth: 要生成的目录树的最大深度,应大于0 auto_category: enable: true #true(默认) depth: #3(默认) over_write: false auto_title: false #启用自动标题,可按路径自动填充标题 auto_date: false #启用自动日期功能,可以按今天的时间自动填充日期 force: false #启用强制模式, ...
魔改-《网站加载动画》
头部插入css在主题配置文件里找到inject的head,添加一行link
123inject: head: - <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.1/css/all.css"> # loading用的fontawesome图标
新建pug文件在themes\butterfly\layout\includes\loading\里,新建文件clickenter.pug
12345678910111213141516171819202122232425262728293031#loading-box(onclick='document.getElementById("loading-box").classList.add("loaded")') #loading-box-me #wrapper #mouse .loader . ...
魔改-《GitHub贡献日历》
执行 npm 安装操作1npm i hexo-githubcalendar --save
修改_config.yml1234567891011121314151617181920# Ice Kano Plus_in# Hexo Github Canlendar# Author: Ice Kano# Modify: Lete乐特githubcalendar: enable: true priority: 3 enable_page: / user: your user name layout: type: id name: recent-posts index: 0 githubcalendar_html: '<div class="recent-post-item" style="width:100%;height:auto;padding:10px;"><div id="github_loading" style="height:100%;display: ...
魔改-《网站特殊日子置灰》
在js文件夹下面新建grayscale.js文件
inject到hexo里面(该步骤后续不再赘述)
编写grayscale.js代码1234567891011121314151617181920212223242526272829/* * @Description: 网站置灰 * @Author: 5t5 * @Time: 2023/12/7 15:37 */function PublicSacrificeDay() { // 你想要置灰的特殊日子的日期 let PSFarr = ["0403", "0512", "0707", "0918", "0930", "1213"]; let currentDate = new Date(); let mm = currentDate.getMonth() + 1; let dd = currentDate.getDate(); let str = `${mm < 10 ? ...
Blog结合GitHub Page部署
新建仓库这一步的作用主要是让自己的博客有一个远程仓库可以推送代码
打开github,登录自己的账号,并新建一个代码仓库
填写仓库名并创建,一定要勾选Add README
仓库名有严格的格式,一定要按照格式来,否则无法生成自己的页面,格式:<username>.github.io
设置部署仓库
进入代码内,打开_config.yml
在最后一行内设置自己的deploy,repo的设置根据自己仓库里面的SSH来,branch根据你的仓库默认分支来
配置SSH
因为是用ssh连接,所以需要配置一下ssh key
打开Git Bash
输入 cd ~/.ssh检测一下本地有没有ssh文件,如果有的话可以直接跳到第4步
没有的话需要创建ssh key
运行ssh-keygen -t rsa -C "your_email@example.com",后面的邮箱是你的github绑定的邮箱
运行完一直回车就可以
将创建好的key添加到github
拷贝 id_rsa.pub 文件的内容,你可以用编辑器打开文件复制,也可以用git命令复制该 ...
建站-《项目搭建、配置》
Hexo起步
首先,你需要起一个项目,新建博客的文件夹作为根目录
然后采用编辑器的终端进行命令行输入
安装项目
12345678npm config set registry https://registry.npmmirror.com#将npm源替换为阿里的镜像。之后的安装就会迅速很多了。npm install hexo-cli -g# hexo-cli 是 hexo的指令集。hexo init# 有了指令集以后,使用它的初始化指令来初始化安装Hexo博客。
安装插件
1234567891011121314npm install hexo-renderer-stylus --save# nib css支持插件,如无需求,可跳过npm install hexo-generator-feed --save# RSS订阅支持插件,如无需求,可跳过npm install hexo-generator-sitemap --save# sitemap生成插件,帮助搜索引擎抓取,如无需求,可跳过npm install hexo-admin --save# 网页端hexo文档管理插件,如无 ...