博客搭建 (五) 接入 Google AdSense (NexT v8.2.1)

既然开了博客，那就干脆把Google的AdSense接入得了，到时候要是能够收到谷歌的一点广告费，覆盖日常的VPS应用也不错。因为我用的是Next的主题，那接下来就了解一下如何将谷歌的广告接入NexT主题中。

概要：

总共分两步：

在谷歌的网站上申请 Google AdSense的账号

将谷歌的广告链接加入页面的 Head 中
第1步基本上每什么问题。关键在第2步，如果直接修改Hexo生成的html文件之后，如果接下来运行 hexo deloy，会将原来的修改直接覆盖掉。下面我们着重讨论这个问题。

在谷歌的网站上申请 Google AdSense的账号

这一步比较简单，参考这个链接在 NexT 主题中接入 Google AdSense 。完成这一部之后谷歌会给你一个脚本的链接：

1 2	<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-8151465709714450" crossorigin="anonymous"></script>

提示你应该把它加到页面的 Head 中，我们先不按照它提示的方法操作。

将Google AdSense的链接加入blog

根据官方的文档, 可以通过Custom Files来订制Head。

先找到 themes/next/_config.yml 将 head 这一行注释取消掉，让它生效。

# Define custom file paths.
# Create your custom files in site directory `source/_data` and uncomment needed files below.
custom_file_path:
  head: source/_data/head.swig
  #header: source/_data/header.swig
  #sidebar: source/_data/sidebar.swig
  #postMeta: source/_data/post-meta.swig
  #postBodyEnd: source/_data/post-body-end.swig
  #footer: source/_data/footer.swig
  #bodyEnd: source/_data/body-end.swig
  #variable: source/_data/variables.styl
  #mixin: source/_data/mixins.styl
  #style: source/_data/styles.styl

然后在项目的根目录下面的 source 下面创建文件夹和文件：source/_data/head.njk，注意，这里的 source 指的是项目根目录下面的 source ，不是 ~~themes/next/source~~。

接下来运行：

1
2
3

hexo clean
hexo g
hexo deploy

重新生成部署，然后刷新博客，右键查看网页的源码，确认谷歌的广告链接已经生效。

参考链接

在 NexT 主题中接入 Google AdSense

本系列文章：
博客搭建 (一) 开始
 博客搭建 (二) 链接谷歌域名
 博客搭建 (三) 链接google分析
 博客搭建 (四) 显示文章的字数和阅读时长
 博客搭建 (五) 接入 Google AdSense (NexT v8.2.1)