WordPress站点如何添加网站运行时间

最终效果

实现方法

登录 WordPress 网站后台，前往 Appearance > Widgets，在相应的 Foot Widget Area 添加一段 Custom HTML 代码。最后再把这个 Foot Widget 放置到合适的页脚区域。

具体步骤

1. 登录 WordPress 网站后台；

2. 前往 Appearance > Widgets；

3. 网站运行时间通常是显示在网站页脚部分。我们可以选择一个 Foot Widget Area，然后点击 + 号，添加一个 Custom HTML block。

4. 在 Custom HTML block 中，添加如下代码：

<!-- 网站运行计时统计 start-->
<left>
<span id="momk"></span><span id="momk" style="color: #ff0000;"></span>
<script type="text/javascript">
    function NewDate(str) {
        str = str.split('-');
        var date = new Date();
        date.setUTCFullYear(str[0], str[1] - 1, str[2]);
        date.setUTCHours(0, 0, 0, 0);
        return date;
    }
    function momxc() {
        var birthDay = NewDate("2022-01-14");//设置你网站的建站时间
        var today = new Date();
        var timeold = today.getTime() - birthDay.getTime();
        var sectimeold = timeold / 1000
        var secondsold = Math.floor(sectimeold);
        var msPerDay = 24 * 60 * 60 * 1000; var e_daysold = timeold / msPerDay;
        var daysold = Math.floor(e_daysold);
        var e_hrsold = (daysold - e_daysold) * -24;
        var hrsold = Math.floor(e_hrsold);
        var e_minsold = (hrsold - e_hrsold) * -60;
        var minsold = Math.floor((hrsold - e_hrsold) * -60); var seconds = Math.floor((minsold - e_minsold) * -60).toString();
        document.getElementById("momk").innerHTML = "本站已安全运行" + daysold + "天" + hrsold + "小时" + minsold + "分" + seconds + "秒";
        setTimeout(momxc, 1000);
    } momxc();
</script>
<style>
    #momk {
        animation: change 10s infinite;
        font-weight: 800;
    }
    @keyframes change {
        0% {
            color: #5cb85c;
        }
        25% {
            color: #556bd8;
        }
        50% {
            color: #e40707;
        }
        75% {
            color: #66e616;
        }
        100% {
            color: #67bd31;
        }
    }
</style>
</left>
<!-- 网站运行计时统计 over-->

或者添加下面这段代码（无变色效果，参考 ilolicon Blog 提供的教程）

<?php
$uptime_text = file_get_contents("/proc/uptime");
$uptime = substr($uptime_text,0,strpos($uptime_text," "));
if (!$uptime && function_exists('shell_exec')) $uptime = shell_exec("cut -d. -f1 /proc/uptime");
$days = floor($uptime/60/60/24);
$hours = str_pad($uptime/60/60%24,2,"0",STR_PAD_LEFT);
$mins = str_pad($uptime/60%60,2,"0",STR_PAD_LEFT);
$secs = str_pad($uptime%60,2,"0",STR_PAD_LEFT);
 
echo "本站已苟延残喘运行了$days Days $hours:$mins:$secs";
?>

添加完成后，可点击 Preview 预览一下效果：

5. 预览没有问题后，点击右上角的 Update 应用改动。

6. 回到 WordPress后台，前往 Appearance > Customize。找到自己 WordPress 主题编辑器的页脚编辑设置部分，把步骤4中设置好的 Widget Area 拖动到相应的页脚区域，最后再点击左上角的 Public 按钮发布网站改动即可。

Credits: Image by Dok Sev from Pixabay

参考资料：网站底部运行时间统计