我的 WordPress 博客主题与插件设置分享
首先，感谢大家一直以来对我这个小破站的关注与支持♥️。自博客成型以来，陆陆续续有网友来询问我博客主题的相关设置。于是我打算在这篇文章中简单拆解一下目前的主题配置，希望能对同为新手的朋友有所帮助，也希望你能在这个过程中摸索出属于自己的博客风格。
主题
我使用的是免费版的 Blocksy 主题，只需在 WordPress 主题商店中搜索 “blocksy” 即可下载安装。
接着，需要安装一个名为 Blocksy Companion 的插件，同样可以在 WordPress 插件商店中直接搜索并安装。
Blocksy 是一个设置简便且具备较高自定义性的主题。如果要详解我如何从“默认”样式调整为现在的样式，过程会略显复杂，加上时间久远，具体配置我也记不太清了 😅。你可以参考 Dayu 的 这篇文章，导入我准备的 dat 文件即可快速还原样式。
虽然我和 Dayu 都使用了 Blocksy 主题，但呈现出的风格各有不同。如果你更喜欢他博客的设计风格，也不妨试试看 😉
封面
有不少朋友问过我博客文章的封面图是怎么做的，其实每一张封面都是我用 Keynote（苹果自带的演示软件）手动制作的。
我会先制作一个模板文件，之后每次只需修改标题并替换封面中的物体图片即可。
封面中的物体图像，若不是软件图标或商品图，一般来自 Unsplash 这类提供免费图片的站点，或是通过 AI 生成。之后我会用 PhotoShop 或豆包工具抠出主体图像，替换进 Keynote 模板中，整个流程算是比较简单的。
主题相关插件
以下是我目前博客中使用的一些插件：
- Meow Gallery：用于创建我的「相册」页面的图片展示插件。
- Meow Lightbox：与 Meow Gallery 搭配使用，实现灯箱效果。
- 友情链接管理插件：用于生成我的「友情链接」页面。
- Memos 插件：生成「说说」页面，需要额外部署 Artalk 和 v0.14.2 版本的 Memos。
- NeoDB 展示页面插件：用于生成「书影音」页面。
- 好物展示页面插件：展示我的「好物」推荐。
- 应用推荐页面插件：生成我的「应用推荐」页面。
- 网站推荐页面插件：展示我的「网站推荐」内容。
- Open User Map：生成我的「人生地图」页面。
- Rich Table of Contents：为文章自动生成目录。
- Stackable：用于制作「友情链接」、「关于」等页面的部分区块。
- WP Alu：为评论区添加阿鲁表情包。
- AI 编写的深色模式插件：为博客添加深色模式，切换按钮位于菜单栏旁。
- 基于 Dayu 魔改的点赞与打赏按钮：在文章末尾插入点赞与打赏功能。
字体
本博客采用小米的 MiSans 字体。
只需在 自定义 – 额外 CSS 中添加以下代码，即可生效：
/* 字体相关css */
@import url("https://font.sec.miui.com/font/css?family=MiSans:400,450:Chinese_Simplify,Latin&display=swap");
@font-face {
font-family: "MiSans", sans-serif;
font-weight: normal;
font-style: normal;
}
*:not([class*="icon"]):not(i) {
font-family: "MiSans" !important;
}
其他自定义 CSS
为了实现当前博客的视觉效果，我还在 自定义 – 额外 CSS 中加入了一些样式代码，其中相当一部分是配合深色模式所使用的。
.stackablelink a{
color: #475671
}
/* 说说相关css */
.atk-content {
color: var(--theme-palette-color-3);
}
a.commentsLink{
color: var(--theme-palette-color-3);
border: 1px solid currentcolor;
border-radius:8px;
}
div.atk-comment-count.atk-dropdown-wrap {
color: var(--theme-palette-color-3);
}
button.atk-send-btn {
border-radius: 8px !important;
}
div.atk-main-editor {
border-radius:8px;
}
ul.atk-dropdown.atk-fade-in{
border-radius:8px !important;
}
/* 黑色模式下，搜索页面背景色 */
html.dmb-html-dark [data-header*="type-1"] #search-modal {
background-color: rgba(71, 79, 92, 0.98);
}
/* 黑色模式下，好物页面文字 */
html.dmb-html-dark div.goods-exhibition-title {
color: #475671;
}
html.dmb-html-dark div.goods-exhibition-description {
color: #475671;
}
/* 黑色模式下，应用页面文字 */
html.dmb-html-dark div.app-name {
color: #475671;
}
html.dmb-html-dark p.app-description {
color: #475671;
}
/* 黑色模式下，书影音页面文字 */
html.dmb-html-dark button.neodb-nav-item {
color: #ffffff;
}
html.dmb-html-dark button.neodb-type-item {
color: #ffffff;
}
html.dmb-html-dark button.load-more-button.button {
color: #ffffff;
background-color: #293241;
}
html.dmb-html-dark .neodb-title a {
color: #ffffff !important
}
/* 黑色模式下，友情链接页面文字 */
html.dmb-html-dark a.latest-post-title {
color: #475671
}
html.dmb-html-dark div.friend-card {
background-color: #293241
}
/* 文章目录的样式 */
.rtoc-mokuji-content.frame2::before {
border-radius: 8px;
}
button.rtoc_open_close.rtoc_open {
border-radius: 8px;
color: #475671;
}
/* 回复按钮样式 */
a.comment-reply-link {
border-radius: 8px !important;
}
#cancel-comment-reply-link {
border-radius: 8px;
}
