首頁文章使用新標簽頁打開

官方沒有提供解決方案，但是可以通過修改源碼的方式進行修改。
找到主題下的layout/includes/mixins/post-ui.pug，在第16行、第19行添加target="_blank"即可實現。

標簽、分類頁使用新標簽打開

官方沒有提供解決方案，但是可以通過修改源碼的方式進行修改。
找到主題下的layout/includes/mixins/article-sort.pug，在第19行添加target="_blank"即可實現。

魔改Valine評論【支持cave-draw畫圖】

準備工作

效果如圖，即可以在評論區使用畫圖工具：

插件項目地址：為你的評論表單添加一個畫圖板

進入項目第之后后，使用CTRL+F搜索Valine

【進入正題】

第一步：Valine.min.js操作

下載Valine.min.js，放在source下的一個目錄，我放的是npm/valine/dist/目錄，如圖：

下載完成之后，將該文件格式化一下，通過搜索工具搜索定位到如圖位置，并在函數的第一行添加：

if ("data:image/" == e.substr(0, 11)) return true;

在_config.yml文件中修改編譯跳過的文件(因為文件太長了，如果不跳過的話會被編譯，從而丟失后半段代碼)

修改完之后最好檢查一下localhost:4000/npm/valine/dist/Valine.min.js是否和源文件一樣。

第二步：修改主題代碼

找到主題目錄下的butterfly/layout/includes/third-party/comments/valine.pug文件，原文件這幅模樣：

- let emojiMaps = '""' if site.data.valine- emojiMaps = JSON.stringify(site.data.valine)script.function loadValine () {function initValine () {const valine = new Valine(Object.assign({el: '#vcomment',appId: '#{theme.valine.appId}',appKey: '#{theme.valine.appKey}',avatar: '#{theme.valine.avatar}',serverURLs: '#{theme.valine.serverURLs}',emojiMaps: !{emojiMaps},path: window.location.pathname,visitor: #{theme.valine.visitor}}, !{JSON.stringify(theme.valine.option)}))}if (typeof Valine === 'function') initValine() else getScript('!{url_for(theme.CDN.valine)}').then(initValine)}if ('!{theme.comments.use[0]}' === 'Valine' || !!{theme.comments.lazyload}) {if (!{theme.comments.lazyload}) btf.loadComment(document.getElementById('vcomment'),loadValine)else setTimeout(loadValine, 0)} else {function loadOtherComment () {loadValine()}}

需要修改成這樣：

- let emojiMaps = '""' if site.data.valine- emojiMaps = JSON.stringify(site.data.valine)script.new CaveDraw({ele: '#veditor',special: 'valine',openBtn: {style: 'background-color:#b37ba4;color:white;',hoverStyle: 'background-color: #49d0c0;'},canvasStyle: 'cursor:crosshair;background:whitesmoke;/*margin-bottom:5px;border-radius:0px;*/'})var valine = new Valine();valine.init({el: '#vcomment',appId: '#{theme.valine.appId}',appKey: '#{theme.valine.appKey}',avatar: '#{theme.valine.avatar}',serverURLs: '#{theme.valine.serverURLs}',emojiMaps: !{emojiMaps},path: window.location.pathname,visitor: #{theme.valine.visitor}});

在這個過程中，參數并沒有發生變化，只是改變了Valine實例創建的方式(從原來的構造更換成了new)。同時，在創建Valine實例前，創建CaveDraw對象。

在source/css/(沒有css目錄自行創建)目錄下創建cavedraw.css文件，內容如下：

.brush-detail p {line-height: 1em!important; } .v[data-class="v"] .veditor {max-height: 17em; }

修改_config.butterfly.yml配置文件(通過搜索找到對應的位置修改)：

inject:head:# - <link rel="stylesheet" href="/xxx.css">- <link rel="stylesheet" href="/css/cavedraw.css" >- <script src="https://cdn.jsdelivr.net/gh/flatblowfish/cave-draw/dist/cave-draw.min.js"></script>- <script src="/npm/valine/dist/Valine.min.js"></script>bottom:# - <script src="xxxx"></script>CDN:valine: /npm/valine/dist/Valine.min.js

完結撒花！！！！！！！

總結

以上是生活随笔為你收集整理的【源码级】butterfly魔改的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。