[网页]：Puock侧边栏设计

1、侧边栏计时器

<div class="site-runtime" style="font-family: 'Microsoft YaHei', sans-serif; font-size: 14px; color: #666; padding: 8px 0;">
    <span id="website_runtime">计算运行时间中...</span>
</div>

<script>
(function() {
    const startDate = new Date("2024-08-01T23:00:00");
    const runtimeElement = document.getElementById('website_runtime');
    
    function updateRuntime() {
        const now = new Date();
        const diff = now - startDate;
        
        const days = Math.floor(diff / 86400000);
        const hours = Math.floor((diff % 86400000) / 3600000);
        const minutes = Math.floor((diff % 3600000) / 60000);
        const seconds = Math.floor((diff % 60000) / 1000);
        
        runtimeElement.textContent = `本站已运行 ${days} 天 ${hours} 时 ${minutes} 分 ${seconds} 秒`;
        
        // 更精确的时间控制
        const nextUpdate = 1000 - (now % 1000);
        setTimeout(updateRuntime, nextUpdate);
    }
    
    // 页面加载完成后开始
    if (document.readyState === 'loading') {
        document.addEventListener('DOMContentLoaded', updateRuntime);
    } else {
        updateRuntime();
    }
})();
</script>

2.公告栏链接色块

<div style="display: flex; justify-content: center; gap: 15px; margin-top: 18px;">
  <!-- 蓝色按钮 -->
  <div>
    <a href="https://lifetruth.top/tag/%e3%80%8a%e4%ba%b2%e5%af%86%e5%85%b3%e7%b3%bb%e3%80%8b/" 
       target="_blank" 
       style="background: #3498db; 
              color: white; 
              padding: 9px 20px;  /* 高度缩小1/4 */
              border-radius: 6px; 
              text-decoration: none; 
              display: inline-block; 
              border: none;">
      蓝色按钮
    </a>
  </div>
  
  <!-- 红色按钮 -->
  <div>
    <a href="YOUR_RED_BUTTON_LINK_HERE" 
       target="_blank" 
       style="background: #e74c3c; 
              color: white; 
              padding: 9px 20px;  /* 高度缩小1/4 */
              border-radius: 6px; 
              text-decoration: none; 
              display: inline-block; 
              border: none;">
      红色按钮
    </a>
  </div>
</div>

3、侧边栏标签云添加

建议设置标签<10个，可在菜单中对应id进行筛选。

另外图标可在Font Awesome Web 应用图标 | 菜鸟教程中挑选。