小白主题模板 主题说明
简介:简洁清爽的响应式主题,采用蓝白配色,头部横幅 + 圆角胶囊导航 + 三栏布局,适合博客、资讯、企业官网等各类站点,开箱即用。
主题截图
首页截图
分类页截图
文章详情页截图
安装方法
- 下载逗号CMS → 登录后台 → 主题管理 → 主题列表,找到「小白主题模板」主题,点击免费安装。
- 进入 后台 → 网站设置 → 顶部导航,配置顶部导航及链接。
- 进入 后台 → 网站设置 → 参数设置,配置首页、分类页、文章页的文章显示数量。
- 进入网站设置 → SEO 设置,配置首页、文章分类列表页、文章详情页的 SEO 信息。
前端路由规则
<?php
function parse_rewrite_url($uri, $setting, $db, $prefix) {
if ($uri === '/ubb' || $uri === '/ubb/') {
return 'ubb_index';
}
if (preg_match('/^\/ubb\/([a-zA-Z0-9_\-]+)\/?$/', $uri, $matches)) {
$_GET['slug'] = $matches[1];
return 'ubb_page';
}
if ($uri === '/rs' || $uri === '/rs/') {
return 'search_rs_index';
}
if (preg_match('/^\/rs\/(.+?)\/?$/', $uri, $matches)) {
$keyword = urldecode($matches[1]);
$keyword = trim($keyword);
if ($keyword !== '') {
$_GET['keyword'] = $keyword;
return 'search';
}
}
$article_prefix = preg_quote($setting['article_prefix'] ?? 'article-', '/');
if (preg_match('/^\/' . $article_prefix . '([0-9a-zA-Z]+)\.html$/', $uri, $matches)) {
$url_id = $matches[1];
if ($setting['url_mode'] == 1) {
$_GET['id'] = intval($url_id);
} else {
$field = ($setting['url_mode'] == 2) ? 'hash_id' : 'md5_id';
$stmt = $db->prepare("SELECT id FROM {$prefix}article WHERE $field = ? LIMIT 1");
if ($stmt) {
$stmt->bind_param("s", $url_id);
$stmt->execute();
$res = $stmt->get_result();
if ($res && $res->num_rows > 0) {
$row = $res->fetch_assoc();
$_GET['id'] = $row['id'];
} else {
http_response_code(404);
require_once ROOT_PATH . '/set/404.php';
exit;
}
$stmt->close();
} else {
http_response_code(404);
require_once ROOT_PATH . '/set/404.php';
exit;
}
}
return 'article';
}
$category_prefix = preg_quote($setting['category_prefix'] ?? 'category-', '/');
if (preg_match('/^\/' . $category_prefix . '([0-9a-zA-Z]+)\.html$/', $uri, $matches)) {
$url_id = $matches[1];
$cat_url_mode = $setting['category_url_mode'] ?? 1;
if ($cat_url_mode == 1) {
$_GET['id'] = intval($url_id);
} else {
$field = ($cat_url_mode == 2) ? 'hash_id' : 'md5_id';
$stmt = $db->prepare("SELECT id FROM {$prefix}category WHERE $field = ? LIMIT 1");
if ($stmt) {
$stmt->bind_param("s", $url_id);
$stmt->execute();
$res = $stmt->get_result();
if ($res && $res->num_rows > 0) {
$row = $res->fetch_assoc();
$_GET['id'] = $row['id'];
} else {
http_response_code(404);
require_once ROOT_PATH . '/set/404.php';
exit;
}
$stmt->close();
} else {
http_response_code(404);
require_once ROOT_PATH . '/set/404.php';
exit;
}
}
return 'category';
}
if (preg_match('/^\/product\.html$/', $uri)) {
return 'product_list';
}
$product_category_prefix = preg_quote($setting['product_category_prefix'] ?? 'product-category-', '/');
if (preg_match('/^\/' . $product_category_prefix . '([0-9a-zA-Z]+)\.html$/', $uri, $matches)) {
$url_id = $matches[1];
$product_cat_url_mode = $setting['product_category_url_mode'] ?? 1;
if ($product_cat_url_mode == 1) {
$_GET['id'] = intval($url_id);
} else {
$field = ($product_cat_url_mode == 2) ? 'hash_id' : 'md5_id';
$stmt = $db->prepare("SELECT id FROM {$prefix}product_category WHERE $field = ? LIMIT 1");
if ($stmt) {
$stmt->bind_param("s", $url_id);
$stmt->execute();
$res = $stmt->get_result();
if ($res && $res->num_rows > 0) {
$row = $res->fetch_assoc();
$_GET['id'] = $row['id'];
} else {
http_response_code(404);
require_once ROOT_PATH . '/set/404.php';
exit;
}
$stmt->close();
} else {
http_response_code(404);
require_once ROOT_PATH . '/set/404.php';
exit;
}
}
return 'product_list';
}
$product_prefix = preg_quote($setting['product_prefix'] ?? 'product-', '/');
if (preg_match('/^\/' . $product_prefix . '([0-9a-zA-Z]+)\.html$/', $uri, $matches)) {
$url_id = $matches[1];
$product_url_mode = $setting['product_url_mode'] ?? 1;
if ($product_url_mode == 1) {
$_GET['id'] = intval($url_id);
} else {
$field = ($product_url_mode == 2) ? 'hash_id' : 'md5_id';
$stmt = $db->prepare("SELECT id FROM {$prefix}product WHERE $field = ? LIMIT 1");
if ($stmt) {
$stmt->bind_param("s", $url_id);
$stmt->execute();
$res = $stmt->get_result();
if ($res && $res->num_rows > 0) {
$row = $res->fetch_assoc();
$_GET['id'] = $row['id'];
} else {
http_response_code(404);
require_once ROOT_PATH . '/set/404.php';
exit;
}
$stmt->close();
} else {
http_response_code(404);
require_once ROOT_PATH . '/set/404.php';
exit;
}
}
return 'product_detail';
}
if ($uri === '/list.html' || preg_match('/^\/list-([0-9]+)\.html$/', $uri, $matches)) {
if (isset($matches[1])) $_GET['page'] = intval($matches[1]);
return 'list';
}
if ($uri === '/' || $uri === '/index.php') {
return 'index';
}
return '404';
}
function route_dispatch($action, $db, $prefix, $setting, $template_path) {
if ($action === '404') {
http_response_code(404);
require_once ROOT_PATH . 'set/404.php';
exit;
}
if ($action === 'ubb_index') {
$seo_row = $db->query("SELECT * FROM {$prefix}seo WHERE page_name = 'ubb_index' LIMIT 1")->fetch_assoc();
$site_name = $setting['site_name'] ?? '逗号CMS';
if ($seo_row) {
$seo = [
'title' => str_replace('{site_name}', $site_name, $seo_row['title'] ?: ('留言本 - ' . $site_name)),
'keywords' => str_replace('{site_name}', $site_name, $seo_row['keywords']),
'description' => str_replace('{site_name}', $site_name, $seo_row['description']),
];
} else {
$seo = [
'title' => '留言本 - ' . $site_name,
'keywords' => '留言本,在线留言,反馈',
'description' => '欢迎使用在线留言本,选择您想要留言的页面'
];
}
include $template_path . 'header.php';
require ROOT_PATH . 'set/ubb/index.php';
include $template_path . 'footer.php';
return true;
}
if ($action === 'ubb_page') {
$slug = isset($_GET['slug']) ? trim($_GET['slug']) : '';
$page_info_row = $db->query("SELECT * FROM {$prefix}ubb_pages WHERE slug = '" . $db->real_escape_string($slug) . "' AND status = 1 LIMIT 1")->fetch_assoc();
$site_name = $setting['site_name'] ?? '逗号CMS';
if ($page_info_row) {
$seo_row = $db->query("SELECT * FROM {$prefix}seo WHERE page_name = 'ubb_page' LIMIT 1")->fetch_assoc();
$replace_map = [
'{page_name}' => $page_info_row['name'],
'{page_description}' => $page_info_row['description'] ?: $page_info_row['name'],
'{site_name}' => $site_name,
];
if ($seo_row) {
$seo = [
'title' => str_replace(array_keys($replace_map), array_values($replace_map), $seo_row['title'] ?: ($page_info_row['name'] . ' - ' . $site_name)),
'keywords' => str_replace(array_keys($replace_map), array_values($replace_map), $seo_row['keywords']),
'description' => str_replace(array_keys($replace_map), array_values($replace_map), $seo_row['description']),
];
} else {
$seo = [
'title' => $page_info_row['name'] . ' - ' . $site_name,
'keywords' => $page_info_row['name'],
'description' => $page_info_row['description'] ?: $page_info_row['name']
];
}
} else {
$seo = [
'title' => '留言页 - ' . $site_name,
'keywords' => '',
'description' => ''
];
}
include $template_path . 'header.php';
require ROOT_PATH . 'set/ubb/page.php';
include $template_path . 'footer.php';
return true;
}
if ($action === 'search_rs_index') {
$site_name = $setting['site_name'] ?? '逗号CMS';
$seo_row = $db->query("SELECT * FROM {$prefix}seo WHERE page_name = 'search_rs_index' LIMIT 1")->fetch_assoc();
if ($seo_row) {
$seo = [
'title' => str_replace('{site_name}', $site_name, $seo_row['title'] ?: ('热搜标签 - ' . $site_name)),
'keywords' => str_replace('{site_name}', $site_name, $seo_row['keywords']),
'description' => str_replace('{site_name}', $site_name, $seo_row['description']),
];
} else {
$seo = [
'title' => '热搜标签 - ' . $site_name,
'keywords' => '热搜,标签,热门搜索',
'description' => '网站热搜标签聚合页'
];
}
include $template_path . 'header.php';
include $template_path . 'search_rs.php';
include $template_path . 'footer.php';
return true;
}
if ($action === 'search') {
$_GET['action'] = 'search';
$keyword = isset($_GET['keyword']) ? trim($_GET['keyword']) : '';
$keyword_display = $keyword;
if (!empty($keyword)) {
if (!check_sensitive_words($keyword)) {
http_response_code(404);
require_once ROOT_PATH . 'set/404.php';
exit;
}
record_hot_search($keyword);
$keyword_escaped = str_replace(['%', '_'], ['\\%', '\\_'], $keyword);
save_search_keyword($keyword_escaped);
$keywords = split_search_keywords_by_api($keyword);
if (empty($keywords)) {
$keywords = split_search_keywords($keyword);
}
$page = isset($_GET['page']) ? max(1, intval($_GET['page'])) : 1;
$page_size = 20;
$search_result = search_articles_by_keywords($keywords, $page, $page_size);
$articles = $search_result['articles'];
$total = $search_result['total'];
$base_url = "/rs/" . rawurlencode($keyword) . "?";
$pagination = pagination($total, $page_size, $page, $base_url);
} else {
$articles = [];
$total = 0;
$pagination = '';
$search_result = ['keywords' => []];
}
$seo = get_seo('search', ['keyword' => $keyword_display]);
include $template_path . 'header.php';
include $template_path . 'category.php';
include $template_path . 'footer.php';
return true;
}
if ($action === 'list') {
$page = isset($_GET['page']) ? max(1, intval($_GET['page'])) : 1;
$page_size = 20;
$total = get_article_count();
$offset = ($page - 1) * $page_size;
$articles = get_articles('', "$offset, $page_size");
$base_url = "/list.html?";
$pagination = pagination($total, $page_size, $page, $base_url);
$seo = get_seo('category', ['category_name' => '全部文章']);
include $template_path . 'header.php';
include $template_path . 'category.php';
include $template_path . 'footer.php';
return true;
}
if ($action === 'category') {
$category_id = isset($_GET['id']) ? intval($_GET['id']) : 0;
$page = isset($_GET['page']) ? max(1, intval($_GET['page'])) : 1;
$page_size = 20;
$category_name = '';
$categories = get_categories();
foreach ($categories as $cat) {
if ($cat['id'] == $category_id) {
$category_name = $cat['name'];
break;
}
}
if (!$category_name) {
http_response_code(404);
require_once ROOT_PATH . '/set/404.php';
exit;
}
$seo = get_seo('category', ['category_name' => $category_name]);
$where = "category_id = $category_id";
$total = get_article_count($where);
$offset = ($page - 1) * $page_size;
$articles = get_articles($where, "$offset, $page_size");
$base_url = "/" . ($setting['category_prefix'] ?? 'category-') . build_url_id('category', $category_id) . ".html?";
$pagination = pagination($total, $page_size, $page, $base_url);
include $template_path . 'header.php';
include $template_path . 'category.php';
include $template_path . 'footer.php';
return true;
}
if ($action === 'article') {
$id = isset($_GET['id']) ? intval($_GET['id']) : 0;
$article = get_article($id);
if (!$article) {
http_response_code(404);
require_once ROOT_PATH . '/set/404.php';
exit;
}
update_views($id);
$category_name = '';
$categories = get_categories();
foreach ($categories as $cat) {
if ($cat['id'] == $article['category_id']) {
$category_name = $cat['name'];
break;
}
}
$seo = get_seo('article', [
'article_title' => $article['title'],
'article_description' => $article['description'] ?: mb_substr(strip_tags($article['content']), 0, 150),
'category_name' => $category_name
]);
include $template_path . 'header.php';
include $template_path . 'article.php';
include $template_path . 'footer.php';
return true;
}
if ($action === 'product_list') {
$category_id = isset($_GET['id']) ? intval($_GET['id']) : 0;
$page = isset($_GET['page']) ? max(1, intval($_GET['page'])) : 1;
$page_size = 12;
$category_name = '全部产品';
if ($category_id > 0) {
$cats = $db->query("SELECT * FROM {$prefix}product_category ORDER BY sort ASC");
while ($cat = $cats->fetch_assoc()) {
if ($cat['id'] == $category_id) {
$category_name = $cat['name'];
break;
}
}
}
$seo = get_seo('product_list', ['category_name' => $category_name]);
if ($category_id > 0) {
$where = "WHERE category_id = $category_id";
$total = $db->query("SELECT COUNT(*) as t FROM {$prefix}product $where")->fetch_assoc()['t'];
} else {
$where = '';
$total = $db->query("SELECT COUNT(*) as t FROM {$prefix}product")->fetch_assoc()['t'];
}
$offset = ($page - 1) * $page_size;
$products = $db->query("SELECT * FROM {$prefix}product $where ORDER BY id DESC LIMIT $offset, $page_size");
$product_cats = $db->query("SELECT * FROM {$prefix}product_category ORDER BY sort ASC");
include $template_path . 'header.php';
include $template_path . 'product_list.php';
include $template_path . 'footer.php';
return true;
}
if ($action === 'product_detail') {
$id = isset($_GET['id']) ? intval($_GET['id']) : 0;
$product = $db->query("SELECT p.*, c.name as category_name FROM {$prefix}product p LEFT JOIN {$prefix}product_category c ON p.category_id = c.id WHERE p.id = $id")->fetch_assoc();
if (!$product) {
http_response_code(404);
require_once ROOT_PATH . '/set/404.php';
exit;
}
$db->query("UPDATE {$prefix}product SET views = views + 1 WHERE id = $id");
$gallery = json_decode($product['gallery'], true);
if (!is_array($gallery)) $gallery = [];
$seo = get_seo('product_detail', [
'product_title' => $product['title'],
'product_description' => $product['description'],
'category_name' => $product['category_name'] ?? ''
]);
include $template_path . 'header.php';
include $template_path . 'product_detail.php';
include $template_path . 'footer.php';
return true;
}
if ($action === 'index') {
$seo = get_seo('index');
$ads = get_ads(5);
$recommend_articles = get_articles('is_recommend = 1', $seo['recommend_count']);
$latest_articles = get_articles('', $seo['latest_count']);
$latest_searches = get_latest_search(5);
include $template_path . 'header.php';
include $template_path . 'index.php';
include $template_path . 'footer.php';
return true;
}
return false;
}
功能特色
蓝白清爽配色
以 #1d8bd5 为品牌主色,搭配浅灰页面底色与白色卡片,视觉干净利落。
三栏首页布局
左侧轮播图 + 热门分类,中间今日头条,右侧精选图文,信息层次分明。
圆角胶囊导航
深蓝渐变胶囊导航,菜单项悬停上浮高亮,PC 端横向排布,视觉柔和不刺眼。
移动端抽屉菜单
手机端汉堡菜单从右侧滑出,不顶开页面,顶部仅显示搜索框,浏览更专注。
分类区块自动生成
首页下方自动循环所有分类生成文章区块,每块显示最新文章,日期倒序排列。
参数化数量调用
所有文章列表数量读取后台「参数设置」,无需改代码即可调整显示条数。
页面列表
主题包含以下页面文件,全部位于 /templates/xiaobai/ 目录:
| 文件名 | 页面说明 | URL |
|---|---|---|
header.php | 公共头部(LOGO + 横幅 + 导航 + 搜索) | - |
footer.php | 公共底部(友情链接 + 页脚 + 返回顶部) | - |
index.php | 网站首页 | / |
article.php | 文章详情页 | /article-x.html |
category.php | 分类列表页 + 搜索页 | /list.html、/category-x.html、/rs/关键词 |
search_rs.php | 热搜标签聚合页 | /rs |
style.css | 主题全局样式 | - |
模板调用要点
| 功能 | 调用方式 |
|---|---|
| 顶部导航 | get_nav_menu() |
| 网站横幅 | get_ad_position('header_banner') |
| 底部悬浮 | get_ad_position('footer_float') |
| 文章列表 | get_articles($where, $limit, $order) |
| SEO 数据 | get_seo($page, $data) |
| URL 生成 | build_url('article', $id) |
| 搜索分词 | split_search_keywords_by_api() → split_search_keywords() |
广告位配置
小白主题在所有页面顶部调用「网站横幅」广告位:
<div class="douhao-header-banner">
<?php echo get_ad_position('header_banner'); ?>
</div>
如何配置顶部横幅广告?
- 后台 → 内容管理 → 广告管理
- 找到 「网站横幅」 广告位,点击「广告设置」
- 点击「添加广告」,填写标题,投放页面务必勾选「不限页面」,这样所有页面都会显示
- 选择广告模板(图片/代码/文字),图片建议尺寸 1200×120px
- 设置排序、状态(启用),保存
其他广告位
| 广告位 | 位置 | 说明 |
|---|---|---|
header_banner | 顶部横幅 | LOGO 右侧,所有页面显示 |
banner | 中部横幅 | 首页三栏区块下方 |
footer_float | 底部悬浮 | 页面底部固定悬浮 |
article_readmore | 阅读全文弹窗 | 文章页点击阅读全文时弹出 |
如需在不同页面显示不同横幅,可在后台新增广告位,然后修改对应模板页面的
get_ad_position() 参数为你的自定义广告位标识。配置 API
更新日志
V1.1
适配CMSV7.4版本路由兼容性
2026-10-24
1、适配CMSV7.4版本路由兼容性(未升级到CMS v7.4版本无需升级)2、升级后可到文章管理--分类管理处设置分类英文名(伪静态设置处增加分类英文名标签)
逗号CMS