Hexo Blog 06：NexT 主題加入 Google Adsense

發表於 2022-12-23 更新於 2024-04-05 分類於 Hexo ， Blog 閱讀次數： Disqus：文章字數： 1.1k 所需閱讀時間 ≈ 4 分鐘

前一篇系列文章：NexT 主題 SEO 相關設置加入向搜尋引擎自動推送網址的功能後，我們的 Blog 終於能出現在人們視野中。而有能見度後就是要收取過路費阿 (咦?

目標

於 Blog 加入並啟用 Google Adsense

環境

Hexo: 6.3.0

hexo-cli: 4.3.0

NexT: 8.14.0

由於我是申請成功後才想說要來記錄申請過程，所以看不到首次申請的畫面了…不過重要的地方不變。

基本上按照 Google AdSense 官方說明操作即可。

添加網址

總之就是輸入 Blog 的網址

三步驟設定

進去之後大致會看到由左至右三個步驟：

輸入您的付款資訊：

就乖乖的按網站指示填資料。

(選擇性) 查看廣告在網站上的呈現模樣：

我是直接選擇 自動廣告，這樣通過審查後 Google 會自己將廣告內容插入我們的 Blog，而且他已經很人性化，提供我們選擇想要的廣告板型了。

若是想要全部自定義，就需要使用 NexT 主題的 Custom Files 配合一些主題參數化設置或是其他插件協助完成。

將您的網站連結到 AdSense：

進去此選項即可複製 HTML 程式碼：

此為範例，請複製自己的

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

複製後即可點擊 要求審查，再來就乖乖等 Google 審查吧，Google 是說 通常會在幾天內完成，但有時可能需時 2 至 4 週。

將 HTML 程式碼加入 Blog

Google 要求將 HTML 程式碼貼入 <head> 和 </head> 這兩個代碼之間。

而現在要在 NexT 主題做到這件事非常簡單，使用 Custom Files 功能就能在不破壞主題程式碼的情況下完成：

於 Blog 專案根目錄中的 source/_data 建立 head.njk 檔案，並將剛剛複製的 HTML 程式碼貼入；若先前就已建立 head.njk 檔案則是將 HTML 程式碼貼到檔案最末端即可：

/source/_data/head.njk

1
2
3

{# Google AdSense #}
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-OOOOOOOOOOOOOOOO"
     crossorigin="anonymous"></script>

將 NexT 主題設定中 head 的註解移除：

_config.next.yml

1 2	custom_file_path: head: source/_data/head.njk

重新部署 Blog 網站即完成設定。
若想要自行檢查有沒有插入成功，只要進 Blog 網站，按 F12 看網頁原始碼的 <head> 和 </head> 間有沒有該程式碼即可。
再來真的只能乖乖等 Google 審查了…

等待審查

我在等待約兩週後收到審查結果的 Email：

通過審查 Email

(照前面步驟操作基本上都要成功，若是沒成功可能就要寫信跟 Google 吵架了…)

消除警告

通過審查後，前往 Google AdSense 首頁會看到收益表跟兩則警告：

Google AdSense 首頁

兩則警告

一個是要我們在 Blog 網站中加入 ads.txt 檔案。
一個是要我們公開自己的賣家資訊。

加入 ads.txt

點擊 ads.txt 警告的 立即修正，會看到以下畫面：

點擊下載來獲取 ads.txt 檔案

將 ads.txt 檔案置於 Blog 專案根目錄的 source 資料夾中，再重新部署 Blog 網站即完成設定。

我們可以在 Blog網址/ads.txt 網頁中看到其內容。

設定完後該警告不會馬上消失，只能等待 Google 檢查。

我自己是調整後的隔天警告就消失。

公開賣家資訊 (Google sellers.json)

點擊 公開自己的賣家資訊 警告的 操作，會看到以下畫面：

設成資訊公開並填入商家網域即完成設定

設定完後重新整理 Google AdSense 首頁就會看到該警告消失。

等廣告出現

剛通過審查也不會馬上有廣告出現，一樣只能等…

通過審查 Email 內容

我自己是通過後的隔天才出現廣告。

結語

連廣告都開通了，至此 Blog 的基礎建置算是大功告成，接下來能做的事情就是多寫文章來充實 Blog 內容，或是到處參考別人 Blog 有哪些酷功能來跟進 XD，祝大家玩得開心 ~

目標

環境

於 Google AdSense 新增網站並獲取 AdSense 程式碼