飘窗广告是网站广告的常见类型，这一技术现在通常会通过图片+链接的形式，用于展示专题信息或焦点内容。
今天接到网警蜀黍的微信，希望在网站上挂个打谣反诈的飘窗，帮助他们搞一下宣传。这么正能量的请求，当然义不容辞，我立马开始行动。
他们给我的文件包中，有一个 html 主文件，两张展示图片，一个 CSS 文件和一个 JavaScript 文件。点击 html 文件打开，就出现了飘窗内容。
按照一般的功能实现思路，就是要在访客打开网站时，自动加载这个 html 文件即可。
在 WordPress 中加载某个HTML文件，可以通过PHP的include或require函数来实现。以下是一个简单的步骤和示例代码：
-
将你的 HTML 文件放在 WordPress 主题的目录中，比如
footer.html。 -
在你想要加载这个 HTML 文件的 WordPress 模板文件中（比如
footer.php），使用 PHP 代码来加载它。
示例代码：
<?php
// 假设你的HTML文件名为footer.html，位于当前WordPress主题目录下
$html_file_path = get_template_directory() . '/footer.html';
// 检查文件是否存在
if(file_exists($html_file_path)) {
// 加载HTML文件内容
include($html_file_path);
} else {
// 文件不存在的错误处理
echo "文件不存在：" . $html_file_path;
}
?>
确保你的 HTML 文件只包含 HTML 代码，不包含任何 PHP 代码。如果你需要在 HTML 文件中使用 PHP 变量，你可能需要将 HTML 文件视为 PHP 文件，即将.html改为.php，然后在文件中使用 PHP 标记<?php ... ?>来包裹 PHP 代码。
经亲身实践，添加以上代码到当前主题的 footer.html 文件中，实现了访问网站时飘窗广告功能。
有一点要注意，html 文件中，路径地址要引用绝对地址，用相对地址出错，即只包含 HTML 代码。另外，他们提供的图片，尺寸比较大，加载速度慢，修改尺寸到合适大小，有利于提升访问体验。
历史上的今天:
- 2025: 卖了一个域名 (10)
- 2023: 7月5日，世界比基尼日 (0)
- 2023: 7月5日，世界羽毛球日 (0)
- 2022: 参加市羽协举办的羽毛球比赛 (0)
不是我说，整个固定广告位都比这种上世纪牛皮癣广告好看（无贬义），而且对整个博客的观感也不会有多大破坏
@GoodBoyboy 固定广告位对整个网页的观感破坏小。
这种满屏飘来飘去的广告真的很恶心 固定式的勉强还可以接受
@刘郎 的确是很拉低访客体验
小心这种飘窗很容易被搜索引擎惩罚的，至少谷歌是严重不新欢的哦！
@明月登楼 好的，帮他们挂几天就撤了。