位置:首页 > JavaScript > 网页中如何动态显示未来日期的月份和日期

网页中如何动态显示未来日期的月份和日期

时间:2026-08-17  |  作者:星河游者  |  阅读:0

本文介绍如何在WordPress 中通过自定义短代码,动态显示从当前日期起24天后的未来日期(格式为“Dec 6”),适用于WPBakery等可视化编辑器,无需手动更新。

如何在网页中动态显示未来日期(仅月份和日)

本文介绍如何在WordPress 中通过自定义短代码,动态显示从当前日期起24天后的未来日期(格式为“Dec 6”),适用于WPBakery等可视化编辑器,无需手动更新。

想在WordPress里实现“未来日期动态展示”,比如“This item will deliver in: Dec 6”,其实并不复杂。

只需一小段轻量级的PHP代码,就能完成。

这套方案与WPBakery Page Builder(原Visual Composer)完全兼容。

无论是文本模块、文本块,还是自定义HTML区域,都可以直接插入短代码,让日期自动渲染,后续基本不用额外维护。

实现步骤

  1. 将以下代码添加到当前主题的 functions.php 文件末尾(建议使用子主题,避免主题更新时丢失):

    function delivery_date_shortcode() {
    $today = new DateTime();
    $delivery_date = $today->modify('+24 days');
    $formatted_date = $delivery_date->format('M j'); // 输出示例:Dec 6
    
    return "This item will deliver in: {$formatted_date}";
    }
    add_shortcode('delivery_date', 'delivery_date_shortcode');
  2. 在WPBakery编辑器中插入短代码

    • 编辑页面 → 添加“Text Block”或“Custom HTML”模块 → 输入:

      [delivery_date]
    • 保存并预览,页面将实时显示类似 This item will deliver in: Dec 6 的内容(实际日期随系统时间自动计算)。

格式说明与灵活调整

  • 'M j' 是PHP日期格式符:

    • M → 3字母缩写月份(Jan, Feb, … Dec)
    • j → 不带前导零的日期(1–31)

如需其他格式,可参考:

  • 'F j' → 完整月份名(December 6)
  • 'M d' → 补零日期(Dec 06)
  • 'M j, Y' → 带年份(Dec 6, 2024)
  • 若需修改天数(如改为30天后),仅需调整 '+24 days' 中的数字即可。

注意事项

  • 确保服务器时区设置正确(推荐在WordPress后台「设置 → 通用 → 时区」中配置),否则日期可能偏差。

  • DateTime::modify() 会修改原对象,此处无副作用;但若在同一函数中多次调用,建议使用 cloneDateTimeImmutable(PHP 5.5+)提升健壮性(进阶优化)。

  • 避免直接在 functions.php 中使用 echo —— 短代码必须 return 字符串,否则可能导致布局错乱。

该方案轻量、可靠、零依赖,完美适配WordPress生态与可视化构建器,让交付日期始终精准、自动、专业。

免责声明:文中图文均来自网络,如有侵权请联系删除,心愿游戏发布此文仅为传递信息,不代表心愿游戏认同其观点或证实其描述。

相关文章

更多

精选合集

更多

大家都在玩

热门话题

大家都在看

更多