一、顶部样式设置
B2 主题提供了多种顶部布局形式,前往 后台-主题设置-模块设置-顶部模块 中设置页面顶部背景颜色、文字颜色与布局形式(LOGO 居中 / 居左 / 居上等)。
二、LOGO 的修改
如果使用图片 LOGO,建议使用 SVG 格式以适配高分辨率屏幕;未设置图片 LOGO 时将显示文字 LOGO。修改 LOGO 尺寸可参考:
Text
/* 在子主题样式文件中覆盖 */
.logo { display: flex; height: 34px; align-items: center; }
.logo img { display: block; height: 34px; }
三、菜单设置
如需添加、编辑、删除菜单,请前往 WP 后台-外观-菜单 操作。如果使用菜单插件或自行 DIY 顶部菜单代码出现兼容问题,可在顶部模块中关闭”主题自带菜单功能”,改用插件菜单。
四、角标设置
文章角标可以在文章编辑页的角标字段中设置(需先通过 CMB2 添加该字段),角标样式可自由定制:
Text
.card-badge {
background: linear-gradient(135deg, #FFD700, #FFA500);
color: #5c3a00;
font-size: 11px;
font-weight: 800;
padding: 4px 8px;
border-radius: 4px;
letter-spacing: 1px;
}
.card-badge.free {
background: linear-gradient(135deg, #4ade80, #22c55e);
color: #fff;
}
五、签到按钮美化示例
觉得默认签到按钮不好看时,可以在子主题样式中覆盖其样式:
Text
.sign-btn {
background: linear-gradient(135deg, #ffd700, #ffa500);
color: #5c3a00;
border-radius: 6px;
box-shadow: 0 2px 8px rgba(255, 165, 0, .3);
transition: all .25s ease;
}
.sign-btn:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(255, 165, 0, .4); }
六、注意事项
1. 样式覆盖建议写在子主题样式文件(或后台自定义 CSS)中,避免直接修改父主题。
2. 修改后存在缓存时请强制刷新浏览器查看效果。
3. 移动端与 PC 端样式建议分别适配(利用 @media 断点)。

