前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >百度联盟SSP媒体广告异步加载代码最优解决方案

百度联盟SSP媒体广告异步加载代码最优解决方案

作者头像
李洋博客
发布2023-03-03 15:06:29
7850
发布2023-03-03 15:06:29
举报
文章被收录于专栏:李洋博客李洋博客

相信很多站长跟我一样,建站之后第一时间就会去做百度、谷歌等联盟广告,原因很简单,就是希望能给自己增加一丢丢的收入,虽然可能几个月才收到100块(百度真小气,一个月一百块都不给我),毕竟苍蝇再小也是肉啊,有就总比没有强,但是谷歌还好,除了申请比较费劲,因人而已,有些人一次通过,有些人N次都不通过,比如,,,我的站。

百度联盟SSP媒体广告异步加载代码最优解决方案 第1张
百度联盟SSP媒体广告异步加载代码最优解决方案 第1张

退而求其次使用了百度的SSP媒体广告,在使用的过程中很多人可能直接会选择用异步加载广告代码,它有助于改善网络延迟,为网站的访问者提供更佳的用户体验。异步代码的优势在于能够确保绝不会妨碍网页的其他部分进行加载,这是官方给出的说明,但是还是能发现使用了异步加载后的网站,还是有js错误提醒,如图:

百度联盟SSP媒体广告异步加载代码最优解决方案 第2张
百度联盟SSP媒体广告异步加载代码最优解决方案 第2张

就酱婶儿的,不知道你们怎么看,至少我觉得挺烦人的,不正规,有一段时间我都想停了百度联盟的广告,对喽就是因为这个JS提醒,后来在论坛闲逛发现可以优化一下,减少JS错误提醒。

百度广告是用 document.write 同步输出到页面上的,很显然,并不能异步加载有 document.write 方法的 js 文件,所以会有该 warning,不过这个提醒并不影响广告正常显示。具体的改造方案如下:

首先我们在百度SSP媒体广告或者百青藤获取广告代码:

代码语言:javascript
复制
<script type="text/javascript">
    (window.slotbydup = window.slotbydup || []).push({
        id: "u972425",
        container: "_iizsmwq9n2",
        async: true
    });
</script>
<!-- 多条广告如下脚本只需引入一次 -->
<script type="text/javascript" src="//cpro.baidustatic.com/cpro/ui/cm.js" async="async" defer="defer" >
</script>

我们把最后的js和上面的ID值复制下来,完整代码如下:

代码语言:javascript
复制
----百度代码ID框架----
<div id="SSP_AD1"></div>

<!--广告位代码放在页面最后-->
<script type="text/javascript" src="//cpro.baidustatic.com/cpro/ui/cm.js"></script>

<!--异步加载的百度SSP广告代码格式-->
<script type="text/javascript">
	BAIDU_CLB_fillSlotAsync('5972425','SSP_AD1');
</script>

其中 5972425 是广告编号,SSP_AD1是您要投放广告的位置,DIV必须是唯一ID,否则可能出现错乱。这样操作下来就不会再有JS提示,网站速度可能也会快一丢丢(自我感觉,不知道是不是心理作用)。代码格式是固定的,但是广告id和div的ID值根据实际情况修改。

PS,如果主题模板没有给广告位预留ID,可以自己添加。

另外“<script type="text/javascript" src="//cpro.baidustatic.com/cpro/ui/cm.js"></script>”代码网页有一个就行,不用每个广告都添加,最好放在<head>标签之内。

就目前而言我感觉这个方案挺好的,至于有没有更优的方案俺就不知道了,您知道的话可以告知我,谢谢你!

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2020-09-29,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档