If you want your Fluid theme footer to show how long the site has been running, you only need to add a small block to the theme configuration and load a separate JavaScript file.
In the theme config, add the following under footer: content:
1 2 3 4 5 6 7 8 9 10 11</th>
<th>footer: content: ' <a href="https://hexo.io" target="_blank" rel="nofollow noopener"><span>Hexo</span></a> <i class="iconfont icon-love"></i> <a href="https://github.com/fluid-dev/hexo-theme-fluid" target="_blank" rel="nofollow noopener"><span>Fluid</span></a> <div style="font-size: 0.85rem"> <span id="timeDate">载入天数...</span> <span id="times">载入时分秒...</span> <script src="/js/duration.js"></script> </div> '</th>
</tr>
</thead>
<tbody>
<tr>
<td></td>
<td></td>
</tr>
</tbody>
</table>
The first three lines inside content are the default footer content used by Fluid. It is better not to remove them. You can make small adjustments if needed, but keeping the Fluid link is recommended so the theme can reach more users.
The actual uptime feature is handled by duration.js. Create the file at source/js/duration.js in your blog directory, then paste in the following code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31</th>
<th>!(function() { /** 计时起始时间，自行修改 **/ var start = new Date("2020/01/01 00:00:00"); function update() { var now = new Date(); now.setTime(now.getTime()+250); days = (now - start) / 1000 / 60 / 60 / 24; dnum = Math.floor(days); hours = (now - start) / 1000 / 60 / 60 - (24 * dnum); hnum = Math.floor(hours); if(String(hnum).length === 1 ){ hnum = "0" + hnum; } minutes = (now - start) / 1000 /60 - (24 * 60 * dnum) - (60 * hnum); mnum = Math.floor(minutes); if(String(mnum).length === 1 ){ mnum = "0" + mnum; } seconds = (now - start) / 1000 - (24 * 60 * 60 * dnum) - (60 * 60 * hnum) - (60 * mnum); snum = Math.round(seconds); if(String(snum).length === 1 ){ snum = "0" + snum; } document.getElementById("timeDate").innerHTML = "本站安全运行 "+dnum+" 天"; document.getElementById("times").innerHTML = hnum + " 小时 " + mnum + " 分 " + snum + " 秒"; } update(); setInterval(update, 1000); })();</th>
</tr>
</thead>
<tbody>
<tr>
<td></td>
<td></td>
</tr>
</tbody>
</table>
One thing to remember: change the start time in the comment-marked line to your own site launch time. Once that is done, the uptime display is ready to use.