帮助文档

网站安装万维广告代码的说明文档


网站如何安装万维广告联盟代码?

我们建议您添加广告单元时选择 非侵入式广告,理由见下。添加完成后,请根据广告代码安装页面(或点击 广告单元 页面的操作 -> 广告代码按钮)的提示在您的网站页面安装我们的广告代码,请将 Javscript 代码放置在 <head> 标签之间或 footer,HTML 代码即广告 <div> 代码放置在您欲展示广告的位置(请注意复制完整的 Javascript 和 div 代码),位置规范见下。

 

 
广告位置规范是什么?
  • 广告位置不得影响用户阅读不得在弹窗或跳转中间页面放置广告,必须放置在主要内容的上方、侧面、下方(信息流除外)。可参考如:https://zhaodao.ai/ (右侧栏顶部)或 https://cn.vuejs.org/  (右侧底部)或 https://mo.fish/ (左侧信息流)。在不同位置的点击率层面:左侧广告(如信息流)比右侧广告的点击率更高,顶部广告比底部广告点击率更高,您可以尝试将广告放到不同位置,以其获得更多收益。
  • 广告位置与网站主要内容(定义见下)应有明显区别。广告应始终可识别为广告,并且可与所有其他内容区分开。您不得隐藏或删除广告底部的“广告”文字字样(即“万维广告”字样及其链接)、不得误导用户认为广告是网站主要内容的一部分(信息流广告除外)。
  • 请勿诱导用户点击广告,诱导方式包括但不限于:在不便于最终用户区分网站内容和广告的位置放置广告(容易造成误解和误点击),在广告周围添加“请点击广告”等文字,在 Call For Action 等重要按钮旁边放置广告(容易造成误点击)等。

(“主要内容”定义为(基于 Mozilla 对<main> HTML 元素的 描述):主要内容由与文档的中心主题或应用程序的中心功能直接相关或由此扩展的内容组成。此内容对于文档应该是唯一的,不包括在一组文档中重复的任何内容,例如侧边栏、导航链接、版权信息、站点徽标和搜索表单(当然,除非文档的主要功能是搜索表单)。)

 
非侵入式广告是什么?为什么非侵入式广告的用户体验更佳?

我们推荐您使用非侵入式广告样式,这种文字 + Logo 的广告样式对网站的侵入性小,更加尊重最终用户的观感,与网站更加融合,相比大型 Banner 广告,非侵入式广告不会降低您的网站用户体验。且您可以选择横版或竖版广告样式,并自定义广告宽度(max-width)。

横版非侵入式广告

竖版非侵入式广告

传统 Banner 广告

非侵入式广告点击率较(Banner 广告)低吗?

实际上,根据我们在 https://zhaodao.ai 的测试观察,非侵入式广告的点击率反而比传统的 Banner 广告要高一些,最终用户会认真看文字,而潜意识中会自动忽略大型 Banner 等图片广告—— Banner 广告盲区现象;)。

 

如何更改传统的 Banner 广告为非侵入式广告?

依次点击 广告单元 的操作 -> 编辑按钮,修改广告类型为“非侵入式广告”(无需选择 Banner 规格)并保存,然后在广告单元页面点击操作 -> 广告代码,根据页面提示安装新的广告 div 代码(复制新的广告 div 代码网站替换旧代码即可,无需变更 Javscript 代码)。

 
如何通过外部资源引用 script 代码?

大部分前端应用如 Vue.js 可直接在 index.html 或网站模版文件里引入 Javascript 代码,复制引入下面的代码即可:

<script type="text/javascript" src="https://cdn.wwads.cn/js/makemoney.js" async></script>

如果您的前端是 NuxtJS,可以在 nuxt.config.js 引入我们的广告脚本(查看 NuxtJS 帮助文档):

script: [{ src: "https://cdn.wwads.cn/js/makemoney.js"} ],

如果您是 React 应用,可以在项目 /Public 目录下的 index.html 中直接引入,或使用 react-load-script 插件。 

 

如何提升网站的广告营收?

