<?php
// 获取当前日期
$current_date = date('Y-m-d');

// 指定起始日期和结束日期
$start_date = '2023-09-13'; // 起始日期
$end_date = '2023-10-08';   // 结束日期

// 检查当前日期是否在指定范围内
if ($current_date >= $start_date && $current_date <= $end_date) {
    // 在右上角添加节日氛围图片
    echo '<div class="holiday-atmosphere" style="position: absolute; top: 20px; right: 20px; z-index: 999;">
                <img src="xxx/xxx/xx6-1.png" alt="节日氛围图片" style="width: 200px; height: 200px;">
            </div>';
}
?>

<img src=”xxx/xxx/xx6-1.png” alt=”节日氛围图片” style=”width: 200px; height: 200px;”> 将这段代码中的“xxx/xxx/xx6-1.png”改为你的图片地址就可以了

  1. 在代码中添加日期检查逻辑。首先，您需要获取当前日期并将其与您希望显示图像的起始日期和结束日期进行比较。
  2. 如果当前日期在指定的日期范围内，就显示图像，否则不显示。

效果图：

中秋国庆来了，给自己的WordPress网站添加节日氛围图片吧-米宝教室

增加自动关闭功能


        <!-- 在右上角添加节日氛围图片 -->
        <?php
        // 获取当前日期
        $current_date = date('Y-m-d');

        // 指定起始日期和结束日期
        $start_date = '2023-09-13'; // 起始日期
        $end_date = '2023-10-08';   // 结束日期

        // 检查当前日期是否在指定范围内
        if ($current_date >= $start_date && $current_date <= $end_date) :
        ?>
        <div class="holiday-atmosphere" style="position: absolute; top: 20px; right: 20px; z-index: 999;">
            <img src="xxx/xxx/xx6-1.png" alt="节日氛围图片" style="width: 200px; height: 200px;">
            <!-- JavaScript 代码 -->
            <script>
                // 延迟3秒后关闭节日氛围图片
                setTimeout(function() {
                    var holidayAtmosphere = document.querySelector('.holiday-atmosphere');
                    if (holidayAtmosphere) {
                        holidayAtmosphere.style.display = 'none';
                    }
                }, 3000); // 3000 毫秒等于 3 秒
            </script>
        </div>

难度升级 在移动端自动关闭而在电脑端需要手动关闭

在移动端显示5秒钟后自动关闭，在电脑端的浏览器不自动关闭，改为手动关闭

 <script>
        // 检测是否为移动设备
        function isMobileDevice() {
            return /Android|iPhone|iPad|iPod|Windows Phone/i.test(navigator.userAgent);
        }

        // 获取当前日期
        var current_date = new Date().toISOString().slice(0, 10);

        // 指定起始日期和结束日期
        var start_date = '2023-09-13'; // 起始日期
        var end_date = '2023-10-08';   // 结束日期

        // 检查当前日期是否在指定范围内
        if (current_date >= start_date && current_date <= end_date) {
            // 在右上角添加节日氛围图片
            var holidayAtmosphere = document.createElement("div");
            holidayAtmosphere.className = "holiday-atmosphere";
            holidayAtmosphere.style.position = "absolute";
            holidayAtmosphere.style.top = "20px";
            holidayAtmosphere.style.right = "20px";
            holidayAtmosphere.style.zIndex = "999";
            
            var holidayImage = document.createElement("img");
            holidayImage.src = "xxx/2023/09/xxx.png";
            holidayImage.alt = "节日氛围图片";
            holidayImage.style.width = "300px";
            holidayImage.style.height = "300px";

            holidayAtmosphere.appendChild(holidayImage);
            document.body.appendChild(holidayAtmosphere);
            
            // 检测是否为移动设备
            if (isMobileDevice()) {
                // 延迟5秒后自动关闭节日氛围图片
                setTimeout(function() {
                    var holidayAtmosphere = document.querySelector(".holiday-atmosphere");
                    if (holidayAtmosphere) {
                        holidayAtmosphere.style.display = "none";
                    }
                }, 5000); // 5000 毫秒等于 5 秒
            }
        }
    </script>

holidayImage.src = “xxx/2023/09/xxx.png”; 更改这段代码中的图片地址

这段代码是纯粹的JavaScript。请确保在HTML页面内适当的位置添加它

建议将其放在<body > <!– 页面内容 –> </body>之间。