51工具盒子-
在主题配置的 inject 引入 js: https://cdn.jsdelivr.net/gh/xiabo2/CDN@latest/fishes.js
这里以butterfly主题为例：|---------------------------|-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------| |
1 2 3 4 5 6 7 8 9|# Inject # Insert the code to head (before '</head>' tag) and the bottom (before '</body>' tag) # 插入代码到头部 </head> 之前 和 底部 </body> 之前 inject: head: # - <link rel="stylesheet" href="/xxx.css"> bottom: - <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script> - <script src="https://cdn.jsdelivr.net/gh/xiabo2/CDN@latest/fishes.js"></script>| -
调整页脚阴影透明度
themes\butterfly\source\css\_layout\footer.styl|-----------|--------------------------------------------------| |
1|background-color: alpha($dark-black, .1)|文章页页脚宽度多余导致出现横向滚动条，新建 xxx.css，添加以下 css 引入 inject 即可（若设置了全局背景去掉固定高度 height: 160px 引入即可）
|-----------------------|---------------------------------------------------------------------------------------------------------------------------------| |
1 2 3 4 5 6 7|/* 鱼塘固定宽度 */ canvas:not(#ribbon-canvas), #web_bg { margin-bottom: -0.5rem; display: block; width: 100%; height: 160px }| -
themes\butterfly\source\css\_layout\footer.styl调整下 css (补充：调整页脚阴影透明度为 0.1)|------------------------------------------------------|---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------| |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18|#footer-wrap position: absolute padding: 1.2rem 1rem 1.4rem color: $light-grey text-align: center left: 0 right: 0 top:0 bottom: 0 #footer if hexo-config('footer_bg') != false &:before position: absolute width: 100% height: 100% background-color: alpha($dark-black, .1) content: ''| -
引用 JS 报错 Uncaught ReferenceError: $ is not defined
-
原因一：未引用 jquery 库 jquery.min.js 文件，或者说路径错误；
解决办法：
很简单，引用 jquery-X.X.X.min.js 这个 js 路径文件到当前页面即可。|-----------|------------------------------------------------------------------------------------| |
1|<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>|建议将 js 保存到本地引用
|-----------|----------------------------------------------------| |
1|<script src="你的路径/jquery.min.js"></script>| -
原因二：忽略了 HTML 中引入 jQuery 文件的顺序，要把 JQuery 库的引用放到第一个
<script>引用前面，这样顺序执行后面的 js 文件才能识别 $。
-
补充
还有一个更为简单的方法，引入带有颜色的页脚养鱼，只需要在_config.butterfly.yml文件中，找到inject，在bottom处直接引入：https://uuuuu.cf/js/fishes.js|-----------|----------------------------------------------------------------------------------| |
1|- <script defer src="https://uuuuu.cf/js/fishes.js"></script> # 页脚养鱼(彩色)|注意：该操作同样需要在之前引入jquery。
