织梦广告JS代码如何实现新窗口打开?

99ANYc3cd6
预计阅读时长 19 分钟
位置: 首页 织梦建站 正文

场景说明

我们通常在织梦后台的【广告管理】中添加广告,这个广告可以是一个图片、一个Flash,或者是一段自定义的HTML/JS代码,我们的目标就是让用户点击这个广告时,不是在当前页面跳转,而是在一个新的浏览器窗口或标签页中打开链接。

织梦 广告 js 代码 新窗口
(图片来源网络,侵删)

直接修改后台广告代码(最直接)

这种方法适用于您在后台添加广告时,可以直接控制链接行为,它主要利用了HTML标签的 target="_blank" 属性。

如果广告是“图片广告”

这是最简单的情况。

  • 后台操作

    1. 进入织梦后台:广告管理 -> 我的广告 -> 增加广告
    2. 广告类型选择“图片广告”。
    3. 在“广告链接”输入框中,填入您要跳转的URL,https://www.example.com
    4. 在“上传广告图片”或“输入广告代码”区域,上传您的图片。
    5. 关键步骤:确保您上传的图片本身没有 <a> 标签,织梦在生成图片广告时,会自动将图片包裹在一个 <a> 标签中,并使用您填写的“广告链接”。

    生成的HTML代码大致是这样的:

    织梦 广告 js 代码 新窗口
    (图片来源网络,侵删)
    <a href="https://www.example.com">
        <img src="/uploads/ad/image.jpg" alt="广告图片">
    </a>

    要让它在新窗口打开,我们只需要给 <a> 标签加上 target="_blank" 即可。

  • 如何实现: 织梦的图片广告有一个“是否新窗口打开”的选项,勾选它即可,如果没有这个选项,或者您想手动控制,可以修改织梦的源文件。

    手动修改文件(不推荐,升级会失效): 文件路径:/include/dedetag.class.php 搜索 MakeOneAd 函数,找到生成图片广告的代码段,在 <a> 标签里加上 target="_blank"

    更推荐的方式: 如果您的广告是图片,并且织梦后台没有提供“新窗口打开”的勾选项,那么最简单的方法是使用方法二,将图片广告当作“自定义代码”来添加。

    织梦 广告 js 代码 新窗口
    (图片来源网络,侵删)

如果广告是“自定义代码广告” (推荐)

这种方法最灵活,适用于任何类型的广告(图片、Flash、JS脚本等)。

  • 后台操作

    1. 进入织梦后台:广告管理 -> 我的广告 -> 增加广告
    2. 广告类型选择“自定义代码”。
    3. 在“广告代码”输入框中,手动编写包含 target="_blank" 属性的HTML代码。
  • 代码示例

    示例A:点击图片在新窗口打开 假设您的广告图片是 /uploads/ad/my-ad.jpg,要跳转到 https://www.target-site.com。 在“广告代码”框中,不要只放 <img> 标签,而是放完整的 <a><img>

    <a href="https://www.target-site.com" target="_blank">
        <img src="/uploads/ad/my-ad.jpg" alt="我的广告" border="0">
    </a>

    这样,当用户点击图片时,就会在新窗口打开目标网站。

    示例B:点击一段文字或Flash在新窗口打开 如果您的广告是一段文字或一个Flash动画:

    <!-- 文字广告 -->
    <a href="https://www.target-site.com" target="_blank">点击这里,了解最新产品!</a>
    <!-- Flash广告 (注意替换src路径) -->
    <a href="https://www.target-site.com" target="_blank">
        <object type="application/x-shockwave-flash" data="/uploads/ad/flash-ad.swf" width="468" height="60">
            <param name="movie" value="/uploads/ad/flash-ad.swf" />
        </object>
    </a>

通过修改JS模板文件(更规范、推荐)

这种方法适用于您已经通过后台添加了广告,但不想修改后台数据,或者广告是由JS代码动态加载的情况,织梦的广告系统会生成一个JS调用代码,我们修改这个JS模板,让所有通过此模板加载的广告都默认在新窗口打开。

