search

jerryc127 / hexo-theme-butterfly

🦋 A Hexo Theme: Butterfly
https://butterfly.js.org
Apache License 2.0
7.06k stars 1.28k forks source link

您好博主请教，使用起来感觉有点卡顿 #69

Closed longlivemylove closed 4 years ago

longlivemylove commented 4 years ago

您好，博主，www.longlivemylove.com 我根据文档搭建了博客网址，但是使用起来感觉有点卡顿，请教下是我图片加载的问题导致的吗？我把图床放在了新浪微博图床。您是怎么存放的图片？

longlivemylove commented 4 years ago

Main menu navigation

---------------

format: xxx: 連結 || icon

sub-menu

xxx || icon:

xxx || 連結 || icon

menu: 主页: / || fa fa-home 关于: /about/ || fa fa-heartbeat 时间轴: /archives/ || fa fa-history 标签: /tags/ || fa fa-tags 分类: /categories/ || fa fa-bars 导航: /sitemap/ || fa fa-space-shuttle

Favicon

---------------

favicon: /img/favicon.png

PWA

See https://github.com/JLHwung/hexo-offline

---------------

pwa:

enable: true

manifest: /img/pwa/manifest.json

theme_color: "#fff"

apple_touch_icon: /img/pwa/apple-touch-icon.png

favicon_32_32: /img/pwa/32.png

favicon_16_16: /img/pwa/16.png

mask_icon: /img/pwa/safari-pinned-tab.svg

Highlight theme

---------------

highlight_theme: light highlight_copy: true #代碼複製按鈕 highlight_lang: false #代碼語言顯示 highlight_shrink: false #代碼框不展開，需點擊 '>' 打開

code_word_wrap: false

copy setting

是否禁止複製（如果禁止，highlight_copy的功能將無效)

copyright 複製的内容後面加上版權信息

copy: enable: false # true 開啓 / false 禁止 copyright: false

social settings

formal:

icon: link

---------------

social: fa fa-instagram: https://instagram.com/yourname fa fa-github: https://github.com/yourname fa fa-youtube-play: https://www.youtube.com/?hl=zh-CN

search

Algolia search

---------------

algolia_search: enable: false hits: per_page: 6

labels: input_placeholder: Search for Posts hits_empty: "We didn't find any results for the search: ${query}" # if there are no result hits_stats: "${hits} results found in ${time} ms"

Local search

Please see doc for more details: https://jerryc.me/posts/21cfbf15/#本地搜索

---------------

local_search: enable: false labels: input_placeholder: Search for Posts hits_empty: "We didn't find any results for the search: ${query}" # if there are no result

MathJax

Please see doc for more details: https://jerryc.me/posts/21cfbf15/#MathJax

---------------

mathjax: enable: false

KaTeX

---------------

katex: enable: false hide_scrollbar: true

Analysis

---------------

baidu_analytics:

Google Analytics

google_analytics:

Post info settings

---------------

avatar: /img/avatar.png

avatar: https://ws1.sinaimg.cn/large/d59cce03ly1g8qgrkr0vcj20jg0jgq3z.jpg

the banner image of index

top_img: https://ws1.sinaimg.cn/large/d59cce03ly1g8qgsc3v94j24n433kkay.jpg

以下鏈接是動態壁紙，每次刷新會更換

https://source.unsplash.com/collection/collectionid/1600x900

https://uploadbeta.com/api/pictures/random/?key=BingEverydayWallpaperPicture

https://api.dujin.org/bing/1920.php

https://api.dujin.org/bing/1366.php

if the banner of page not setting,it will show the top_img

default_top_img: https://ws1.sinaimg.cn/large/d59cce03ly1g8qgsc3v94j24n433kkay.jpg

the default cover of the post

default_cover: https://ws1.sinaimg.cn/large/d59cce03ly1g8qgth4w8lj218g0p0dnc.jpg

the banner image of archive page

archive_img: https://ws1.sinaimg.cn/large/d59cce03ly1g8qhu5w50vj23344mox6r.jpg

the banner image of tag page

tag_img: https://ws1.sinaimg.cn/large/d59cce03ly1g8ql5ur5xwj24n433k4qp.jpg

the banner image of category page

category_img: https://ws1.sinaimg.cn/large/d59cce03ly1g8ql91fn0oj21z41407nl.jpg

如果你有使用hexo-douban去生成movie界面，可配置這個

movies_img: https://cdn.jsdelivr.net/gh/jerryc127/CDN/Photo/movie.jpg

if the photo link cannot connect,it will show that

lodding_bg: flink: /img/friend_404.gif post_page: /img/404.jpg

post_meta: date_type: both # or created or updated 文章日期是创建日或者更新日或都显示 categories: true # or false 是否显示分类 tags: true # or false 是否显示标签

