给wordpress网站添加2025新年倒计时显示

使用GreenShift插件给网站添加新年倒计时

2025的农历新年就快到了，悦然wordpress建站给大家分享一下如何给网站添加倒计时模块。其实前两年我也分享过类似的教程，大家也可以去看看。如上面就是去年分享的，使用greenshift插件的倒计时模块来制作，这个可以制作出更漂亮的倒计时效果。

<div id="countdown" style="font-size: 24px; text-align: center; margin-top: 20px;">  
    <h2 style="color: #CF2E2E;"> 🎇 距离2025农历新年还有 🎆</h2>  
    <div id="timer" style="color: #007CBA;">  ⏰ 
        <span id="days"></span>天   
        <span id="hours"></span>小时   
        <span id="minutes"></span>分钟   
        <span id="seconds"></span>秒
    </div>  
</div>  

<script>  
    // 设置目标日期  
    const targetDate = new Date("January 29, 2025 00:00:00").getTime();  

    // 更新倒计时  
    const countdownFunction = setInterval(function() {  
        const now = new Date().getTime();  
        const distance = targetDate - now;  

        // 计算时间单位  
        const days = Math.floor(distance / (1000 * 60 * 60 * 24));  
        const hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));  
        const minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));  
        const seconds = Math.floor((distance % (1000 * 60)) / 1000);  

        // 显示结果  
        document.getElementById("days").innerHTML = days;  
        document.getElementById("hours").innerHTML = hours;  
        document.getElementById("minutes").innerHTML = minutes;  
        document.getElementById("seconds").innerHTML = seconds;  

        // 如果倒计时结束  
        if (distance < 0) {  
            clearInterval(countdownFunction);  
            document.getElementById("timer").innerHTML = "祝您新年快乐！";  
        }  
    }, 1000);  
</script>

今天再给大家分享一个HTML代码方式，更简单一些，可能直接复制代码使用。上面的文字提示可以自己修改，图标使用的是emoji表情，也可以自行修改。（emoji表情复制→https://www.zsxxfx.com/yrwpemoji/）

代码修改好后可以添加到任意位置，可以使用古腾堡或elementor的HTML模块，把代码粘贴进去就可能了。也可以添加到网站的小工作中，在侧边栏显示。

最终显示效果参考上图。

另外要注意一下，春节过后这个模块最好把它删掉哦。