WordPress 网站如何实现飘窗广告功能?

飘窗广告是网站广告的常见类型,这一技术现在通常会通过图片+链接的形式,用于展示专题信息或焦点内容。

今天接到网警蜀黍的微信,希望在网站上挂个打谣反诈的飘窗,帮助他们搞一下宣传。这么正能量的请求,当然义不容辞,我立马开始行动。

他们给我的文件包中,有一个 html 主文件,两张展示图片,一个 CSS 文件和一个 JavaScript 文件。点击 html 文件打开,就出现了飘窗内容。

按照一般的功能实现思路,就是要在访客打开网站时,自动加载这个 html 文件即可。

在 WordPress 中加载某个HTML文件,可以通过PHP的includerequire函数来实现。以下是一个简单的步骤和示例代码:

  1. 将你的 HTML 文件放在 WordPress 主题的目录中,比如footer.html

  2. 在你想要加载这个 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 代码。另外,他们提供的图片,尺寸比较大,加载速度慢,修改尺寸到合适大小,有利于提升访问体验。


历史上的今天:

相关推荐

如何禁止 AI 抓取网站内容用于其训练

目前各大 AI 公司都通过抓取网站内容用于其 AI 训练。搜索引擎抓取内容后会给网站流量,AI 抓取内容用于训练后,像 ChatGPT 和 Google Gemini 基本不给出处,所以网站得不到流量。因此,我们要让网站禁止 AI 蜘蛛抓取。 怎样禁止 AI 抓取网站内容?目前看,还是用 robots 文件禁止访问最方便。 8月份,OpenAI 发布了他们 ...

如何解决更新 WordPress 需要访问您网页服务器的权限问题?

网站提示有 WordPress 更新可用,但在线更新时却提示:要执行请求的操作,WordPress需要访问您网页服务器的权限。请输入您的 FTP 登录凭据以继续。 我输入 FTP 登录用户名和密码,网页无响应。我猜测会否主机名错误了,就填写了 FTP 地址,仍然是错误的。 网络搜索了一下,有网友遇到相同问题,给出的解决办法是,在 Wor ...

WordPress 在线更新失败,原因竟是 cURL 组件出了错

我有更新升级程序的执念,看到有新版而不能更新,心里会特别纠结。但我的 WordPress 程序和主题、插件,近半年多来一直不能在线更新,让我特别的不爽。 之前认为是网络访问的问题,由于 wordpress.org 网站在国外,很容易会被屏蔽,使用 WP-China-Yes 插件就解决了。详见(WordPress 更新插件出现"下载失败。cURL error ...

老薛主机发生服务器数据库异常(附修复方法)

7月1日,访问托管在老薛主机香港虚拟主机上的网站,发现无法访问,原因是 MySQL 数据库无法连接。 登录老薛主机管理后台,提示为“服务器数据库异常”:由于数据库系统表损坏,导致服务器数据库异常,目前我们正在处理中。 到中午11点,官方表示部分数据库已经恢复,恢复进度约1/2,恢复的用户可以在控制面板查询。 登录 c ...

6 条评论

  1. 不是我说,整个固定广告位都比这种上世纪牛皮癣广告好看(无贬义),而且对整个博客的观感也不会有多大破坏

  2. 这种满屏飘来飘去的广告真的很恶心 固定式的勉强还可以接受

  3. 小心这种飘窗很容易被搜索引擎惩罚的,至少谷歌是严重不新欢的哦!

发表评论

您的电子邮件地址不会被公开,必填项已用*标注。