Please see doc for more details: https://jerryc.me/posts/21cfbf15/#字数统计

wordcount: enable: false

toc: enable: true number: true

auto open the sidebar in 'post'

auto_open_sidebar: enable: true

post_copyright: enable: false license: CC BY-NC-SA 4.0 license_url: https://creativecommons.org/licenses/by-nc-sa/4.0/

自動節選

auto_excerpt: enable: false length: 150

Share System

-----------------------------------------

addThis: enable: false pubid:

sharejs: enable: true sites: facebook,twitter,wechat,weibo,qq

https://www.addtoany.com/

addtoany: enable: false item:

Comments System

------------------------------------

disqus: enable: false shortname:

laibili:

enable: false

uid:

gitalk:

enable: false

client_id:

client_secret:

repo:

owner:

admin:

language: # en , zh-CN , zh-TW

Using this js for redirect to gitalk container after login

See https://github.com/gitalk/gitalk/issues/125

js: https://cdn.jsdelivr.net/gh/upupming/gitalk@36368e5dffd049e956cdbbd751ff96c28d8255cf/dist/gitalk.min.js

valine comment system. https://valine.js.org

valine: enable: false # if you want use valine,please set this value is true appId: # leancloud application app id appKey: # leancloud application app key notify: false # valine mail notify (true/false) https://github.com/xCss/Valine/wiki verify: false # valine verify code (true/false) pageSize: 10 # comment list page size avatar: monsterid # gravatar style https://valine.js.org/#/avatar lang: en # i18n: zh-cn/en placeholder: Please leave your footprints # valine comment input placeholder(like: Please leave your footprints ) guest_info: nick,mail,link #valine comment header info bg: /img/comment_bg.png # valine background

Footer Settings

------------------------------------

since: 2019年10月01日

footer_custom_text:

footer_copyright: enable: false

ICP: enable: false url: text: icon: /img/icp.png

站長驗證

Google Webmaster tools verification setting

See: https://www.google.com/webmasters/

google_site_verification:

Bing Webmaster tools verification setting

See: https://www.bing.com/webmaster/

bing_site_verification:

Baidu Webmaster tools verification setting

See: https://ziyuan.baidu.com/site/

baidu_site_verification:

360 Webmaster tools verification setting

see http://zhanzhang.so.com/

qihu_site_verification:

友情鏈接界面設置

Flink: headline: 友情鏈接 info_headline: 我的Blog資料 name: Blog 名字： JerryC address: Blog 地址： https://jerryc.me/ avatar: Blog 頭像： https://jerryc.me/img/avatar.png info: Blog 簡介： 今日事,今日畢 comment: 如果需要交換友鏈,請留言

打赏按钮

reward: enable: false QR_code:

推薦文章

related_post: enable: true limit: 6 # 顯示推薦文章數目

美化/效果

--------------------------------

Theme color for customize

Notice: color value must in double quotes like "#000" or may cause error!

---------------

theme_color:

enable: true

main: "#49B1F5"

paginator: "#00c4b6"

button_hover: "#FF7242"

text_selection: "#00c4b6"

link_color: "#99a9bf"

meta_color: '#858585'

hr_color: "#A4D8FA"

read-mode-bg_color: '#FAF9DE'

inline-code-color: '#F47466'

主頁設置

默認top_img全屏，site_info在中間

使用默認, 都無需填寫（建議默認）

index_site_info_top: #主頁標題距離頂部距離 例如 300px/300em/300rem/10% index_top_img_height: #主頁top_img高度 例如 300px/300em/300rem 不能使用百分比

category和tag頁的UI設置

index 值代表 UI將與首頁的UI一樣

默認跟archives頁面UI一樣

category_ui: # 留空或index tag_ui: # 留空或index

設置網站背景

可設置圖片 或者 顔色

