GitHub个人主页美化
效果展示展示为静态效果,动态效果请查看我的GitHub页面
创建GitHub仓库创建与GitHub用户名相同的仓库,当仓库名与用户名相同时,此仓库会被视作特殊仓库,其README.md(自述文件)会展示在GitHub个人主页,以我的GitHub举例,我GitHub用户名是gzzzxx,就要创建一个名为gzzzxx的仓库注意:此仓库须设置为公开状态!
顶部和底部动图
开源项目
页面顶部123<p align="center"><img src="https://capsule-render.vercel.app/api?type=waving&color=timeGradient&height=260&§ion=header&text=HI%20THERE&fontSize=90&fontAlign=50&fontAlignY=28&desc=I%20am%gzzzxx%F0%9F%98%81&descAlign=50&descSize=30&a ...
快速获取GitHub个人资料成就徽章
效果展示
成就徽章个人资料中可以选择是否显示成就徽章,Settings-Public profile,勾选Show Achievements on my profile。
徽章
名称
获取方式
Heart On Your Sleeve
使用 ❤️ 表情符号对 GitHub 上的内容做出反应 (正在测试中)
Open Sourcerer
用户已将 PR 合并到多个公共存储库中 (正在测试中)
Starstruck
创建一个有 16 颗星 或更多星 的仓库.
Quickdraw
在打开后 5 分钟内关闭问题或拉取请求.
Pair Extraordinaire
在 一个 或 更多 合并拉取请求中共同创作。
Pull Shark
2 个PR 或以上被合并.
Galaxy Brain
两个或两个以上的回答被标记为“答案”.
YOLO
在不进行代码审查的情况下合并 至少一个 PR.
Public Sponsor
通过 GitHub Sponsors 打赏开源项目.
Mars 2020 Contributor
向用于 Mars ...
Twikoo评论邮件回复模板
邮件样式PC端和移动端效果
[{"url":"https://image.gzzz.pro/image/202409091419679.jpg","alt":""},{"url":"https://image.gzzz.pro/image/202409091420622.jpg","alt":""}]
代码将网站图标更改为你自己网站图标图片的url地址。123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135 ...
Hexo博客私有部署Twikoo评论系统并迁移评论记录
部署之前一直使用的artalk,现在想改用Twikoo,采用私有部署的方式。
私有部署 (Docker)端口可以根据实际情况进行修改1docker run --name twikoo -e TWIKOO_THROTTLE=1000 -p 8100:8100 -v ${PWD}/data:/app/data -e TWIKOO_PORT=8100 -d imaegoo/twikoo访问localhost:8100,结果如下则表示部署成功12345{ "code": 100, "message": "Twikoo 云函数运行正常,请参考 https://twikoo.js.org/frontend.html 完成前端的配置", "version": "1.6.39"}成功后,如果有域名,使用nginx配置反向代理即可。
Butterfly配置打开butterfly的主题配置文件_config.yml,启用Twikoo123456789 ...
hexo-butterfly-tag-plugins-plus外挂标签
npm插件安装方案(推荐)源码修改配置方案
安装插件,在博客根目录[Blogroot]下打开终端,运行以下指令:1npm install hexo-butterfly-tag-plugins-plus --save
考虑到hexo自带的markdown渲染插件hexo-renderer-marked与外挂标签语法的兼容性较差,建议您将其替换成hexo-renderer-kramed12npm uninstall hexo-renderer-marked --savenpm install hexo-renderer-kramed --save
添加配置信息,以下为写法示例在站点配置文件_config.yml或者主题配置文件_config.butterfly.yml中添加123456789101112131415# tag-plugins-plus# see https://akilar.top/posts/615e2dec/tag_plugins: enable: true # 开关 priority: 5 #过滤器优先权 issues: false #issues标签依赖注入开 ...
使用MinIO+PicGo在服务器搭建图床
创建minio目录用于存放Minio可执行文件1mkdir /usr/local/minio
下载minio123456# 进入到/usr/local/miniocd /usr/local/minio# 执行下载wget https://dl.min.io/server/minio/release/linux-amd64/minio# 授权下载文件为可执行文件chmod +x minio
创建存储目录123456789# 新建data存储目录mkdir -p /home/minio/data# 新建log目录mkdir -p /home/minio/log# 创建日志文件touch /home/minio/log/minio.log# 授权chmod -R 777 /home/minio/datachmod -R 777 /home/minio/log
启动minio123456cd /usr/local/minio# 修改登录用户名、密码export MINIO_ROOT_USER=adminexport MINIO_ROOT_PASSWORD=admin# 后台启动,指定data存 ...
百度、谷歌、必应收录个人博客网站
介绍主要是给各个搜索引擎提交你的sitemap文件,让别人能搜到你博客的内容。
主题使用的Butterfly。
生成sitemap安装自动生成sitemap插件。12npm install hexo-generator-sitemap --savenpm install hexo-generator-baidu-sitemap --save在站点配置文件_config.yml或者主题配置文件_config.butterfly.yml中添加1234sitemap: path: sitemap.xmlbaidusitemap: path: baidusitemap.xml之后重新打包hexo g -d,如果在你的博客根目录下生成了sitemap.xml以及baidusitemap.xml就表示成功了,其中sitemap.xml文件是搜索引擎通用的文件,baidusitemap.xml是百度专用的sitemap文件。
sitemap地址就是域名加文件名https://www.example.com/sitemap.xml、https://www.example.com/baidusite ...
使用Cloudflare免费开启全站https配置SSL证书
HTTPS我的服务器和域名是在华为云,华为云SSL证书巨贵,通过Cloudflare可以将自己的网站免费设置成https。
Cloudflare注册访问Cloudflare, 注册账号。
添加站点添加你自己的站点,选择免费的套餐。
添加DNS添加你的域名、子域名、IP.
更改名称服务器在你注册域名的机构,将DNS服务器地址,改为Cloudflare提供的名称服务器地址。
修改成功之后,需要等待几个小时进行域名解析,我是等了一天左右,页面有一个立即检查名称服务器的功能,可以进行检测,成功后会显示。
设置安全性点击快速入门指南,设置安全性和性能。
设置SSL加密模式点击左侧SSL/TLS下的概述菜单,加密模式配置为灵活。
查看效果等待你的名称服务器解析成功后,就可以使用https访问你的网站啦!
Butterfly主题文章标题改成转动小风车
小风车效果颜色可参考本文章标题效果,标题级别不同小风车颜色不同,鼠标移入会有转动变慢及变色效果。
新建css建议在/source下创建诸如img/css/js等文件夹,存放文章或网站用的素材,分门别类后续也方便维护。
Hexo打包的时候,会自动把/source下的文件,包含到网站静态文件中去。
引入自定义css在站点配置文件/_config.butterfly.yml中,搜索定位到inject,插入以下内容:1234inject: head: # - <link rel="stylesheet" href="/xxx.css"> - <link rel="stylesheet" href="/css/custom.css">这样,后续所有样式的自定义,就可以在/source/css/custom.css文件中进行,避免改源码,以免后续更新变得复杂。
标题美化-加小风车样式会改变ol、ul、h1-h5的样式
field配置生效的区域
post只在文章页生效
site ...
Butterfly主题添加动画加载效果
安装插件安装插件,在博客根目录下打开终端,运行以下指令:1npm install hexo-butterfly-wowjs --save
添加配置添加配置信息,以下为写法示例在站点配置文件_config.yml或者主题配置文件_config.butterfly.yml中添加12345678910111213141516wowjs: enable: true #控制动画开关。true是打开,false是关闭 priority: 10 #过滤器优先级 mobile: false #移动端是否启用,默认移动端禁用 animateitem: - class: recent-post-item #必填项,需要添加动画的元素的class style: animate__zoomIn #必填项,需要添加的动画 duration: 1s #选填项,动画持续时间,单位可以是ms也可以是s。例如3s,700ms。 delay: 0s #选填项,动画开始的延迟时间,单位可以是ms也可以是s。例如3s,700ms。 offset: 100 #选填项,开始动 ...