操作步骤:

  1. 找到JS模板文件 织梦的JS广告模板文件位于: /templets/default/ads/ 目录下。 这个目录下会有很多 .js 文件,top.js (顶部广告)、footer.js (底部广告)等,您需要修改的是您当前正在使用的那个JS文件,如果您不确定是哪个,可以在您网站页面的HTML源码中搜索广告相关的 <script> 标签,通常能找到路径。

  2. 编辑JS模板文件 用文本编辑器(如VS Code, Sublime Text, Notepad++)打开您需要修改的JS文件(top.js)。

  3. 修改代码 在JS文件中,找到生成广告 <a> 标签的部分,通常是在一个 document.write() 函数中,找到类似 "<a href='"+ad.link+"'" 的代码。

    原始代码可能长这样:

    document.write("<a href='"+ad.link+"' target='_blank'>");
    document.write("<img src='"+ad.file+"' width='"+ad.width+"' height='"+ad.height+"' border='0'>");
    document.write("</a>");

    注意:有些模板可能已经包含了 target='_blank',您只需要检查并确认即可。

    如果您的模板代码中没有 target='_blank',请修改为如下代码: 我们将在 <a> 标签中直接加入 target="_blank"

    修改后的代码:

    // 在 href 属性后面,> 符号前面,加上 target="_blank"
    document.write("<a href='"+ad.link+"' target='_blank'>");
    document.write("<img src='"+ad.file+"' width='"+ad.width+"' height='"+ad.height+"' border='0'>");
    document.write("</a>");

    一个更健壮的写法(推荐): 为了避免JS代码出错,最好加上一些判断,特别是当广告没有链接时(ad.link 为空)。

    if (ad.link) {
        // 如果有链接,则生成一个带 target="_blank" 的 a 标签
        document.write("<a href='" + ad.link + "' target='_blank' rel='noopener'>");
    }
    // 输出广告内容(图片、Flash或文本)
    if (ad.filetype == 'swf') {
        // Flash 广告处理
        document.write("<object type='application/x-shockwave-flash' data='" + ad.file + "' width='" + ad.width + "' height='" + ad.height + "'>");
        document.write("<param name='movie' value='" + ad.file + "' />");
        document.write("</object>");
    } else {
        // 图片或文本广告处理
        document.write(ad.text || "<img src='" + ad.file + "' width='" + ad.width + "' height='" + ad.height + "' border='0' alt='" + ad.title + "' />");
    }
    if (ad.link) {
        // 如果有链接,关闭 a 标签
        document.write("</a>");
    }

    rel='noopener' 的作用:这是一个非常重要的安全属性,使用 target="_blank" 时,新打开的页面可以通过 window.opener 访问和控制原始页面的JavaScript上下文,这存在安全风险。rel="noopener" 可以阻止这种行为,提高安全性。

  4. 保存并刷新 保存修改后的 .js 文件,然后清空一下浏览器缓存,或者刷新您的网站页面,您就会发现所有通过这个JS模板加载的广告都会在新窗口打开了。


总结与对比

方法 优点 缺点 适用场景
直接修改代码 - 简单直接,针对单个广告
- 无需修改文件
- 不灵活,如果广告多,每个都要手动设置
- 修改后台源码会在升级后失效
- 只需修改一两个特定广告
- 对技术不熟悉,只想快速解决问题
修改JS模板 - 一劳永逸,所有使用该模板的广告都会生效
- 符合规范,升级后不受影响
- 更安全,可加入 rel='noopener'
- 需要定位和编辑文件
- 需要了解一点JS代码
- 网站中多处使用广告,需要统一行为
- 追求规范、可维护的代码
- 长期维护的网站

强烈推荐使用方法二,因为它更专业、更稳定,也更能体现织梦模板系统的灵活性。

-- 展开阅读全文 --
头像
织梦尾缀 index.html
« 上一篇 2025-12-16
织梦pagesize是什么意思?
下一篇 » 2025-12-16

相关文章

取消
微信二维码
支付宝二维码