飘窗广告是网站广告的常见类型,这一技术现在通常会通过图片+链接的形式,用于展示专题信息或焦点内容。
今天接到网警蜀黍的微信,希望在网站上挂个打谣反诈的飘窗,帮助他们搞一下宣传。这么正能量的请求,当然义不容辞,我立马开始行动。
他们给我的文件包中,有一个 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 代码。另外,他们提供的图片,尺寸比较大,加载速度慢,修改尺寸到合适大小,有利于提升访问体验。
不是我说,整个固定广告位都比这种上世纪牛皮癣广告好看(无贬义),而且对整个博客的观感也不会有多大破坏
@GoodBoyboy 固定广告位对整个网页的观感破坏小。
这种满屏飘来飘去的广告真的很恶心 固定式的勉强还可以接受
@刘郎 的确是很拉低访客体验
小心这种飘窗很容易被搜索引擎惩罚的,至少谷歌是严重不新欢的哦!
@明月登楼 好的,帮他们挂几天就撤了。