之前已经用gitbook制作了电子书,且还弄了个模板:
crifan/gitbook_template: 演示如何使用crifan的gitbook的模板去创建自己的gitbook电子书
现在的总体界面效果是:
考虑到,能尽量再增加点广告费,所以去加上google AdSense。
加的位置,考虑加载页面底部,评论上面。
gitbook adsense
Important differences – GitBook Documentation
gitbook-plugin-google-adsense – npm
petehouston/gitbook-plugin-google-adsense: Inject Google Adsense to your Gitbook.
但是没说明,具体效果如何。
* location(require): the DOM selector to element you want to inject ad into.
还是不太会用。
How to install adsense plugin in Gitbook – Stack Overflow
看了下:
.page-inner section
目前是:
但是如何指定此处要放的section,不清楚。
算了,先去这么设置试试效果
【已解决】Google Adsense中创建广告单元并设置使用广告代码到网页中
得到:
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <!-- gitbook_bottom --> <ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-6626240105039250" data-ad-slot="6956288491" data-ad-format="auto" data-full-width-responsive="true"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script>
其中核心字段:
ca-pub-6626240105039250
6956288491
去试试
book.json
"plugins": [ "google-adsense" ], "pluginsConfig": { "ads": [ { "client": "ca-pub-XXXXXXXXXXXXXXXX", "slot": "XXXXXXXXXX", "format": "auto", "location": ".page-inner section" } ] }
再去安装:
【已解决】gitbook中安装Google Adsense插件:gitbook-plugin-google-adsense
回去看看是否可以正常使用插件
gitbook-plugin-google-adsense
【已解决】gitbook中调试google-adsense插件的plugin.js看如何生效
可以看到log了,看到出错了:
【已解决】gitbook的Adsense插件报错:Failed to load resource the server responded with a status of 403
页面中,最开始adsense部分高度是0,刷新后,有高度了:
只不过还是没广告内容显示。
那去adsense的实时广告中,看看能否检测到
暂时看不到数据
希望的是 展示次数,应该大于0,有数据才对。
那就等过段时间再看,希望能生效。
【总结】
此处是加了配置:
books/gitbook_demo/book.json
{ ... "plugins": [ "google-adsense", ... ], "pluginsConfig": { ... "google-adsense": { "ads": [ { "slot": "6956288491", "client": "ca-pub-6626240105039250", "location": ".page-inner section", "format": "auto" } ] }, ... }
然后去安装:
gitbook install
注:最好等待所有插件都安装完毕,会更能确保安装后的插件正常工作。
附录:
此处手动修改了代码:
generated/books/gitbook_demo/debug/gitbook/gitbook-plugin-google-adsense/plugin.js
把:
function createAdElement(adConfig) { ... adConfig.style && adElement.setAttribute('style', adConfig.style);
改为:
function createAdElement(adConfig) { ... // adConfig.style && adElement.setAttribute('style', adConfig.style); adElement.setAttribute('data-full-width-responsive', "true");
目的:
去掉style,加上:自适应
不过目前效果是:
本地调试,会403
真正上传到crifan.com中,才不会报错
但是广告没显示出来
adsense中统计数据也看不到
过段时间,再确认能否看到统计数据
后来试了试,把某gitbook发布到book.crifan.com上,还真的可以看到google adsense的广告了:
https://book.crifan.com/books/scientific_network_summary/website/
不过对于github.io中,目前不显示广告:
https://crifan.github.io/scientific_network_summary/website/
会报错403
-》那就去google adsense中去看看,能否加上github.io的域名,使得此处广告能显示
此处顺带也去把子域名加上:
然后再去添加github.io的:
好像和crifan.com中的配置代码没区别啊
-》估计就是:
只要确保了,(github.io的)内部的html代码中有类似于:
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script> <script> (adsbygoogle = window.adsbygoogle || []).push({ google_ad_client: "ca-pub-6626240105039250", enable_page_level_ads: true }); </script>
就可以确保广告可以正常显示了。
“让您的网站可以开始展示广告
请耐心等待!通常,此过程几天之内就能完成,但在某些情况下最长可能需要 2 周时间。审核完您的网站后,我们会立即通知您。
请一定不要移除网站后再重新提交,因为这可能会延误整个进程。
在此期间,请将代码放置在要展示广告的每个网页上。我们审核完毕后,您的网站将可以开始展示广告。
别忘了前往广告部分选择要展示的广告格式。”
那就是等了,最多2周,然后回去GA后台看看是否能看到广告来自github.io
如果有,则说明是对了。
另外,此处,对于
中的gitbook_bottom的广告,已经开始看到有展示数据了:
至此,说明:
中的google adsense的广告(gitbook_bottom)的确是生效了。
等过些天,去看看github.io中是否生效。
现在
已验证网站
只有crifan.com
希望过段时间后,能看到
crifan.github.io
后记:
收到邮件了:
好消息! 您的网站“crifan.github.io”现已准备好展示 AdSense 广告了。 如果您已经启用了自动广告,在几个小时内,就会有贴合用户需求的广告开始在 "crifan.github.io" 上陆续展示,为您带来真金白银。如果还未启用自动广告,请前往您 AdSense 帐号中的“我的广告”页面,启用您想展示的广告。 请注意,您随时都可以通过添加广告代码,在此网站上符合我们合作规范的任意新网页上展示广告。 此致
后来看到:
-》猜测可能是:
新加的github.io的网站缺了这个ads.txt
“在您的网域的根级目录下托管您的 ads.txt 文件。”
先去现有www.crifan.com的根目录下看是否有ads.txt
看了看
好像没有
看网站文件,是有的:
然后发现需要加上www.
https://www.crifan.com/ads.txt
-》
即 www.crifan.com上有
有这个提示,那说明是:
新加的 crifan.github.io中缺少
待会去加上
“我在 AdSense 中看到一条关于我的 ads.txt 文件的提醒信息。如何确定我的哪个网站的 ads.txt 文件不正确?
如果您在帐号中看到 ads.txt 提醒信息,可以访问您的“网站”页面查看受影响的网站列表。”
果然是:
新加的
crifan.github.io
已就绪
但是发现缺少了:ads.txt
google.com, pub-6626240105039250, DIRECT, f08c47fec0942fa0
去放过去:
git上传上去
暂时还无法访问到:
http://crifan.github.io/ads.txt
估计要等段时间才行。
过段时间,再去Google Adsense中确认,估计缺失ads.txt的警告就会消失了。
第二天就可以了:
但是此处还有警告:
然后再去看看介绍:
感觉是:
或许是
此处的
crifan.github.io
的根域名:
github.io
没有ads.txt
所以可能会一直提示此警告,也可能支持子域名,过段时间警告消失。
所以等过段时间看看警告是否消失再说。
然后过了几天,警告还没消失。
难道是必须放到github.io域名根目录才行?那我可没权限
不过另外在google adsense中发现:
crifan.github.io
都可以有广告展示了。
甚至这几天,crifan.github.io中都有点击了。
很不错。
转载请注明:在路上 » 【已解决】Gitbook页面底部加google adsense广告