页脚作为网站的 “收尾部分”,看似不起眼,实则是提升用户体验和品牌质感的关键区域。很多站长在美化网站时,往往将精力集中在头部和内容区,却忽略了页脚的设计,导致整个网站的视觉体验 “虎头蛇尾”。本文以子比(Zibll)主题为例,分享如何通过纯 CSS+JS 定制出兼具实用性与视觉美感的高级感页脚,让网站的每一个角落都能体现专业度。
一、页脚设计的核心原则:美观与实用兼具
在开始定制前,我们首先要明确页脚的核心功能定位:
- 信息补充:展示网站统计数据、友情链接、联系方式等核心信息;
- 视觉平衡:与网站整体风格呼应,形成完整的视觉闭环;
- 用户引导:通过二维码、友链申请按钮等元素引导用户进一步互动;
- 适配性:兼顾 PC 端与移动端的显示效果,避免布局错乱。
基于以上原则,本次定制的子比主题页脚实现了以下核心功能:
- 渐变暗黑系背景搭配光影效果,提升视觉层次感;
- 动态加载的网站统计数据,直观展示网站运营状态;
- 横向固定 4 列的友情链接布局,避免滚动影响体验;
- 独立定位的二维码区域,不干扰核心内容布局;
- 响应式设计,适配不同尺寸的设备显示。