圖片格式 background: url(http://xxxxxx.com/xxx.jpg)

顔色 background: '#49B202'

留空 顯示白色

background:

footer是否顯示圖片背景(與top_img一致)

footer_bg: true

背景特效

避免卡頓，建議只開啓一個

canvas_ribbon 禁止彩帶背景

See: https://github.com/hustcc/ribbon.js

canvas_ribbon: enable: false size: 150 alpha: 0.6 zIndex: -1 click_to_change: false mobile: false # false 手機端不顯示 true 手機端顯示

動態彩帶

canvas_ribbon_piao: enable: false mobile: false # false 手機端不顯示 true 手機端顯示

canvas_nest

https://github.com/hustcc/canvas-nest.js

canvas_nest: enable: false color: '0,0,255' #color of lines, default: '0,0,0'; RGB values: (R,G,B).(note: use ',' to separate.) opacity: 0.7 # the opacity of line (0~1), default: 0.5. zIndex: -1 # z-index property of the background, default: -1. count: 99 # the number of lines, default: 99. mobile: false # false 手機端不顯示 true 手機端顯示

打字效果

activate_power_mode: enable: false

鼠標點擊效果

避免卡頓，建議只開啓一個

點擊烟火特效

fireworks: enable: false

點擊出現愛心

click_heart: enable: true

點擊出現文字，文字可自行修改

ClickShowText: enable: false text:

頭像會一直轉圈

avatar_effect: false

網站顯示模式

light 默認模式

dark 黑暗模式（不建議）

display_mode: light

美化post頁顯示

post_beautify: enable: false title-prefix-icon: '\f0c1' title-prefix-icon-color: "#F47466"

全局字體

font: enable: false font-family: Lato, Helvetica Neue For Number, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, PingFang SC, Hiragino Sans GB, MicrMicrosoft YaHei", Helvetica Neue, Helvetica, Arial, sans-serif code-font: consolas, Menlo, "PingFang SC", "Microsoft YaHei", monospace, Helvetica Neue For Number

網站名字字體

左上角網站名字 主頁居中網站名字

blog_title_font: font_link: https://fonts.googleapis.com/css?family=Titillium+Web #字體鏈接 font-family: Titillium Web, PingFang SC, Hiragino Sans GB, "Microsoft YaHei", Helvetica Neue, Helvetica, Arial, sans-serif

水平分隔綫

hr: enable: false icon: '\f21c' #fontawesome上圖標的Unicode icon-top: -20px

主頁subtitle

打字效果

subtitle: enable: true

source調用第三方服務

source: false 關閉調用

source: 1 調用金山詞霸的每日一句（簡體）

source: 2 調用一言网的一句話（簡體） #https://hitokoto.cn/

source: 3 調用一句网（簡體） http://yijuzhan.com/

source: 4 調用今日詩詞（簡體） https://www.jinrishici.com/

subtitle 會先顯示 source , 再顯示 sub 的内容

source: false

(如果有英文逗號' , '，請使用轉義字符 ,)

sub:

側邊欄

-------------------------------------

側邊欄顯示設置

aside: position: right # left or right card_author: true card_announcement: true card_recent_post: true card_categories: true card_tags: true card_archives: true card_webinfo: true

網站公告

announcement: content: Thank you for visiting my website.

busuanzi count for PV / UV in site

訪問人數

busuanzi: site_uv: true site_pv: true page_pv: true

網頁開通時間

格式: 月/日/年 時間

也可以寫成 年/月/日 時間

runtimeshow: enable: true start_date: 10/1/2019 00:00:00

右下角按鈕

----------------------------------------------

簡繁轉換

translate: enable: false

默認按鈕顯示文字

default: 繁

网站默认语言，1: 繁體中文, 2: 简体中文

defaultEncoding: 2

延迟时间,若不在前, 要设定延迟翻译时间, 如100表示100ms,默认为0

translateDelay: 0

博客网址

cookieDomain: "https://longlivemylove.com/"

當文字是簡體時，按鈕顯示的文字

msgToTraditionalChinese: "繁"

當文字是繁體時，按鈕顯示的文字

msgToSimplifiedChinese: "简"

閲讀模式

readmode: enable: false

夜間模式

darkmode: enable: false

自動切換 dark mode和 light mode

autoChangeMode: 1 跟隨系統而變化，不支持的瀏覽器/系統將按照時間晚上6點到早上6點之間切換為 dark mode

autoChangeMode: 2 只按照時間晚上6點到早上6點之間切換為 dark mode

autoChangeMode: false 取消自動切換

autoChangeMode: false

other

------------------------------------------------

圖片大圖查看模式

默認為 fancybox http://fancyapps.com/fancybox/3/

可以選擇改爲 medium_zoom https://github.com/francoischalifour/medium-zoom

medium_zoom: enable: false

Snackbar 彈窗

https://github.com/polonel/SnackBar

position 彈窗位置

可選 top-left / top-center / top-right / bottom-left / bottom-center / bottom-right

snackbar: enable: false position: bottom-left bg_light: '#49b1f5' #light mode時彈窗背景 bg_dark: '#2d3035' #dark mode時彈窗背景

百度推送

baidu_push: enable: false

https://instant.page/

prefetch預加載

instantpage: enable: true

Note (Bootstrap Callout)

https://muse.theme-next.org/docs/tag-plugins/note

note:

Note tag style values:

- simple bs-callout old alert style. Default.

- modern bs-callout new (v2-v3) alert style.

- flat flat callout style with background, like on Mozilla or StackOverflow.

- disabled disable all CSS styles import of note tag.

style: flat icons: true border_radius: 3

Offset lighter of background in % for modern and flat styles (modern: -12 | 12; flat: -18 | 6).

Offset also applied to label tag variables. This option can work with disabled note tag.

light_bg_offset: 0

圖片懶加載

https://github.com/aFarkas/lazysizes

lazyload: enable: true

避免重複網址分散seo

canonical: true

禁止百度轉碼

disable_baidu_transformation: true

twitter分享自動帶上樣式

https://i.loli.net/2019/09/08/qm3RfvUCKbct1Wz.png

twitter_meta: true

facebook QQ 等 分享自動帶上樣式

https://i.loli.net/2019/09/08/2wbFJEKloisRvhj.png

Open_Graph_meta: true

CDN

網站必須

可根據需要自行添加js/css

CDN_USE: css:

CDN

非必要不要修改

CDN:

comments

blueimp_md5: https://cdn.jsdelivr.net/npm/blueimp-md5@2.10.0/js/md5.min.js gitalk: https://cdn.jsdelivr.net/npm/gitalk@latest/dist/gitalk.min.js gitalk_css: https://cdn.jsdelivr.net/npm/gitalk/dist/gitalk.min.css valine: https://cdn.jsdelivr.net/npm/valine/dist/Valine.min.js

share

addtoany: https://static.addtoany.com/menu/page.js sharejs: https://cdn.jsdelivr.net/npm/social-share.js@1.0.16/dist/js/social-share.min.js sharejs_css: https://cdn.jsdelivr.net/npm/social-share.js@1.0.16/dist/css/share.min.css

search

algolia_search: https://cdn.jsdelivr.net/npm/instantsearch.js@2.1.1/dist/instantsearch.min.js algolia_search_css: https://cdn.jsdelivr.net/npm/instantsearch.js@2.1.1/dist/instantsearch.min.css algolia_js: /js/search/algolia.js local_search: /js/search/local-search.js

mathjax: https://cdn.jsdelivr.net/npm/mathjax/MathJax.js?config=TeX-AMS-MML_HTMLorMML katex: https://cdn.jsdelivr.net/npm/katex@latest/dist/katex.min.css katex_copytex: https://cdn.jsdelivr.net/npm/katex-copytex@latest/dist/katex-copytex.min.js katex_copytex_css: https://cdn.jsdelivr.net/npm/katex-copytex@latest/dist/katex-copytex.min.css

不蒜子計數器

busuanzi: //busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js

背景特效

canvas_ribbon: /js/third-party/canvas-ribbon.js # https://cdn.jsdelivr.net/gh/jerryc127/butterfly_cdn@latest/js/canvas-ribbon.js canvas_ribbon_piao: /js/third-party/piao.js # https://cdn.jsdelivr.net/gh/jerryc127/butterfly_cdn@latest/js/piao.js canvas_nest: /js/third-party/canvas-nest.js # https://cdn.jsdelivr.net/gh/jerryc127/butterfly_cdn@latest/js/canvas-nest.js

lazyload: https://cdn.jsdelivr.net/npm/lazysizes@latest/lazysizes.min.js instantpage: https://cdn.jsdelivr.net/npm/instant.page@latest/instantpage.min.js

typed: https://cdn.jsdelivr.net/npm/typed.js js_cookies: https://cdn.jsdelivr.net/npm/js-cookie/dist/js.cookie.min.js

fancybox_css: https://cdn.jsdelivr.net/npm/@fancyapps/fancybox@latest/dist/jquery.fancybox.min.css fancybox: https://cdn.jsdelivr.net/npm/@fancyapps/fancybox@latest/dist/jquery.fancybox.min.js #/js/third-party/jquery.fancybox.min.js medium_zoom: https://cdn.jsdelivr.net/npm/medium-zoom/dist/medium-zoom.min.js

snackbar_css: https://cdn.jsdelivr.net/npm/node-snackbar@0.1.15/dist/snackbar.min.css snackbar: https://cdn.jsdelivr.net/npm/node-snackbar@0.1.15/dist/snackbar.min.js

鼠标点击特效

anime: https://cdn.jsdelivr.net/npm/animejs@latest/anime.min.js #/js/third-party/anime.min.js activate_power_mode: /js/third-party/activate-power-mode.js # https://cdn.jsdelivr.net/gh/jerryc127/butterfly_cdn@latest/js/activate-power-mode.js fireworks: /js/third-party/fireworks.js # https://cdn.jsdelivr.net/gh/jerryc127/butterfly_cdn@latest/js/fireworks.js click_heart: /js/third-party/click_heart.js # https://cdn.jsdelivr.net/gh/jerryc127/butterfly_cdn@latest/js/click_heart.js ClickShowText: /js/third-party/ClickShowText.js # https://cdn.jsdelivr.net/gh/jerryc127/butterfly_cdn@latest/js/ClickShowText.js

translate: /js/tw_cn.js runtimeshow: js/runtimeshow.js

我得配置