1.找到你的Typecho主题的模板文件(通常在 usr/themes/[你的主题名]/ 目录下)。
2.编辑你的主题的 footer.php 文件,在合适的位置(通常在页面底部)添加以下代码:
<?php if (!isset($_COOKIE['displayPopup']) || $_COOKIE['displayPopup'] != 'yes'): ?>
<script>
function openPopup() {
document.getElementById('popup').style.display = 'block';
document.getElementById('fade').style.display = 'block';
}
function closePopup() {
document.getElementById('popup').style.display = 'none';
document.getElementById('fade').style.display = 'none';
var expires = new Date();
expires.setTime(expires.getTime() + (1 * 24 * 60 * 60 * 1000)); // 设置Cookie保存1天
document.cookie = "displayPopup=yes; expires=" + expires.toUTCString() + "; path=/";
}
window.onload = function() {
openPopup(); // 页面加载时显示弹窗
};
</script>
<div id="popup" style="display:none; width:500px; height:300px; position:fixed; top:50%; left:50%; margin-left:-250px; margin-top:-150px; z-index:1001;">
<a href="javascript:void(0)" onclick="closePopup()" style="float:right;">关闭</a>
<img src="your_popup_image.jpg" width="500" height="300" />
</div>
<div id="fade" style="display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:#000; filter:alpha(opacity=70); -moz-opacity:0.7; opacity:0.7; z-index:1000;"></div>
<?php endif; ?>
3.将 your_popup_image.jpg 替换为你想要显示的弹窗内容的图片地址。
4.如果你想要关闭弹窗后不再显示,确保你有正确设置Cookie。
这段代码会在用户访问网站时加载弹窗,并在用户关闭弹窗后设置一个Cookie,使得用户在接下来的24小时内不会再看到弹窗。这是一个简单的实现,你可以根据需要添加更多的样式和功能。
本文共1313个字符,其中有 182 个汉字,平均阅读时长 ≈ 5分钟
评论