1. 創建 _google_analytics.html.erb view:
<span style="font-size:18px;"><!-- Google Analytics -->
window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
// Create tracker.
ga('create', '<%= ENV['GOOGLE_ANALYTICS_TRACKING_ID'] %>', 'auto');
<!-- End Google Analytics --></span>
這段代碼下載Google Analytics, 並且初始化 tracker。
想知道更多關於tracker的信息,可以查看官方指導: Understand Google Analytics trackers
這裏我們把 tracking ID 設置爲環境變量(最好在application.configure裏取環境變量,這裏爲了簡單,就直接寫在view裏了),這樣我們就可以爲不同的環境設置不同的 Google Analytics property了。
2. 設置 tracking ID 環境變量
2.1 本地環境: 添加 GOOGLE_ANALYTICS_TRACKING_ID=UA-XXXXXXX-X 到 .env 文件。
2.2 遠程環境: 添加 GOOGLE_ANALYTICS_TRACKING_ID=UA-XXXXXXX-X 到 config/environments 文件夾下的相應文件中。文件夾結構示例如下:
3. 把 Google Analytics view 加入 application layout:
爲了在網站所有頁面中使用 Google Analytics , 把view 加入到 application.html.erb
<span style="font-size:18px;"><head>
<!-- Only set up google analytics when running in certain environments-->
<% if %w(development production).include? Rails.env %>
<%= render partial: 'shared/google_analytics' %>
<% end %>
</head></span>
4. 在一個 javascript 文件中寫入追蹤頁面訪問代碼:
這裏我們新建一個 javascript 文件,而不是直接把代碼添加在 view裏,是考慮到之後如果還要添加其他追蹤代碼會比較方便。例如,之後可以添加追蹤表格提交代碼。
如果想了解如何自定義追蹤頁面訪問,可以查看以下指導:
instruction page
<span style="font-size:18px;">(function() {
// If google analytics is not set up, skip tracking code
if(window.ga === undefined) return;
//// Track page view
// Set the page value on the tracker. Url: get rid of parameters and trailing '/'
ga('set', 'page', document.location.pathname.split('?')[0]);
// Send page view
ga('send', 'pageview');
})();
</span>