杨泽业:给你的mipcms网站添加谷歌广告联盟Google AdSense代码的详细教程
网站服务商杨泽业:给你的mipcms网站添加谷歌广告联盟GoogleAdSense代码的详细教程(2018.10.24更新)在以百度mip技术指导的网站中,mipcms算得上是
网站服务商杨泽业:给你的mipcms网站添加谷歌广告联盟Google AdSense代码的详细教程(2018.10.24更新)
在以百度mip技术指导的网站中,mipcms算得上是一枝独秀,可以使任何没有网站开发经验的人,都能轻松的搭建mip网站,mip网站要求可以通过mip验证,在代码中是不可以加入js代码的,在开始mip技术的网站只能添加百度联盟自己的广告,现在呢,有人开发好了基于谷歌联盟的js组件,就能让所有人挂谷歌联盟的广告盈利了。
众所周知,百度广告联盟,是要求有网站备案才能申请百度广告联盟,投放百度联盟广告赚钱的。像网站服务商网这样,就是一个纯碎的建站技术分享网站,通过卖域名,虚拟主机,服务器,建站这样的服务来赚钱的,因为是个人,在备案的要求里面个人是无法备案的,就算是备案成功了,发现有经营活动,也是要取消备案的。所以我们干脆不备案好了。既然没有备案,百度里面不能申请,那么就申请谷歌广告联盟好了,通过投放谷歌广告赚钱。
如果还没有注册谷歌Google adSense账号的,就去官方网站注册一个账号,申请广告联盟。本站是在2018年10月1日申请的账号,10月2日激活了Google AdSense服务,开始通过投放广告赚钱。只要你在Google AdSense里面第一个网站开通广告服务,就能把代码粘贴到符合规范的所有的网站里面使用,而且所有的广告代码只要申请一次,就可以粘贴在你任何网站的你想投放的广告位置。
温馨提示:在谷歌联盟审核之前,需要把默认的谷歌代码添加到头部文档<head></head>之间(\template\default\main\main.html ),待审核通过,成功激活以后,在删除默认的谷歌广告代码,按照下面的教程进行操作。(默认的广告代码,没有广告位置ad-slot,是没有广告收入的!)
下面,我就开始讲解怎么添加谷歌联盟广告代码到我们的mipcms网站里面。
一、添加谷歌广告联盟适应mip技术的js组件。
添加组件是必须的,下面我就直接贴出js组件代码,免得大家去找了。
<script src="https://c.mipcdn.com/static/v1/mip-adsense/mip-adsense.js" type="text/javascript" charset="utf-8"></script>
上面代码放到/template/default/main/main.html里面和其他的组件一起即可。
二、登录Google AdSense后台添加内容广告--广告单元--新建单元,选择广告类型,我是选第一个【文字广告和展示广告】,提交以后获得一个谷歌提供的原生广告代码:
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<ins class="adsbygoogle"
data-ad-client="ca-pub-9415624128339828"
data-ad-slot="9640249472"
data-ad-format="auto"
data-full-width-responsive="true"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
要求把上面的广告代码,添加到你的网站合适的位置,或者是网站头部文件<head>和</head>之间,但是我们的是mip的网站,是不能添加js代码的,就需要我们转化成符合要求的mip代码即可,代码是:
<mip-adsense ad-client="ca-pub-9415624128339828" ad-slot="9640249472" ad-format="auto"></mip-adsense>
当然我们也可以选择另一个的,今天1024程序员节,我在指导凡哥的时候,我顺便也添加了一个全网【信息流】的广告,后台添加内容广告--广告单元--新建单元,选择广告类型,选择信息流广告,得到的原生代码如下:
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<ins class="adsbygoogle"
data-ad-format="fluid"
data-ad-layout-key="-fb+5w+4e-db+86"
data-ad-client="ca-pub-9415624128339828"
data-ad-slot="2829799085"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
我们再把他制作成为 mip的广告代码:
<mip-adsense ad-client="ca-pub-9415624128339828" ad-slot="2829799085" ad-format="auto"></mip-adsense>
上面广告代码参数说明:
2.1、ad-client 说明:用户;必选项:是;
2.2、ad-slot 说明:位置;必选项:是;
2.3、ad-format 说明:格式;必选项:否;
2.4、ad-width 说明:宽度;必选项:否;
2.5、ad-height 说明:高度;必选项:否;
我看了一下mipcms开发者团长的谷歌代码里面,添加了具体的长和宽,我觉得那样不好,应该让他自适应,这样的话,手机版和电脑版浏览起来才不会有大小不一致的错位的感觉。
谷歌广告代码有了,我就在网站后台添加一条广告:
三、添加谷歌广告代码
操作步骤:后台--插件--广告管理--新建广告:
名称:谷歌广告
别名:gggg
代码:
<div><mip-adsense ad-client="ca-pub-9415624128339828" ad-slot="9640249472" ad-format="auto"></mip-adsense></div>
提交以后,获得广告调用代码{:hook('adHook','gggg')}
注:把谷歌广告联盟的mip代码,放在一个div里面,当然你不要div都行,自己爱好问题。
四、把谷歌代码,添加到网站模板里面。
4.1、添加到网站首页。(推荐投放1处广告)
在template\default\index\index.html里面,搜索{include file='block/tags-hot'}的上方或者下方粘贴调用代码{:hook('adHook','gggg')}即可。
4.2、添加到文章列表页。(推荐投放2处广告)
4.2.1、打来栏目模板文件/template/default/article/article.html。
4.2.2、在第12行的<section class="mip-box-body">下方,添加一行广告代码{:hook('adHook','gggg')}即可,这里显示的位置是文章列表页的最新的文章上方。
4.2.3、在最后几行的热门标签代码{include file='block/tags-hot'}的上方或者下方添加调用代码{:hook('adHook','gggg')}即可。这里是侧边栏,最好是在热门标签的下方显示。
4.3、添加到文章详情页。(推荐投放2处广告)
4.3.1、打开文章详情页模板template\default\article\articleDetail.html。
4.3.2、根据百度2018年8月15日发布的《百度移动搜索落地页体验白皮书4.0》中描述,文章主体部分从上到下,从logo到文章正文内容开始,都不得出现广告,所以我们只能把广告添加到文章的文末了。
4.3.3、搜索“猜你喜欢”大约在55行的上一行添加谷歌广告调用代码{:hook('adHook','gggg')}。这样的话,谷歌广告就显示在文章末尾了。
4.3.4、搜索:最新标签代码{include file='block/tags-new'}大约在100行的位置的下方一行添加谷歌广告调用代码 {:hook('adHook','gggg')}。这样的话,谷歌广告就显示在侧边栏的最新标签的下方了。
4.4、添加到标签页。(推荐投放2处广告)
4.4.1、打开标签页面模板文件/template/default/tag/tagDetail.html。
4.4.2、大约在80行的<div class="mipui-widget-media-body mipui-category-list-001">的下方一行添加谷歌广告调用代码{:hook('adHook','gggg')}。这样的话,谷歌广告就显示在标签描述的下方,标签列表文章的上方了。
4.4.3、大约在94行的热门标签{include file='block/tags-hot'}的下方一行添加谷歌广告调用代码{:hook('adHook','gggg')}。这样的话,谷歌广告就显示在热门标签的下方了。
好了,杨泽业今天的给你的mipcms网站添加谷歌广告联盟Google AdSense代码的详细教程就到此结束了。本站的首页、栏目列表页、文章详情页、标签页都添加好了谷歌广告联盟的广告了,大家通过电脑和手机都浏览一下看看本站的演示效果。今天的话题到此为止,新的教程,我们明天见!
猜你喜欢