加载中...

hexo博客搭建的基础配置

基础环境的搭建

尝试使用隐藏条

不是太美观,遂放弃

  1. 通过nvm[1]安装管理nodejsnpm;注意修改nodejs的镜像地址和设置全局环境变量。参考文章csdn Coderz1 nvm文档
  2. 更改npm镜像源;安装gitGitHub建立通信;全局安装hexo;初始化hexo项目;安装butterfly主题;部署到GitHub项目[2]。参考文章Fomalhaut-Hexo博客搭建基础教程(一) Fomalhaut-Hexo博客搭建基础教程(二)
  3. butterfly.config在blogroot备份配置;备份源码;备份素材
  4. 基于GitHub账号注册vercelnetlifycloudflare;购买域名

butterfly主题的简单配置

  1. 主题navfooter;主题图片相关;主题侧边栏;主题文章页;主题菜单栏;主题个人信息展示相关配置[3]。参考文章Fomalhaut-Hexo博客搭建基础教程(三
  2. 主题效果增强,本地搜索;injectpjax;全局字体和颜色;社交图标;加载动画等等

优化建议

  1. 静态资源加速,异步加载css和js;合并index.css;合并js[4]。参考文章akilar-Hexo博客静态资源加速
  2. 静态资源压缩,字体压缩;图片压缩;gulp代码压缩[5]。参考文章Fomalhaut-网站性能优化的一些小技巧
  3. 利用git action自动化部署减少渲染和部署时间,源码私有化仓库,网页开源[6]。参考文章akilar-使用Github Action实现全自动部署
  4. 利用git action搭建自动化npm资源库包,便于第三方加速[7]。参考文章akilar-使用github-action推送博客部署仓库至NPM
  5. 多平台部署静态仓库,分流多线路部署[8];巧用第三方CDN加速[9]。参考文章akilar-Hexo博客优化蓝图 张洪Heo-Butterfly CDN链接更改指南,替换jsdelivr提升访问速度 安知鱼-目前可用cdn整理

主题魔改之路

自定义系列

  1. 自定义nav,导航栏显示标题;自定义全局文字[10]。参考文章Ariasaka-关于Butterfly的导航栏的一些教程
  2. 自定义随机文章,采用baidu-sitemap的方式随机生成文章[11];自定义文章统计图和标签云。参考文章Leonus-随机访问一篇文章的实现
  3. 自定义鼠标样式;自定义鼠标悬停效果[12];参考文章Fomalhaut-博客魔改教程总结
  4. 自定义霓虹灯效果;自定义卡片样式亚克力模糊效果;自定义个人信息卡片渐变色;自定义背景特效(流星、雪花、樱花、树叶);自定义四适配背景图;参考文章Fomalhaut-博客魔改教程总结
  5. 自定义侧边栏一言卡片;自定义侧边栏今日诗词卡片[13];自定义顶部加载条;自定义小猫挂绳效果张洪Heo-Butterfly美化:今日诗词侧边栏小组件,中国传统诗词文化
  6. 自定义复制弹窗;自定义欢迎弹窗;自定义f12弹窗,禁用f12;自定义fps显示;自定义禁止右键菜单[14]怕冷爱上雪-hexo主题butterfly顶部复制提示弹窗

第三方轮子的使用

  1. hexo-abbrlink文章添加唯一链接;hexo-admin博客网页端编辑;hexo-blog-encrypt页面加密功能;hexo-filter-nofollow博客超链接防追踪;
  2. hexo-algoliasearch更换本地搜索;hexo-tag-aplayer音乐插件;hexo-butterfly-envelope留言板信封;live2d-widget-model-hijiki添加看板娘;hexo-filter-gitcalendarGitHub提交日历;hexo-butterfly-wowjs添加动画效果;tidio配置在线聊天服务
  3. hexo-butterfly-categories-card首页分类卡片;hexo-butterfly-swiper首页置顶轮播图;hexo-butterfly-tag-plugins-plus标签外挂;hexo-renderer-kramed更换渲染插件;
  4. 外挂标签的插入和使用[15]。 参考文章Fomal-Markdown语法与外挂标签写法汇总 本地记录

试错记录

  1. 子页面在本地可以显示在离线显示404
    解决:子页面需要目录下有index.md文件才能被渲染
  2. git action自动部署npm仓库可否手动或筛选push
    解决:可通过条件触发;on设置为push 特定tag时才触发
  3. 怎么建立博客门户页面
    解决:可通过新建仓库page页面cname二级域名的方式添加;亦同部署到三方平台绑定二级域名
  4. 境外访问博客国内cdn确极慢
    解决:同上新建博客CDN改为国外或直接GitHub本地绑定二级域名,境外通过二级域名访问博客
  5. 标签外挂中相册使用出现404
    解决:相册配置指向的是另一个子页面,子页面使用图片外挂
  6. 标签外挂中bubble效果出问题
    解决:CDN中版本号用latest改为1.0.17(最新版本),渲染插件识出问题就在md中直接用html源码endraw不渲染
  7. 使用CDN的metingjs后全局音乐插件失效
    解决:butterfly为了适配使用的是旧版本的metingjs
  8. 自己fork的gitcalendar接口失效
    解决:原作者的api失效,找到相同fork的用户更新的api内容,修改自己的
  9. import/*.css失效,并且import font.css失效
    解决:修改需要的css为styl,impot/;font.css单独import
  10. 自收集的网页源码不被主题渲染
    解决:在config中可设置skip render
文章作者: adongchong
文章链接: https://adongchong.xyz
版权声明: 此文章版权归adongchong所有,如有转载,请註明来自原作者
avatar
adongchong
尺素曾经寄去年,冬虫夏了早
天天下雨...
公告
主域名:adongchong.xyz
新人报道,一起努力
分流可访问:blog.adongchong.xyz
最新文章
Hello World
Hello World
markdwon样式
markdwon样式
网站资讯
文章数目 :
9
已运行时间 :
本站总字数 :
13.3k
本站访客数 :
本站总访问量 :
最后更新时间 :
一言
:D 获取中...
:D 获取中...