> For the complete documentation index, see [llms.txt](https://docs.vwo.gaprise.jp/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.vwo.gaprise.jp/setup/smartcode/k1vdocok5r.md). # ウェブサイトとアプリを登録する VWOを各プラットフォーム（ドメイン／モバイルアプリ／サーバーサイドプロジェクト）とリンクさせるための最初のステップが、\[Websites and Apps]への登録です。 各プラットフォームを登録することで、それぞれに対応するスマートコードやSDKを展開し、VWOと接続することができます。 ### 登録画面 管理画面サイドメニュー\[Configulations]>\[Websites and Apps]から、ウェブサイト、モバイルアプリ、サーバーサイドプロジェクトを登録し、管理することができます。 {% hint style="warning" %} VWOに登録されると\[Configulations]>\[Websites and Apps]から、すべてのウェブサイトとアプリにアクセスできます。 {% endhint %} \[Websites and Apps]には、以下のセクションがあります： * **Introduction（導入）：**スマートコードやそれぞれのキーを介して各プラットフォームをVWOに接続する方法を説明します。概要セクションの他にも、スマートコード、モバイルアプリSDK、サーバーサイドSDKそれぞれのセクションがあります。 * **Websites and Apps（ウェブサイトとアプリ）** - VWOアカウント内のウェブサイトとアプリの一覧を表示します。 このセクションは、少なくとも1つのプラットフォーム（ドメイン／モバイルアプリ／サーバーサイドプロジェクト）を登録した後に表示されます。 * **Privacy（プライバシー）** - VWOのデータ収集、保存、管理に関するプライバシーポリシーについて説明します。 * **Compliance（コンプライアンス）** - VWOが業界標準に準拠するためのコンプライアンスと証明書について説明します。 * **FAQs（よくある質問）** - スマートコードの設置に関する最も一般的な質問を表示します。
### ウェブサイトの接続 #### 手順 1. \[introduction]から「connect now」をクリックしてください。
2. 表示されるポップアップで、ウェブサイトのドメイン名を入力し追加します。
3. VWOはウェブサイトを分析および検証して、サイト固有のスマートコードを生成します。完了すると、プラットフォームがVWOに登録され、次のように表示されます。
#### ウェブサイトの管理 VWOに登録されたウェブサイトは、「Websites and Apps」の下に表示されます。 表示されたウェブサイトをクリックすると、「Code（コード）」「Performance（パフォーマンス）」「Audit（監査）」という3つのタブが表示されます。 * **Code（コード）：**\ デフォルトで、VWOがそのウェブサイト用に生成したHTMLスマートコードが表示されます。ウェブサイトが[WordPress ](https://help.vwo.com/hc/en-us/articles/360020745993-WordPress)、[Drupal ](https://help.vwo.com/hc/en-us/articles/360020538734-Drupal)、または[Shopifyでホストされている場合](https://help.vwo.com/hc/en-us/articles/360021465793-Integrating-Shopify-with-VWO)、VWO はそれを自動的に検出し、スマートコードを設置するためのそれぞれのプラグインを表示します。\ \ HTMLスマートコードには、上部にバージョン番号と、各バージョンのスマートコードに加えられた変更のログをリストする変更ログがタグ付けされています。\ \ スマートコードの右上にある**⚙**アイコンをクリックすると、要件に基づいてスマートコードをカスタマイズできます。利用可能なオプションについては、[「スマートコードのカスタマイズ」](#sumtokdonokasutamaizu)をご確認ください。
* **Performance（パフォーマンス）：**\ ウェブサイトにスマートコードを設置した後のVWOの影響が表示されます。First Contentful Paint (FCP)、Largest Contentful Paint (LCP)、Thread block time (TBT) など、コアウェブバイタルに対するVWOの影響が、モバイルとデスクトップの2つのタブに個別に表示されます。
これらの重要事項の下には、VWOライブラリと個々のVWO キャンペーンのサイズの内訳がタイプ別に分類されています。リストの下部には、すべてのVWO キャンペーンの合計サイズも表示されます。これらに加えて、VWOはウェブサイトのパフォーマンスに基づいて、ウェブサイトを改善するための提案も提供します。
* **Audit（監査）：**\ ウェブサイトの訪問者によって実行されたすべてのイベントがストリーミングされます。VWOアカウントにリンクされているすべてのウェブサイトでイベントを表示するには、管理画面サイドメニュー > \[**Data360]>\[監査]**にアクセスします。詳しくは、[ここをクリックしてください](https://help.vwo.com/hc/en-us/articles/8681495032857-Using-Audit-in-VWO)。 #### スマートコードのカスタマイズ カスタマイズに使用できるオプションは次のとおりです。
オプション選択肢

「Code type」

コードの種類

非同期または同期のいずれかを選択できます。デフォルトでは、「非同期」が選択されています。

スマートコード設置後にこのオプションをカスタマイズする場合、新しい変更を反映するには、ウェブサイト上のスマートコードを更新されたものに置き換える必要があります。

「Settings timeout／Library timeout」
タイムアウトの設定

・設定タイムアウトは、非同期SmartCodeがページ設定の読み込みを待つ時間を指します。

・ライブラリタイムアウトは、非同期コードがCDNにVWOライブラリの取得をリクエストしてからファイルが読み込まれるまでの待ち時間を指します。

これらの時間制限が、ウェブページの読み込み時間が長い場合やバリエーションの変更が大きい場合などに超過すると、訪問者には元のコンテンツが表示されます。これらの時間制限を延長することで、元のコンテンツの表示を防ぐことができます。スマートコードのタイムアウトについて詳しくは、この記事をご覧ください。

これらのオプションを設置後にカスタマイズする場合、スマートコードは自動的に更新されます。しかし、現在の訪問者は、次回の訪問またはセッション時にウェブサイト上の変更を経験します。

「Use existing jQuery」
既存のjQueryを使用する

デフォルトでは、このオプションは選択されていない状態で、それはVWOのjQueryを使用することを意味します。このオプションを選択すると、VWOはあなたのウェブサイトが使用しているjQueryを使用するようになります。

注記：VWOのデフォルトのjQueryを使用しない場合、VWOのコードの前にjQueryが読み込まれていることを確認してください。VWOスマートコードをjQueryと共に使用する方法について詳細は、この記事を参照してください。

このオプションを設置後にカスタマイズする場合、スマートコードは自動的に更新され、変更はあなたのウェブサイト上で即座に反映されます。

「Avoid flicker due to Rocket Loader」
Rocket Loaderによるちらつきを回避

デフォルトでは、このオプションは選択されていません。ウェブサイトで Rocket Loader を使用してスクリプトをロードする場合は、このオプションを選択することをお勧めします。

これを選択すると、VWOがスマートコードに属性を追加できるようになります。こうすることで、Rocket Loader が有効になっているときにデフォルトの方法でスマートコードがウェブサイトに適用されるときのちらつきなどの問題を防ぐことができます。

設置後にこのオプションをカスタマイズする場合、新しい変更を反映するには、ウェブサイト上のスマートコードを更新されたものに置き換える必要があります。

「Hide body tag in HTML」
HTMLのbodyタグを非表示にする

デフォルトでは、このオプションは選択されたままであり、ウェブページのレンダリング中に元のコンテンツのフラッシュを避けるためにVWOがbody要素を非表示にすることを意味します。

設置後にこのオプションをカスタマイズする場合、スマートコードは自動更新されます。ただし、現在の訪問者は、次回の訪問またはセッション時にウェブサイト上の変更を経験します。

スマートコードカスタマイズ オプションをシステム設定にリセットするには、**\[デフォルトにリセット]**をクリックします。 カスタマイズ オプションを設定した後、**\[保存]**をクリックして変更を適用すると、スマートコードをウェブサイトに設置する準備が整います。 スマートコードの設置後、スマートコードチェッカーにウェブサイトのURLを入力して正しく設置できているか確認できます。詳細は[「スマートコードチェッカー」](/setup/smartcode/krsdu1c433.md)をご確認ください。 ### モバイルアプリの接続 #### 手順 1. \[Mobile App]セクションで、\[Connect Your App]ボタンをクリックします。 2. 表示される \[Add a mobile app] ポップアップで、モバイル アプリの名前を入力します。 3. \[Add app]をクリックします。 アプリがVWOに登録されると、次のように表示されます。
#### モバイルアプリの管理 「Websites and Apps」セクションのモバイルアプリには、「SDK」「Configulation（構成）」という2つのタブが表示されます。 * **SDK：**\ VWOはAndroidとiOS用にAPIキーを個別に生成します。Cordova、Flutter、および React-native は、必要に応じて AndroidおよびiOS API キーのいずれかを利用できます。モバイルアプリにSDKを設置する方法については、APIキーの下に表示されている\[SDK guide]ボタンをクリックしてください。 * **Configulation（構成）：**\ モバイルアプリでテストを実行するための変数を構成できます。テスト変数は、モバイルアプリの要素またはパラメーターです。変数を定義した後は、コードの変更や再デプロイを行わずに、その変数に対して無制限の A/B テストを実行できます。例えば、アプリ画面上でさまざまなテキストバージョンをテストするための文字列型の変数を作成できます。 #### モバイルアプリで変数作成 1. \[Variable]セクションで、\[Create Variable]をクリックします。 2. 変数に名前を割り当て、そのデータ型を選択します。 3. デフォルト値を入力します (これは、現在の値、または A/B テストがない場合に割り当てられる値を指します)。 4. \[Create]をクリックします。アプリに複数の変数を追加できます。 例えば、次のユースケースでモバイルアプリの A/B テストを作成するとします。 * **コントロール：**予約するには、ユーザーがアプリに (サインアップ後) サインインする必要があります。 * **バリエーション：**ユーザーはサインインせずに直接支払いを行うことができます。 この使用例の変数は次のように作成できます。
変数の作成が完了すると、\[Configulation（構成）]タブの\[Variable（変数）]セクションに一覧が表示されます。\[Edit Variables]アイコンをクリックすると、変数の名前とデフォルト値をいつでも変更できます。ただし、変数の削除はできません。 モバイルアプリで A/B テストを作成する方法については、[この記事を参照してください](https://help.vwo.com/hc/en-us/articles/360020728654-How-to-Create-an-A-B-Test-for-a-Mobile-Application-in-VWO-)。 ### サーバーサイドプロジェクトの接続 #### 手順 1. \[Server-side]セクションで、\[Connect Your Project]ボタンをクリックします。 2. 表示される\[Add a Project]ポップアップで、プロジェクト名を入力します。 3. \[Languages]ドロップダウンから、プロジェクトの言語を選択します。 4. \[Environment Name]フィールドに、テストを実行する環境の名前を入力します。 5. 複数の環境を追加するには、\[Add another environment]をクリックします。\[Set as default]チェックボックスを選択すると、環境をデフォルトとして設定できます。これにより、キャンペーン内のプロジェクトを選択するときに環境が自動選択されるようになります。環境をデフォルトとして設定すると、[*機能ロールアウト*](https://help.vwo.com/hc/en-us/articles/360036614034-Rolling-Out-a-Feature-Using-VWO-FullStack#:~:text=Feature%20Rollout%20lets%20you%20deliver,experience%20without%20deploying%20new%20code.\&text=To%20create%20a%20feature%20rollout,a%20Project%20and%20a%20Feature.\&text=Log%20in%20to%20your%20VWO%20account.)、[*機能テスト*](https://help.vwo.com/hc/en-us/articles/360037117113-Performing-Feature-Test-in-VWO-FullStack)*、および*[*A/B テスト*](https://help.vwo.com/hc/en-us/articles/360036614994-Running-an-A-B-Test-in-VWO-FullStack)キャンペーンの \[Projects]ドロップダウンからプロジェクトを選択すると、その環境が \[Environment(s)] リストに自動的に表示されます。 6. Webhookを有効にするには、\[Enable Webhook]チェックボックスを選択します。Webhookその構成方法の詳細については、[ここをクリック](https://help.vwo.com/hc/en-us/articles/900003779006-Configuring-Webhooks-in-VWO-FullStack)してください。 7. \[Add project]をクリックします。 VWOでプロジェクトが作成されると、次のタブが表示されます。
* **SDK：**\ あなたのサーバーにインストールするためにVWOが生成したSDKを紹介します。インストール方法を知りたい場合は、Python、Java、.NET用の対応するSDKガイドを参照するために、それぞれの\[SDK guide]ボタンをクリックしてください。 これには、コード内でVWOクライアントを初期化する際に使用する必要があるSDKキーも表示されます。 * **Configuration （構成） ：**\ プロジェクトに追加した環境を管理することができます。 ### 登録されたウェブサイトとアプリの管理 \[Configulations]>\[Websites and Apps]で、「Websites and Apps」をクリックすると、VWOアカウントに登録されているすべてのプラットフォームの一覧が表示され、ステータスやアクティビティを確認することができます。 * **ステータス**：\ スマートコード / SDK の接続状況を表示します。 * **接続済み** - スマートコード / SDK がプラットフォームに正常にインストールされていることを意味します。 * **接続されていません** - SDK がプラットフォームにインストールされていないことを意味します。 * **スマートコードが検出されませんでした**- スマートコードがウェブサイトに設置されていないことを意味します。 * **エラー** - スマートコードがウェブサイトに正しく設置されていないことを意味します。理由は分類されており、対応するプラットフォームをクリックすると表示されます。 * **最後のアクティビティ**- VWOがウェブページ上で訪問者のエンゲージメントを最後に検出したときのタイムスタンプを表示します。 {% hint style="warning" %} ウェブサイトの場合、VWOはスマートコードが指定されたドメイン以外の別のドメインに設置されているかどうかを自動的に検出します。 このような場合、VWOはその種類を**「未登録ウェブサイト」**として表示することで分類し、未登録ウェブサイトをスマートコードに接続するための**\[Connect]ボタンを提供します。**ドメインが2日以上未登録の状態が続くと、VWOはドメインからのデータの収集を停止します。 {% endhint %} {% hint style="info" %} これらの詳細を表示する以外に、データをアーカイブすることで、不要になったプラットフォームから VWOがデータを収集しないようにすることもできます。 これを行うには、対応するプラットフォームに右上の、記号 \[ ⋮ ] > \[アーカイブ]をクリックします。アーカイブされたプラットフォームは、「アーカイブされたWebサイトとアプリ」セクションに一覧表示されます。プラットフォームをアーカイブ解除するには、それに対応する「アーカイブ解除」オプションをクリックします。 {% endhint %} ※本ページは[\[原文：Registering Your Website and Apps in VWO\]](https://help.vwo.com/hc/en-us/articles/20057607749785-Registering-Your-Website-and-Apps-in-VWO)を翻訳・加筆修正しています。