web-dev-qa-db-ja.com

翡翠ファイルからグーグルアナリティクスを使用する方法

ウェブサイトのユーザーを追跡したい。昔ながらのHTMLファイルがないので、指定されたコードをjade構文に適合させる必要がありますか、それともスクリプトをそのままにして、何らかの方法で含めることができますか？

翡翠構文に変換する必要がある場合、これを何らかのツールで自動生成できますか？.

<script>
   (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
   (i[r].q=i[r].q||[]).Push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
   m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

  ga('create', 'UA-XXXXXXXX-X', 'domain.com');
  ga('send', 'pageview');
</script>
node.jsgoogle-analyticspug
27
NSMutableString

解決策は簡単でした。

ステップ1：「analytics.js」というファイルを作成し、その中のスクリプトタグの間にコードを配置しました。翡翠構文への変換は必要ありません。

ステップ2：jadeファイルからスクリプトを参照しました

script(src='/js/analytics.js')
12
NSMutableString

別のコードファイルを探してロードする代わりに。インライン（Trevorが提案したように）。

これを実現するには、scriptだけでなくscript.タグを使用する必要があります。

下記参照：

script.
            (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
            (i[r].q=i[r].q||[]).Push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
            m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
            })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

            ga('create', 'UA-11111111-1', 'yourdomain.com');
            ga('send', 'pageview');

間隔などが実際にあなたのものから1つのタブにインデントされていることを確認してください

53
BRogers

前に述べたように、GAスニペットは実際には別のファイルを呼び出すため、ファイルにGAスニペットをインラインで配置することをお勧めします（www.google-analytics。 com/analytics.js）なので、別のjsファイルを取得してGoogleファイルを取得するのは少し無駄です。

ただし、layout.jadeをクリーンに保ちたい場合（そしてそうすべきである場合）、BRogersが書き込んだコードスニペット（「script。」で始まるもの）を別のファイルに入れて、googleAnalytics.jadeと呼ぶことができます。そして、layout.jadeに含めるだけです：

include partials/googleAnalytics

（もちろん、パーシャルはビューをフォルダー化する方法です。それはあなた次第です）

これは、GAスニペットがサーバー上のページに含まれ、追加のGETを節約しながら、layout.jadeをきれいに保つことを意味します。

6
AvnerSo

それでもインラインで追加したい場合は、 ここに要点があります 、インデントには4つのスペースを使用し、次のように呼び出します+ga('yourid12345')

また、ここに pug google analytics mixin があります。これは、 HTML5ボイラープレート にあるようなスクリプトを出力します。

1
antlis

今はパグです。それにもかかわらず。すべてのGoogleアナリティクスコードに.htmlファイルを含めることができます。

include includes/google_analytics.html
1
Oleg Frolov

2019 GTagアップデート

従来のGAスクリプトは、この新しいGTAGスクリプトに置き換えられました

script(async='', src='https://www.googletagmanager.com/gtag/js?id=UA-11111111-1')
script.
      window.dataLayer = window.dataLayer || [];
      function gtag(){dataLayer.Push(arguments);}
      gtag('js', new Date());
      gtag('config', 'UA-11111111-1');
1
PirateApp