Cnblogs博客皮肤开发调试最佳方案
Cnblogs博客园支持自定义js来美化站点(需要申请JS权限),可以将主题托管到自己的云资源或CDN加速节点节点上。
例如我的网站为 www.example.com
(IP或其它host),我将编译后的文件夹 dist
放到了网站的根目录。
这样我可以通过加载 https://www.example.com/dist/simpleMemory.js
来加载主题:
<script type="text/javascript">
window.cnblogsConfig = {
info: {
name: 'userName', // 用户名
startDate: '2021-01-01', // 入园时间,年-月-日。入园时间查看方法:鼠标停留园龄时间上,会显示入园时间
avatar: 'http://xxxx.png', // 用户头像
},
}
</script>
<script src="https://www.example.com/dist/simpleMemory.js" defer></script>
当主题需要自定义一些功能,发现不方便调试js脚本,要反复将生产包部署到服务器,来回操作繁琐复杂,现可以通过云开发方式来做调试。
开发环境 - 使用Codespaces调试开发
fork仓库后,如果没有云资源又想要调试代码,这时候可以尝试github推出的codespaces云IDE。
- 在github上创建一个codespaces
control + shift + ~
打开终端,执行命令语句npm run server
- 切换到端口面板, 右键链接地址,更改端口可见性为
public
- 打开链接地址,就能看到
dist
为目录的站点
- 最后在csblogs博客设置中,临时将script脚本地址替换
在codespaces编译后,在刷新博客园网站就能看到更改后的内容
github codespaces 每个月免费时长为120 core/h,2核数CPU可以使用60h。
打包后dist包部署到服务器。
生产环境 - 云服务器Docker容器化
注意
Cnblogs
是https站点,所以引入第三方资源的站点也必须是https
,详见https混合内容
1. 申请SSL证书(已有证书跳过此步骤)
以ZeroSSL申请证书为例, 面板中点击
New Certificate
,输入IP地址-选择90天免费证书
验证域名所有权,下载验证文件,替换仓库路径
./well-known/pki-validation
下的.txt文件
服务器中拉取仓库代码, 执行
docker-compose up -d
- ZeroSSL点击校验
2. 安装证书
- ZeroSSl下载的证书包,需要将模块包
ca-boundle.crt
和并到certificate.crt
中(手动扣过去就行),并替换仓库ssl
下的证书文件 - 服务器拉取最新代码,执行
docker-compose up -d --force-recreate --build --remove-orphans
Cnblogs博客皮肤开发调试最佳方案的更多相关文章
- 把cnblogs变成简书 - cnblogs博客自定义皮肤css样式
吐槽 博客园cnblogs作为老牌的IT技术博客类网站,为广大的开发者提供了非常不错的学习交流平台. 虽然博客内容才是重点,但是如果有赏心悦目的页面不更好吗! cnblogs可以更换博客模板,并且提供 ...
- 发布“豪情”设计的新博客皮肤-darkgreentrip
豪情 (http://www.cnblogs.com/jikey/)是一名在上海的前端开发人员,长期驻扎在园子里.他为大家设计了一款新的博客皮肤——darkgreentrip. 以下是该博客皮肤的介绍 ...
- 发布园友设计的新款博客皮肤BlueSky
园友#a为大家设计了一款“简单.纯粹,一点淡雅,一点宁静”的博客皮肤——BlueSky,欢迎您的享用!感谢#a的精心设计! 如果您有兴趣为大家设计博客皮肤,请将您设计的html/css/images文 ...
- [置顶] CSDN博客第三期云计算最佳博主评选
CSDN博客第二期云计算最佳博主排行圆满结束,恭喜所有上榜用户,为继续展示云计算方向的优秀博主,发掘潜力新星,为云计算方向的博客用户提供平台,CSDN博客第三期云计算最佳博主排行开始.同时,获奖者有机 ...
- org-mode 写 cnblogs 博客
1. 为什么用org-mode写博客 我最开始用Emacs, 是因为org-mode.这是一个专注于写,而让我忽略展示结果的一种写作方式.为 什么这么说?因为所有内容的格式都是可定制的.按照自己喜欢的 ...
- 发布新款博客皮肤SimpleMemory
感谢 sevennight 又为大家精心设计了一款简约风格的博客皮肤 —— SimpleMemory. 大家可以通过这篇博文感受一下实际的效果:开园子啦(浅谈移动端以及h5的发展) 如果您喜欢这款皮肤 ...
- 发布新博客皮肤red_autumnal_leaves
感谢sevennight为大家精心设计了一款博客皮肤——red_autumnal_leaves! [名称] red_autumnal_leaves[标题] 红叶[设计者] sevennight[简介] ...
- cnblogs博客申请完毕,以后再这里安家落户
cnblogs博客申请完毕,以后再这里安家落户,之前的博客就不转载了,好好搞技术,安稳过日子.
- 使用自己的域名解析cnblogs博客(CSDN也可以)
本文主要介绍怎样使用自己购买的域名指向cnblogs博客 通常来说技术人员都会创建个自己的技术博客,总结下工作中的问题,经验等等,不过某些博客的访问链接的确是不太容易记忆或者输入,对我们分享造成一定的 ...
- 使用自己的域名解析 cnblogs 博客
使用自己的域名解析 cnblogs 博客(博客园) 1.实现原理 用户访问 -> 阿里云解析 -> github page 跳转 -> 真实的博客地址 2.创建 github pag ...
随机推荐
- mysql忽略大小写配置
#更改配置文件:vim /etc/my.cnf#添加此行在[mysqld]下lower_case_table_names=1#重启服务systemctl restart mysqld
- 2022春每日一题:Day 31
题目:机器分配 设f[i][j]表示前i个机器,共分配了j个的最大值,枚举第i个机器分配个数,转移f[i][j]=max{f[i-1][k]+a[i][j-k]},此题只是加了个要输出 代码: #in ...
- 2.3 Goland快捷键
1 新建 Alt + Insert Alt + Enter 2 移动 Alt + 上下箭头:以函数为单位移动 Ctrl + G : 定位到行 Ctrl + W :可以选择单词继而语句继而行继而函数Ct ...
- i春秋Vld
进去就问我们懂不懂Vulcan Logic Dumper,然后下面是一个报false.我们查看源码,在源码的最后提示我们index.php.txt的存在,话不多说,直接访问试试. 出现一堆我们暂时还看 ...
- Training: WWW-Robots
原题链接:http://www.wechall.net/challenge/training/www/robots/index.php 打开网页他给我们说什么 说什么这是一个小挑战,你将会了解到机器人 ...
- SQL语句查询关键字前期数据准备
前期数据准备 create table emp( id int primary key auto_increment, name varchar(20) not null, gender enum(' ...
- Android ViewPager2 + Fragment 联动
Android ViewPager2 + Fragment 联动 本篇主要介绍一下 ViewPager2 + Fragment , 上篇中简单使用了ViewPager2 实现了一个图片的滑动效果, 那 ...
- Windows 安装 Zookeeper 详细步骤
Windows 安装 Zookeeper 详细步骤 一. Zookeeper 安装包下载 1.官网地址 Zookeeper官网 2.安装包下载 这里选择目前的稳定版 3.6.3 下载 可以看到有两个选 ...
- CVE-2020-1938与CVE-2020-13935漏洞复现
前言 最近在腾讯云上买了个服务器,准备用来学习.在安装了7.0.76的tomcat后,腾讯云提醒我存在两个漏洞,分别是CVE-2020-1938和CVE-2020-13935,在修复完漏洞后,准备复现 ...
- Redis数据结构与对象
参考<Redis设计与实现> 系列文章目录和关于我 一丶简单动态字符串 当redis需要的不仅仅是一个字符串字面量,而是一个可以被修改的字符串值时,就会使用SDS(simple dynam ...