代码如下
[hidecontent type="reply"]
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>子比主题底部页脚</title>
<!-- 引入Font Awesome图标库 -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6.5.1/css/all.min.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6.5.1/css/v4-shims.min.css">
<style>
/* 子比主题页脚样式 */
.zibll-footer {
background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
color: #fff;
font-family: 'PingFang SC', 'Microsoft YaHei', sans-serif;
overflow: hidden;
position: relative;
height: 550px; /* 直接修改此数值调整页脚高度 */
box-sizing: border-box;
}
/* 背景装饰 */
.zibll-footer::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-image:
radial-gradient(circle at 20% 80%, rgba(120, 119, 198, 0.3) 0%, transparent 50%),
radial-gradient(circle at 80% 20%, rgba(255, 119, 198, 0.3) 0%, transparent 50%),
radial-gradient(circle at 40% 40%, rgba(120, 219, 255, 0.2) 0%, transparent 50%);
pointer-events: none;
}
/* 统计信息区域 */
.footer-stats {
padding: 40px 0;
position: relative;
z-index: 1;
opacity: 0;
transform: translateY(20px);
transition: all 0.8s ease;
}
.footer-stats.visible {
opacity: 1;
transform: translateY(0);
}
.stats-container {
max-width: 1200px;
margin: 0 auto;
display: flex;
justify-content: center;
align-items: center;
flex-wrap: wrap;
gap: 30px;
padding: 0 20px;
}
.stat-item {
display: flex;
align-items: center;
gap: 10px;
background: rgba(255, 255, 255, 0.1);
padding: 15px 25px;
border-radius: 50px;
backdrop-filter: blur(10px);
border: 1px solid rgba(255, 255, 255, 0.2);
transition: all 0.3s ease;
}
.stat-item:hover {
transform: translateY(-5px) scale(1.05);
box-shadow: 0 15px 35px rgba(0, 0, 0, 0.4);
background: rgba(255, 255, 255, 0.15);
}
.stat-icon {
font-size: 18px;
color: #00d4ff;
}
.stat-label {
font-size: 14px;
color: #ccc;
}
.stat-value {
font-size: 18px;
font-weight: bold;
color: #00d4ff;
}
.stat-unit {
font-size: 14px;
color: #ccc;
}
/* 性能信息区域 */
.footer-performance-inline {
padding: 15px 0 0 0;
margin-top: 15px;
border-top: 1px solid rgba(255, 255, 255, 0.1);
position: relative;
z-index: 1;
}
.perf-container-inline {
display: flex;
justify-content: flex-start;
align-items: center;
flex-wrap: wrap;
gap: 20px;
font-size: 14px;
}
.perf-item {
color: #ccc;
}
.perf-item span {
color: #00d4ff;
font-weight: bold;
}
.perf-divider {
color: rgba(255, 255, 255, 0.3);
}
/* 网站信息区域 */
.footer-info {
padding: 60px 0;
position: relative;
z-index: 1;
opacity: 0;
transform: translateY(20px);
transition: all 0.8s ease;
}
.footer-info.visible {
opacity: 1;
transform: translateY(0);
}
.info-container {
max-width: 1200px;
margin: 0 auto;
display: grid;
grid-template-columns: 1fr 1fr;
gap: 60px;
padding: 0 20px;
}
.site-info {
display: flex;
gap: 30px;
align-items: flex-start;
flex-direction: column;
}
.site-logo img {
width: 260px;
height: auto;
border-radius: 0;
object-fit: contain;
border: none;
transition: all 0.3s ease;
}
.site-logo img:hover {
transform: scale(1.05);
filter: brightness(1.1);
}
.site-title {
font-size: 24px;
font-weight: bold;
margin-bottom: 15px;
color: #fff;
}
.site-intro {
font-size: 14px;
line-height: 1.8;
color: #ccc;
margin: 0;
}
/* 友情链接区域 - 恢复原样,不受二维码影响 */
.friend-links {
margin-top: 20px;
display: flex;
flex-direction: column;
height: 100%;
}
.links-title {
font-size: 18px;
font-weight: bold;
margin-bottom: 25px;
color: #fff;
position: relative;
background: linear-gradient(90deg, #00d4ff, #ff006e);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
animation: textFloat 3s ease-in-out infinite;
width: 100%;
}
@keyframes textFloat {
0%, 100% {
transform: translateY(0);
}
50% {
transform: translateY(-5px);
}
}
.links-title::after {
content: '';
position: absolute;
bottom: -8px;
left: 0;
width: 50px;
height: 2px;
background: linear-gradient(90deg, #00d4ff, #ff006e);
animation: lineExpand 3s ease-in-out infinite;
}
@keyframes lineExpand {
0%, 100% {
width: 50px;
}
50% {
width: 100px;
}
}
/* 友情链接网格 - 强制4个,无滚动,完全独立 */
.links-grid {
display: grid;
grid-template-columns: repeat(4, 1fr); /* 强制一行4个 */
gap: 15px;
overflow: hidden;
padding-right: 0;
width: 100%;
}
.link-item {
display: flex;
align-items: center;
gap: 10px;
background: rgba(255, 255, 255, 0.1);
padding: 10px 15px;
border-radius: 8px;
text-decoration: none;
color: #ccc;
transition: all 0.3s ease;
font-size: 13px;
border: 1px solid rgba(255, 255, 255, 0.1);
white-space: nowrap;
}
.link-item:hover {
background: rgba(255, 255, 255, 0.15);
color: #00d4ff;
transform: translateY(-3px) scale(1.02);
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);
}
.link-icon {
width: 24px;
height: 24px;
border-radius: 50%;
object-fit: cover;
flex-shrink: 0;
}
.link-name {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
/* 申请友链按钮样式 */
.apply-link-btn {
display: flex;
align-items: center;
justify-content: center;
gap: 8px;
background: linear-gradient(90deg, #00d4ff, #ff006e);
padding: 10px 15px;
border-radius: 50px;
text-decoration: none;
color: #fff;
transition: all 0.3s ease;
font-size: 13px;
font-weight: bold;
border: none;
cursor: pointer;
white-space: nowrap;
}
.apply-link-btn:hover {
transform: translateY(-2px);
box-shadow: 0 5px 15px rgba(0, 212, 255, 0.4);
}
/* 二维码样式 - 绝对定位到最右侧右下角边界 */
.qr-code-container {
position: absolute;
right: 20px; /* 紧贴右侧边界,可微调距离 */
bottom: 100px; /* 在版权信息上方,可微调距离 */
display: flex;
gap: 15px;
z-index: 10;
white-space: nowrap;
}
.qr-code-item {
display: flex;
flex-direction: column;
align-items: center;
text-decoration: none;
color: #ccc;
transition: all 0.3s ease;
}
.qr-code-img {
width: 80px;
height: 80px;
border-radius: 8px;
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
transition: transform 0.3s ease;
}
.qr-code-item:hover .qr-code-img {
transform: scale(1.1);
}
.qr-code-label {
font-size: 12px;
margin-top: 5px;
color: #ccc;
transition: color 0.3s ease;
white-space: nowrap;
}
.qr-code-item:hover .qr-code-label {
color: #00d4ff;
}
/* 版权信息 */
.footer-copyright {
padding: 30px 0;
background: rgba(0, 0, 0, 0.7);
border-top: 2px solid rgba(0, 212, 255, 0.3);
position: absolute;
bottom: 0;
left: 0;
right: 0;
z-index: 1;
overflow: hidden;
opacity: 0;
transform: translateY(20px);
transition: all 0.8s ease;
}
.footer-copyright.visible {
opacity: 1;
transform: translateY(0);
}
.footer-copyright::before {
content: '';
position: absolute;
top: 0;
left: -100%;
width: 100%;
height: 100%;
background: linear-gradient(90deg, transparent, rgba(0, 212, 255, 0.1), transparent);
animation: copyrightShine 5s linear infinite;
}
@keyframes copyrightShine {
0% {
left: -100%;
}
100% {
left: 100%;
}
}
.copyright-container {
max-width: 1200px;
margin: 0 auto;
text-align: center;
padding: 0 20px;
font-size: 14px;
color: #999;
position: relative;
z-index: 2;
}
.copyright-container a {
color: #00d4ff;
text-decoration: none;
transition: all 0.3s ease;
position: relative;
}
.copyright-container a::after {
content: '';
position: absolute;
bottom: -2px;
left: 0;
width: 0;
height: 1px;
background: linear-gradient(90deg, #00d4ff, #ff006e);
transition: width 0.3s ease;
}
.copyright-container a:hover {
color: #ff006e;
}
.copyright-container a:hover::after {
width: 100%;
}
/* 响应式设计 */
@media (max-width: 768px) {
.stats-container {
gap: 15px;
}
.stat-item {
padding: 12px 20px;
font-size: 13px;
}
.info-container {
grid-template-columns: 1fr;
gap: 40px;
}
.site-info {
text-align: center;
align-items: center;
}
.perf-container-inline {
justify-content: center;
}
.links-grid {
grid-template-columns: repeat(2, 1fr);
gap: 10px;
}
.qr-code-container {
position: relative;
right: auto;
bottom: auto;
justify-content: center;
margin-top: 30px;
}
}
@media (max-width: 480px) {
.footer-stats {
padding: 30px 0;
}
.stats-container {
gap: 10px;
}
.stat-item {
padding: 10px 15px;
font-size: 12px;
}
.perf-container-inline {
flex-direction: column;
gap: 10px;
}
.perf-divider {
display: none;
}
.links-grid {
grid-template-columns: repeat(2, 1fr);
}
.qr-code-container {
flex-direction: column;
gap: 10px;
}
}
/* 返回顶部按钮 */
.back-to-top {
position: fixed;
bottom: 30px;
right: 30px;
width: 50px;
height: 50px;
border-radius: 50%;
background: linear-gradient(135deg, #00d4ff, #ff006e);
color: white;
border: none;
cursor: pointer;
font-size: 18px;
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
opacity: 0;
visibility: hidden;
transition: all 0.3s ease;
z-index: 9999;
}
.back-to-top:hover {
transform: scale(1.1);
box-shadow: 0 8px 25px rgba(0, 0, 0, 0.4);
}
.back-to-top.show {
opacity: 1;
visibility: visible;
}
</style>
</head>
<body>
<!-- 子比主题底部页脚 -->
<footer class="zibll-footer">
<!-- 统计信息区域 -->
<div class="footer-stats">
<div class="stats-container">
<div class="stat-item">
<span class="stat-icon"><i class="fa fa-users"></i></span>
<span class="stat-label">会员总数</span>
<span class="stat-value" id="member-count">--</span>
</div>
<div class="stat-item">
<span class="stat-icon"><i class="fa fa-file-text"></i></span>
<span class="stat-label">文章总数</span>
<span class="stat-value" id="post-count">--</span>
</div>
<div class="stat-item">
<span class="stat-icon"><i class="fa fa-eye"></i></span>
<span class="stat-label">浏览总数</span>
<span class="stat-value" id="view-count">--</span>
</div>
<div class="stat-item">
<span class="stat-icon"><i class="fa fa-calendar"></i></span>
<span class="stat-label">今日发布</span>
<span class="stat-value" id="today-posts">--</span>
</div>
<div class="stat-item">
<span class="stat-icon"><i class="fa fa-server"></i></span>
<span class="stat-label">稳定运行</span>
<span class="stat-value" id="uptime-days">--</span>
<span class="stat-unit">天</span>
</div>
</div>
</div>
<!-- 网站信息区域 -->
<div class="footer-info">
<div class="info-container">
<!-- LOGO和介绍 -->
<div class="site-info">
<div class="site-logo">
<a href="https://cs.yykbk.com/" target="_blank">
<img src="https://cs.yykbk.com/wp-content/uploads/2026/01/logo1.webp" alt="优源库博客网">
</a>
</div>
<div class="site-description">
<h3 class="site-title">优源库博客网・YYKBK.COM</h3>
<p class="site-intro">优源库博客网致力于分享优质实用的互联网资源,内容包括有网站搭建、建站源码、样式特效、主题美化、实用工具、素材资源、技术教程,致力打造一个IT博客!</p>
<div class="footer-performance-inline">
<div class="perf-container-inline">
<span class="perf-item">页面耗时 <span id="page-load-time">--</span> 秒</span>
<span class="perf-divider">|</span>
<span class="perf-item">数据库查询 <span id="db-queries">--</span> 次</span>
<span class="perf-divider">|</span>
<span class="perf-item">内存 <span id="memory-usage">--</span></span>
<span class="perf-divider">|</span>
<span class="perf-item">在线人数:<span id="online-users">--</span> 人</span>
</div>
</div>
</div>
</div>
<!-- 友情链接 - 完全独立,不受二维码影响 -->
<div class="friend-links">
<h4 class="links-title">这里是友情链接板块,需要加入的友友点击下方按钮加入吧</h4>
<div class="links-grid" id="friend-links-container">
<!-- 友情链接将通过JavaScript动态生成 -->
</div>
</div>
</div>
</div>
<!-- 二维码容器 - 独立绝对定位在最右侧右下角 -->
<div class="qr-code-container">
<a href="https://cs.yykbk.com/" target="_blank" class="qr-code-item">
<img src="https://cs.yykbk.com/wp-content/uploads/2026/02/20260219160828596-WX.webp" alt="微信赞助饺子" class="qr-code-img">
<span class="qr-code-label">微信赞助饺子</span>
</a>
<a href="https://cs.yykbk.com/wechat" target="_blank" class="qr-code-item">
<img src="https://cs.yykbk.com/wp-content/uploads/2026/02/20260219160828267-ZFB.webp" alt="支付宝赞助饺子" class="qr-code-img">
<span class="qr-code-label">支付宝赞助饺子</span>
</a>
</div>
<!-- 版权信息 -->
<div class="footer-copyright">
<div class="copyright-container">
<p>© 2025 优源库博客网. 保留所有权利. |
<a href="https://cs.yykbk.com/" target="_blank">YYKBK.COM</a> |
子比主题定制页脚
</p>
</div>
</div>
</footer>
<!-- 返回顶部按钮 -->
<button class="back-to-top" id="backToTop">
<i class="fa fa-arrow-up"></i>
</button>
<script>
const CACHE_KEY = 'zibll_footer_stats_cache';
const CACHE_DURATION = 5 * 60 * 1000;
document.addEventListener('DOMContentLoaded', function() {
initFooter();
initBackToTop();
initScrollAnimations();
});
function initFooter() {
loadRealDataWithCache();
loadFriendLinks();
}
function loadRealDataWithCache() {
const cachedData = localStorage.getItem(CACHE_KEY);
const now = Date.now();
if (cachedData) {
const { data, timestamp } = JSON.parse(cachedData);
if (now - timestamp < CACHE_DURATION) {
updateFooterUI(data);
return;
}
}
fetchRealData();
}
function fetchRealData() {
const ajaxurl = window.ajaxurl || '/wp-admin/admin-ajax.php';
const formData = new FormData();
formData.append('action', 'get_zibll_footer_real_stats');
fetch(ajaxurl, {
method: 'POST',
credentials: 'same-origin',
body: formData
})
.then(response => response.json())
.then(res => {
if (res.success) {
localStorage.setItem(CACHE_KEY, JSON.stringify({
data: res.data,
timestamp: Date.now()
}));
updateFooterUI(res.data);
}
})
.catch(err => console.error('AJAX 请求错误', err));
}
function updateFooterUI(data) {
if (document.getElementById('member-count')) document.getElementById('member-count').textContent = data.members || 0;
if (document.getElementById('post-count')) document.getElementById('post-count').textContent = data.posts || 0;
if (document.getElementById('view-count')) document.getElementById('view-count').textContent = data.views || 0;
if (document.getElementById('today-posts')) document.getElementById('today-posts').textContent = data.today_posts || 0;
if (document.getElementById('uptime-days')) document.getElementById('uptime-days').textContent = data.uptime_days || 0;
if (document.getElementById('page-load-time')) document.getElementById('page-load-time').textContent = data.load_time || '0.00';
if (document.getElementById('db-queries')) document.getElementById('db-queries').textContent = data.db_queries || 0;
if (document.getElementById('memory-usage')) document.getElementById('memory-usage').textContent = data.memory_usage || '0MB';
if (document.getElementById('online-users')) document.getElementById('online-users').textContent = data.online_users || 1;
}
function loadFriendLinks() {
const friendLinks = [
{ name: 'WordPress官方', url: 'https://wordpress.org', icon: 'https://wordpress.org/favicon.ico' },
{ name: '子比主题官网', url: 'https://www.zibll.com', icon: 'https://www.zibll.com/favicon.ico' },
{ name: '优源库博客', url: 'https://cs.yykbk.com/', icon: 'https://cs.yykbk.com/favicon.ico' },
{ name: '百度', url: 'https://www.baidu.com', icon: 'https://www.baidu.com/favicon.ico' },
{ name: 'GitHub', url: 'https://github.com', icon: 'https://github.com/favicon.ico' },
{ name: 'CSDN', url: 'https://www.csdn.net', icon: 'https://www.csdn.net/favicon.ico' },
{ name: '掘金', url: 'https://juejin.cn', icon: 'https://juejin.cn/favicon.ico' },
{ name: '博客园', url: 'https://www.cnblogs.com', icon: 'https://www.cnblogs.com/favicon.ico' }
];
const container = document.getElementById('friend-links-container');
if(!container) return;
container.innerHTML = '';
const applyBtn = document.createElement('a');
applyBtn.href = 'https://cs.yykbk.com/apply-link';
applyBtn.target = '_blank';
applyBtn.className = 'apply-link-btn';
applyBtn.innerHTML = '<i class="fa fa-plus"></i> 申请友链';
container.appendChild(applyBtn);
friendLinks.forEach(link => {
const linkItem = document.createElement('a');
linkItem.href = link.url;
linkItem.target = '_blank';
linkItem.className = 'link-item';
linkItem.rel = 'nofollow';
linkItem.innerHTML = `
<img src="${link.icon}" alt="${link.name}" class="link-icon" onerror="this.style.display='none'">
<span class="link-name">${link.name}</span>
`;
container.appendChild(linkItem);
});
}
function initBackToTop() {
const backToTopButton = document.getElementById('backToTop');
if(!backToTopButton) return;
window.addEventListener('scroll', function() {
if (window.pageYOffset > 300) {
backToTopButton.classList.add('show');
} else {
backToTopButton.classList.remove('show');
}
});
backToTopButton.addEventListener('click', function() {
window.scrollTo({ top: 0, behavior: 'smooth' });
});
}
function initScrollAnimations() {
const observerOptions = {
root: null,
rootMargin: '0px',
threshold: 0.1
};
const observer = new IntersectionObserver((entries) => {
entries.forEach(entry => {
if (entry.isIntersecting) {
entry.target.classList.add('visible');
}
});
}, observerOptions);
document.querySelectorAll('.footer-stats, .footer-info, .footer-copyright').forEach(section => {
observer.observe(section);
});
}
</script>
</body>
</html>
[/hidecontent][hidecontent type="reply"]
add_action('wp_ajax_get_zibll_footer_real_stats', 'zibll_get_footer_real_stats');
add_action('wp_ajax_nopriv_get_zibll_footer_real_stats', 'zibll_get_footer_real_stats');
function zibll_get_footer_real_stats() {
// 1. 基础统计数据
$data = array();
// --- 会员总数 (如果开启了注册) ---
$user_count = count_users();
$data['members'] = $user_count['total_users'];
// --- 文章总数 ---
$data['posts'] = wp_count_posts('post')->publish;
// --- 浏览总数 (调用子比主题的函数或自定义字段) ---
// 注意:子比主题通常使用 'views' 作为 meta_key,这里尝试通用获取
// 如果你的站有特定的统计插件,请在此处替换逻辑
$total_views = 0;
$args = array(
'post_type' => 'post',
'posts_per_page' => -1,
'meta_key' => 'views', // 子比主题的浏览量字段通常是 views
'fields' => 'ids'
);
$posts_with_views = get_posts($args);
foreach ($posts_with_views as $pid) {
$total_views += (int) get_post_meta($pid, 'views', true);
}
// 如果子比有自带函数,优先用 zibll_get_post_views() 之类的,这里做通用处理
$data['views'] = $total_views > 0 ? number_format($total_views) : '0';
// --- 今日发布 ---
$today = getdate();
$today_posts = new WP_Query(array(
'post_type' => 'post',
'post_status' => 'publish',
'year' => $today['year'],
'monthnum' => $today['mon'],
'day' => $today['mday'],
'fields' => 'ids'
));
$data['today_posts'] = $today_posts->found_posts;
wp_reset_postdata();
// --- 稳定运行天数 (需要你手动设置建站日期) ---
// 请在这里修改为你的网站建立日期 (格式: Y-m-d)
$site_start_date = '2023-01-01';
$now = time();
$start = strtotime($site_start_date);
$data['uptime_days'] = ceil(($now - $start) / 86400);
// 2. 性能数据
// --- 内存使用 & 数据库查询 (WordPress 自带常量) ---
if (function_exists('memory_get_usage')) {
$data['memory_usage'] = size_format(memory_get_usage(), 2);
} else {
$data['memory_usage'] = '未知';
}
// WordPress 在 wp_footer 阶段通常已经执行完大部分查询
// 这里我们尝试获取,如果获取不到则显示一个合理的数值
if (defined('SAVEQUERIES') && SAVEQUERIES) {
global $wpdb;
$data['db_queries'] = count($wpdb->queries);
} else {
// 如果没开启 SAVEQUERIES,我们可以通过 WP 自带的 get_num_queries (仅限早期钩子)
// 在 AJAX 中我们模拟一个轻量级查询检测,或者直接显示子比主题优化后的估值
$data['db_queries'] = rand(15, 30); // 这里仅为演示,实际精确值需在主题模板钩子中捕获
}
// --- 页面耗时 (AJAX 本身的耗时) ---
$time = microtime(true) - $_SERVER["REQUEST_TIME_FLOAT"];
$data['load_time'] = number_format($time, 2);
// --- 在线人数 (简易版: 使用 Transient 缓存) ---
$online_users = zibll_get_online_users();
$data['online_users'] = $online_users;
// 返回数据
wp_send_json_success($data);
}
// 辅助函数:简易在线人数统计
function zibll_get_online_users() {
$transient_key = 'zibll_active_users';
$timeout = 300; // 5分钟内算在线
// 获取当前用户 IP
$ip = $_SERVER['REMOTE_ADDR'];
$time = current_time('timestamp');
// 从缓存获取在线列表
$online = get_transient($transient_key);
if (!$online) {
$online = array();
}
// 移除过期用户,更新当前用户
foreach ($online as $user_ip => $last_time) {
if (($time - $last_time) > $timeout) {
unset($online[$user_ip]);
}
}
$online[$ip] = $time;
// 保存回缓存
set_transient($transient_key, $online, $timeout);
return count($online);
}
[/hidecontent]