我们建议您采取以下措施:

  1. 在网站内容页面的首屏范围内放置广告 DIV 代码(首屏指的是网页的上半版,是指用户无需向下滚动即可看到的网页区域),同时尽可能在更多页面(包括手机站页面)安装广告代码,以确保广告有更多的曝光,展示量越多,点击量越多
  2. 您的至少 60% 的页面广告展示被 Adblock 等广告屏蔽插件屏蔽了,您可以通过在网站前端安装我们的 广告屏蔽器检测 Javascript 代码,在最终用户使用浏览器的广告屏蔽插件屏蔽广告时提示用户暂时关闭 AdBlock 或将贵站和我们的域名加入白名单以维持网站长期运营,这可以有效提升至少 50% 以上的广告收益。
  3. 一个页面,一个广告——我们强烈不推荐您在一个页面放置超过 1 个广告位(包括其他广告联盟的广告),这对您的网站最终用户来说造成的视觉负担过重,也会影响广告的点击率;
  4. 优化网站的访问速度,有调查研究表明,若网站加载超过 3s 仍是白屏,50% 的用户会选择立即离开您的网站,故我们推荐您使用 PageSpeed Insights 测试和优化您的网页性能,并优化您的服务器等;
  5. 制作或撰写更多的优秀原创内容(是的,这依然是一个内容为王的时代;),同时确保来到您网站的每个访问者都不断深入探索网站内容,如设计清晰明确的导航栏和提供热门内容榜单等;
  6. 留住您的访客,比如通过微信订阅号,微博,RSS 等渠道发布您的网站动态,引导其浏览您的网站等。

 

如何不部署上线代码,在浏览器预览广告效果?

请先复制广告单元的广告 div 代码到页面合适位置——打开 Chrome 开发者工具的 Elements Tab,选择合适的 div 位置右键点击 Edit as HTML,复制广告 div 代码放置其中,然后在 Chrome 开发者工具的 Console Tab 里输入 https://wwads.cn/js/makemoney.js 中的 Javascript 代码(需打开 https://wwads.cn/js/makemoney.js 复制其内容)并回车执行,即可看到广告加载效果。若无法加载,请查阅本文档底部的常见问题,请确保当前广告加载域名与您填写的网站域名一致,如一致,或可在 head 里添加这个 meta 标签一试:<meta name="referrer" content="always"> 

 

如何自定义广告 div 背景等 css?

可以将 style 写入 div,例如 <div class="wwads-cn wwads-horizontal" data-id="{{你的 ad_setup ID}}" style="max-width:350px;background-color:#fff;margin-top:20px;box-shadow:0 1px 3px rgb(26 26 26 / 10%)"></div>

 

对于信息流为主的网站,如何将广告插入到信息流中?

您可以自定义广告 div 的 CSS,如 style="max-width:800px;background-color:#fff" 然后将 script 代码放到广告 div 下方。

例如:<div class="wwads-cn wwads-horizontal" data-id="{{你的 ad_setup ID}}" style="max-width:350px;background-color:#fff"></div> <script type="text/javascript" src="https://cdn.wwads.cn/js/makemoney.js" async></script>

 
常见问题

/banner?blocks=id 接口返回 400 错误并提示 error: "referer cannot be empty" 或 "referer must be HTTPS url" "cannot find the block id" 或 Console 报错 "SyntaxError: Unexpected end of JSON input at JSON.parse (<anonymous>) at XMLHttpRequest.request.onload (makemoney.js:1)" 应如何排查问题?

  1. 检查页面的 Javascript 和 div 代码是否加载正确,且完整;(不同网站的广告代码是不一样的,点击 广告单元 页面的操作 -> 广告代码按钮即可获取您的万维广告代码,并进行比对)
  2. 我们的脚本会检查请求域名和您在万维广告创建流量资源时填写的网站域名是否一致,故您在本地域名环境是无法加载到广告的;
  3. 为确保广告素材的投递安全,请开启网站的 HTTPS 并仅使用 HTTPS 协议,非 HTTPS 网站无法加载广告;
  4. 我们的 adserver 会根据最终用户浏览器端请求广告素材时所带的 Request Headers 中的 referer 值判断请求是否来自正确的网站域名,如果您在浏览器开发者工具调试器中找不到该 referer,请修改贵站服务器的 Referrer Policy 为 origin-when-cross-origin 或  strict-origin-when-cross-origin ,或在 head 里添加此 meta 标签:<meta name="referrer" content="origin-when-cross-origin"> 
  5. 如浏览器开发者工具里出现了 code/banners?blocks= 的请求,但请求没有带 id,可能是 script 执行时广告 div 未加载完毕,请尝试将 script 放到广告 div 下方,例如:<div class="wwads-cn wwads-horizontal" data-id="{{您的广告单元 ID}}" style="max-width:310px"></div>  <script type="text/javascript" src="https://cdn.wwads.cn/js/makemoney.js" async></script>

如还有问题,请 联系我们

 

我们很乐意为您解惑;)