纯代码给wordpress添加倒计时模块 可任意自定义倒计时内容

一、wordpress代码

1、进入WordPress网站后台

2、选择外观-小工具-添加自定义html小工具。

3、填写如下代码:

<div class="gn_box">
    <h1><center><font color=#E80017>2</font><font color=#D1002E>0</font><font color=#BA0045>2</font><font color=#A3005C>0</font><font
            color=#8C0073>年</font><font color=#75008A>-</font><font color=#5E00A1>新</font><font
            color=#4700B8>年</font><font color=#3000CF>倒</font><font color=#1900E6>计</font><font color=#0200FD>时</font>
    </center></h1>
    <center>
        <div id="CountMsg" class="HotDate">
            <span id="t_d">157 天</span>
            <span id="t_h">9 时</span>
            <span id="t_m">7 分</span>
            <span id="t_s">42 秒</span>
        </div>
    </center>
    <script type="text/javascript"> function getRTime() {
        var EndTime = new Date('2020/01/25 00:00:00');
        var NowTime = new Date();
        var t = EndTime.getTime() - NowTime.getTime();
        var d = Math.floor(t / 1000 / 60 / 60 / 24);
        var h = Math.floor(t / 1000 / 60 / 60 % 24);
        var m = Math.floor(t / 1000 / 60 % 60);
        var s = Math.floor(t / 1000 % 60);
        document.getElementById("t_d").innerHTML = d + " 天";
        document.getElementById("t_h").innerHTML = h + " 时";
        document.getElementById("t_m").innerHTML = m + " 分";
        document.getElementById("t_s").innerHTML = s + " 秒";
    }
    setInterval(getRTime, 1000);
    </script>
</div>

 

4、点击保存,即可前台浏览查看。

二、其他网站代码

<div class="gn_box">
    <h1><center><font color=#E80017>2</font><font color=#D1002E>0</font><font color=#BA0045>2</font><font color=#A3005C>0</font><font
            color=#8C0073>年</font><font color=#75008A>-</font><font color=#5E00A1>新</font><font
            color=#4700B8>年</font><font color=#3000CF>倒</font><font color=#1900E6>计</font><font color=#0200FD>时</font>
    </center></h1>
    <center>
        <div id="CountMsg" class="HotDate">
            <span id="t_d">157 天</span>
            <span id="t_h">9 时</span>
            <span id="t_m">7 分</span>
            <span id="t_s">42 秒</span>
        </div>
    </center>
    <script type="text/javascript"> function getRTime() {
        var EndTime = new Date('2020/01/25 00:00:00');
        var NowTime = new Date();
        var t = EndTime.getTime() - NowTime.getTime();
        var d = Math.floor(t / 1000 / 60 / 60 / 24);
        var h = Math.floor(t / 1000 / 60 / 60 % 24);
        var m = Math.floor(t / 1000 / 60 % 60);
        var s = Math.floor(t / 1000 % 60);
        document.getElementById("t_d").innerHTML = d + " 天";
        document.getElementById("t_h").innerHTML = h + " 时";
        document.getElementById("t_m").innerHTML = m + " 分";
        document.getElementById("t_s").innerHTML = s + " 秒";
    }
    setInterval(getRTime, 1000);
    </script>
</div>

 

 

原创文章,作者:陌涛,如若转载,请注明出处:https://imotao.com/3581.html

赞 (0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
陌涛陌涛
上一篇 2020年8月12日 下午6:30
下一篇 2020年8月12日 下午6:33

相关推荐

  • PHP 7.4 的生命周期即将结束,这对您的 WordPress 网站意味着什么?

    PHP 7.4 生命周期即将结束,因为 PHP 版本将从2022 年11月28日起停止接收任何安全更新。超过

    2022年11月24日
    1.0K00
  • 如何解决wp网站MySQL经常性关闭

    近期有客户反映,自己的wp网站程序安装的时候好好的,使用一两天后就出现数据库连接失败的情况。导致这个问题的原因一般是服务器的MySQL负载过高,吃了大量内存。如果是安装了宝塔的用户…

    2022年10月2日
    1.0K00
  • WordPress SEO设置的终极指南

    搜索引擎优化SEO,是为博客或网站获得流量的必需之法。然而,让新站点利于搜索是个挑战,特别是对于那些没有很多网络开发经验的人来说。但是,WordPress为用户提供了许多简单的方法…

    2020年8月12日
    81100
  • xampp安装wordpress

    首先安装xampp,过程略。 设置好了XAMPP XAMPP集成环境apache启动失败 打开浏览器在地址栏输入127.0.01:8000,如图下所示就说明安装成功了。 去word…

    2020年9月28日
    76200
  • wordpress网站利用Redis加载速度优化

    写在前面 为了提升网站速度,降低MySQL的负载,通常都需要将数据缓存到内存中 常用的就是memcached、redis,但是相对来说Redis更符合需求,而且也更通用当然也可以用…

    2021年1月23日
    81600
  • 在WordPress主题中添加一个复制按钮

    有时可能需要在WordPress主题中添加一个复制按钮,方便用户复制链接或验证码之类的,这里提供一段简单的复制代码,供参考。 html代码: js代码: 代码实现同时复制一段文字和…

    2023年12月7日
    72500
  • WordPress启用HSTS,增强用户信任和网站安全性

    如果您的Web服务器没有在下面列出,可以使用PHP方法(所有服务器及任何通过PHP编写的Web程序通用) 下列配置方法都需要修改配置文件(PHP方法除外),如果你找不到需要的配置文…

    2024年5月3日
    1.1K01
  • 将远程图片保存至本地

    自动保持远程图片到本地,并且自动生成缩略图 可将远程图片保存至本地,搬运文章更加方便。 2016版 点击下载 提取码:n77j

    2019年10月17日
    1.2K00
  • WordPress 非常漂亮滴动态时间小工具

    效果如下: 使用 下载页底提供的clock.js文件 使用如下代码加载该JS并展示 下载地址 百度网盘 链接:https://pan.baidu.com/s/14QZXIUrkAE…

    2021年3月25日
    74300
  • All-in-One WP Migration

    该插件无需技术知识即可导出您的WordPress网站,包括数据库,媒体文件,插件和主题。 PHP默认上传体积为2M,你可以参考以下教程修改: https://imotao.com/…

    2019年10月17日
    97100

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

这个站点使用 Akismet 来减少垃圾评论。了解你的评论数据如何被处理。