WebflowではZenovayの追加が簡単です — インストールするプラグインはありません。サイトの「Head Code」パネルにトラッカータグを貼り付けて公開します。
手順
トラッキングコードをコピー
app.zenovay.comにログインし、サイトのダッシュボードを開いて設定 → 一般に移動します。トラッキングスニペットがそこに表示されます — トラッキングコードをコピーします（
zv_abc123xyzのような形式です）。Webflowのサイト設定を開く
Webflow Designerで左上のプロジェクト名をクリックし、Site settingsを選択します。次にCustom codeタブに移動します。
Head Codeにトラッカーを貼り付け
Head codeフィールドに以下を貼り付けます：
<script defer src="https://api.zenovay.com/z.js" data-tracking-code="YOUR_TRACKING_CODE" ></script>YOUR_TRACKING_CODEをステップ1の値に置き換えます。変更を保存
パネル上部のSave changesをクリックします。
サイトを公開
右上のPublishをクリックして本番ドメインを選択します。トラッカーは公開されたサイトでのみ起動し、
webflow.ioステージングでは起動しません — ただし、ステージングへの訪問もデータを汚染しません。
動作確認
- シークレットウィンドウで本番のWebflowサイトを開きます。
- 30秒待ちます。
- サイトのダッシュボードを開きLive Viewタブを選択します — 訪問が正しい位置情報とともに表示されるはずです。
表示されない場合はインストールの確認を参照してください。
コンバージョンとフォーム送信のトラッキング
Webflowネイティブのフォーム送信およびクリックイベントは自動的にZenovayを呼び出しません。カスタムイベント（たとえば「デモ申請」フォーム送信）をトラッキングするには、ページに以下を含むembedブロックを追加します：
<script>
document.querySelector('#your-form-id').addEventListener('submit', function() {
window.zenovay('track', 'demo_requested', { form: 'hero_cta' });
});
</script>
#your-form-idをフォームのセレクターに、demo_requestedをイベント名に置き換えます。
CSP / パフォーマンスのヒント
- Webflowはデフォルトでトラッカーを許可します — Webflowのカスタムドメイン統合経由でカスタム
Content-Security-Policyヘッダーを追加していない限り、CSP変更は不要です。 - トラッカーは
deferで読み込まれるため、初期レンダリングをブロックしません。 - トラッカーは小さな単一のスクリプトで非同期に読み込まれるため、Lighthouseスコアへの影響は無視できるほどです。