這是我改的第二個(gè) WordPress 主題，前后花了大半年的時(shí)間，選擇在博客一周年的時(shí)候開(kāi)源出來(lái)算是一個(gè)紀(jì)念。從一年前技術(shù)為零走到今天，最該感謝的就是各個(gè)開(kāi)源項(xiàng)目和教程，我深深體會(huì)到了開(kāi)源精神的力量，所以這也算是對(duì)開(kāi)源社區(qū)的微小貢獻(xiàn)吧。主題經(jīng)過(guò)測(cè)試，WordPress 全新安裝的情況下可直接使用，后臺(tái)的設(shè)置面板可滿足正常使用需要，無(wú)需手動(dòng)修改代碼。
- 主題演示：詳情
本主題在 Louie 基于 Fuzzz 的 Akina 主題修改的主題 Siren 基礎(chǔ)上三次修改，顯然與前輩比起來(lái)，我唯一的貢獻(xiàn)就是把他們的代碼搞得亂七八糟了吧 =.=
全新重構(gòu)版
I. 特性
隨機(jī)封面圖
內(nèi)帶了一個(gè)返回隨機(jī)圖片的 API，把想要展示的圖放到 /cover/gallery 中即可。
Lazyload
使用了開(kāi)源庫(kù) jQuery-Lazyload，按需加載圖片，優(yōu)先加載縮略圖或占位圖，當(dāng)圖片顯示在 viewport 上時(shí)才加載原圖，提升網(wǎng)頁(yè)加載速度。 另外首頁(yè)文章列表設(shè)計(jì)了一個(gè)向上浮現(xiàn)的效果，算我最滿意的一個(gè)小 trick~
文章封面視頻
可將視頻設(shè)為文章封面，支持 hls 流視頻。使用說(shuō)明見(jiàn)主題 wiki。
定制登陸及后臺(tái)界面
后端登陸界面及 Dashboard 美化（配色方案 Sakura），你也可以自行設(shè)計(jì)配色方案（請(qǐng)留意“后臺(tái)配置”頁(yè)面下的說(shuō)明），同時(shí)也有配合 pjax 實(shí)現(xiàn)的前端登陸，前端登陸需自行用模板創(chuàng)建新頁(yè)面（page）。
支持 Bilibili 表情
后端請(qǐng)按提示切換后臺(tái)為明亮主題（個(gè)人資料頁(yè)切換），否則評(píng)論管理頁(yè)將出現(xiàn)表情鬼畜。
QQ/Gravatar 頭像
如果輸入了 QQ 號(hào)，留言將拉取 QQ 頭像，如果 QQ 號(hào)不存在或者是輸入了郵箱，將拉取 Gravatar 頭像。QQ 頭像接口和 Gravatar 鏡像都由我這邊提供。
評(píng)論插圖
該功能支持多個(gè)圖床的接口的選擇，目前支持的有 SM.MS、Imgur、Chevereto，使用前請(qǐng)?jiān)谥黝}設(shè)置中配置相應(yīng)的代理和API Key。 注意：目前此功能需要 PHP 開(kāi)啟 curl 支持，同時(shí) Nginx/Apache 需要允許 POST 請(qǐng)求。
用戶 UA 及 IP 定位
使用純真 IP 數(shù)據(jù)庫(kù)。對(duì)了，還有一個(gè)高仿 Bilibili 的等級(jí)系統(tǒng)，有空還打算再寫(xiě)一個(gè)頭飾模塊。
文章目錄
使用了開(kāi)源項(xiàng)目 tocbot，在需要目錄的文章任意位置輸入 [toc] 啟用。文章首字的大寫(xiě)使用方法：把首字放到 [begin] 和 [/begin] 之間。
Mac 風(fēng)格代碼塊
代碼高亮渲染使用的是 highlightjs。代碼塊可全屏，你發(fā)現(xiàn)了嗎？ 建議通過(guò) Markdown 語(yǔ)法寫(xiě)作以便代碼塊正常顯示，代碼高亮支持二十多種常見(jiàn)編程語(yǔ)言。
前端主題切換
這部分函數(shù)寫(xiě)得有些凌亂，打算以后有空重構(gòu)一下，可留意主題的更新。字體請(qǐng)留意注意事項(xiàng)。
時(shí)光軸
使用了?Shawn?的設(shè)計(jì)。
相冊(cè)
基于 fancybox 實(shí)現(xiàn)的相冊(cè)功能，使用說(shuō)明見(jiàn)主題 wiki。
郵件模板
Aplayer/HermitX 支持
修改了 APlayer 的部分樣式，文章內(nèi)插入音樂(lè)可使用 Hermit X 插件。
CDN 優(yōu)化
CDN 優(yōu)化 因?yàn)樽约翰┛兔刻煸L問(wèn)量較大（日均 PV 3000左右），所以為了減少請(qǐng)求數(shù)及流量，以此控制 CDN 費(fèi)用（每天0.2元左右），針對(duì)性地做了 CDN 優(yōu)化：主要是合并請(qǐng)求，并把不同類型的資源分配到不同的域名上，這些在后臺(tái)界面可以調(diào)整。其他內(nèi)容相對(duì)固定的資源，如貼圖和前端庫(kù)都放到了 jsDeliver 的公共庫(kù)上。
Github Cards
可通過(guò)短代碼添加： [github repo="mashirozx/Sakura"]
移動(dòng)客戶端
借助 PJAX 異步加載，便于基于 WebView 開(kāi)發(fā)高性能的移動(dòng)客戶端，切換頁(yè)面時(shí)無(wú)刷新，可以獲得接近 Native 的響應(yīng)速度。具體可以體驗(yàn)我的安卓客戶端。
II. 注意事項(xiàng)
重要★★：
主題下載后請(qǐng)把文件夾名字改回 Sakura，也即，保證主題路徑為 wp-content/themes/Sakura/。
啟用新主題/插件前備份數(shù)據(jù)庫(kù)是一個(gè)良好的習(xí)慣。雖然我保證主題不可能損壞你的數(shù)據(jù)，但是畢竟數(shù)據(jù)無(wú)價(jià)，對(duì)吧？
建議安裝的插件☆
我也在使用的插件
- WP Statistics，統(tǒng)計(jì)插件，主題可選擇其接口以作頁(yè)面訪問(wèn)計(jì)數(shù)。
- Login LockDown，登陸嘗試限制，避免前端登陸爆破。
- Wordfence Security，避免爆破和評(píng)論注入。提醒：該插件將在數(shù)據(jù)庫(kù)中記錄訪客信息，數(shù)據(jù)庫(kù)體積將略有增大。
- Akismet Anti-Spam，垃圾評(píng)論過(guò)濾。
- AMP，生成AMP 頁(yè)面，效果就是這樣，有利于提升 Google 排名。
- Autoptimize，頁(yè)面壓縮。
- Glue for Yoast SEO & AMP，AMP 增強(qiáng)，需配合 Yoast SEO 及 AMP 插件使用。
- WP Super Cache，頁(yè)面緩存，為訪客自動(dòng)生成緩存版網(wǎng)頁(yè)，提升訪問(wèn)速度。
- Yoast SEO，搜索引擎優(yōu)化。
其他插件我沒(méi)用過(guò)，不保證兼容性。
兼容性
- 服務(wù)器端 WordPress 版本：4.8+
- PHP 版本：7.1+
前端
兼容主流 Chromium 內(nèi)核瀏覽器、FireFox 瀏覽器。不兼容 IE （360、QQ 等雙核瀏覽器請(qǐng)關(guān)閉 IE 模式）。
寫(xiě)作規(guī)范
主題遵循 HTML5 規(guī)范，正文部分樣式完全兼容標(biāo)準(zhǔn) Markdown 語(yǔ)法，因此也建議配合 WP Editor.md 插件使用 Markdown 寫(xiě)作，可參考《Markdown 編輯器語(yǔ)法指南》。
主題演示站有一篇 Markdown 語(yǔ)法展示，文章源碼在這里。
API
下面是一些主題內(nèi)已經(jīng)帶有的接口，無(wú)需重復(fù)構(gòu)建：
Cookie：see https://2heng.xin/2018/05/12/add-a-version-control-for-cookies/ 后續(xù)會(huì)考慮添加更多接口。
III. FAQ
1. 為什么開(kāi)源的主題和這個(gè)博客不完全一樣？
我的博客上還有一些個(gè)性化的內(nèi)容，因?yàn)椴⒉皇撬腥硕紩?huì)需要，一方面影響主題性能，另一方面為了開(kāi)源還需為些部分添加開(kāi)關(guān)和選項(xiàng)，耗費(fèi)時(shí)間且沒(méi)意義，所有這些內(nèi)容在開(kāi)源的主題中都已移除。
如果你有喜歡，f12 隨便抄，我沒(méi)意見(jiàn)~ PS. 其實(shí)本站主題已經(jīng)很久沒(méi)有更新了，開(kāi)源版主題中反而有更多新功能的。
(￣▽￣)" 標(biāo)準(zhǔn)主題演示在這里。
2. 前端代碼塊/WP 5.3 后臺(tái)崩壞？
原先推薦的 WP Editor.md 插件在 WP ５.３ 中存在嚴(yán)重的兼容性問(wèn)題。目前最新版主題已經(jīng)對(duì)評(píng)論部分做了處理，不再需要依賴該插件，所以如果更新到了 WP 5.3，請(qǐng)停用此插件。至于正文 Markdown 寫(xiě)作，目前沒(méi)有好的方案，可以先用其他 Markdown 編輯器書(shū)寫(xiě)并轉(zhuǎn)成 HTML，再粘貼進(jìn) WordPress。
3. 主題設(shè)置開(kāi)關(guān)未生效？
啟用主題后先點(diǎn)一次保存。
4. 時(shí)差問(wèn)題
后臺(tái)主題設(shè)置界面里添加了一個(gè)時(shí)差調(diào)節(jié)選項(xiàng)。
5. 插入全屏瀏覽的圖片？
參見(jiàn)?主題 wiki。
6. 使用了CDN后評(píng)論定位不正確？
如果使用了 CDN 請(qǐng)?jiān)?WordPress 根目錄的配置文件 wp-config.php 最后加上這段：
if (isset($_SERVER['HTTP_X_FORWARDED_FOR'])) {
$list = explode(',', $_SERVER['HTTP_X_FORWARDED_FOR']);
$_SERVER['REMOTE_ADDR'] = $list[0];
}
網(wǎng)站建議都加上 CDN 以避免暴露服務(wù)器IP和被攻擊的風(fēng)險(xiǎn)；可以使用 CloudFlare 的免費(fèi) CDN。
7. 兼容 IE 及 360 極速瀏覽器
前者太太太太舊啦，不考慮適配，不過(guò) IE 瀏覽器可以看到一個(gè)友好的彈窗提醒。后者，明明是 IE 內(nèi)核卻要拼命偽裝成 Chrome 內(nèi)核，我能怎么辦呢？
8. 文章頁(yè)頁(yè)首裝飾圖（Feature Image）
后臺(tái)文章/頁(yè)面編輯器中有一個(gè)設(shè)置特色圖（Feature Image）的窗口，每篇文章/頁(yè)面需要單獨(dú)設(shè)置，沒(méi)有設(shè)置時(shí)默認(rèn)為空白。這不是 bug，因?yàn)椴⒉皇敲科恼露夹枰b飾圖，視頻教程。
最后，關(guān)于 bug 反饋
在提出你認(rèn)為的 bug 之前，可先用這里的 Windows 調(diào)試環(huán)境（里面的主題版本是很早以前的了，請(qǐng)手動(dòng)更新一下）復(fù)現(xiàn)出該問(wèn)題；如果愿意幫我修改，歡迎提交 Pull request。除非是 bug，如果僅僅是其他樣式/功能的需求，請(qǐng)自己動(dòng)手吧，不過(guò) DIY 內(nèi)容也歡迎提交 Pull request。其他使用相關(guān)問(wèn)題可在下面留言；主題相關(guān)問(wèn)題不接受微信/郵件私信。
IV. 下載
項(xiàng)目發(fā)布于 GitHub：mashirozx/Sakura，如果下載速度慢可使用國(guó)內(nèi)鏡像，Pull Request 和 Issue 請(qǐng)?zhí)峤坏?GitHub。
目前正在重構(gòu)主題，Sakura v3.x 版本人基本不再維護(hù)。重構(gòu)版主題采用 webpack 打包，更易于維護(hù)和 DIY，重構(gòu)項(xiàng)目預(yù)覽（務(wù)必閱讀 README）：https://github.com/mashirozx/Sakura2。
# 商業(yè)轉(zhuǎn)載請(qǐng)聯(lián)系作者獲得授權(quán)，非商業(yè)轉(zhuǎn)載請(qǐng)注明出處。
# For commercial use, please contact the author for authorization. For non-commercial use, please indicate the source.
# 協(xié)議(License)：署名-非商業(yè)性使用-相同方式共享 4.0 國(guó)際 (CC BY-NC-SA 4.0)
# 作者(Author)：Mashiro
# 鏈接(URL)：https://2heng.xin/theme-sakura/
# 來(lái)源(Source)：櫻花莊的白貓
