ネイティブ広告

[アーティクル]
06/02/2023

警告

2020 年 6 月 1 日以降、Windows UWP アプリ用の Microsoft の広告の収益化プラットフォームはシャットダウンされます。詳細情報

ネイティブ広告は、コンポーネントベースの広告形式で、各広告クリエイティブ (タイトル、画像、説明、行動喚起テキストなど) が個々の要素としてアプリに配信されます。これらの要素は、独自のフォント、色、アニメーション、その他の UI コンポーネントを使ってアプリに統合して、アプリの外観に合った控えめなユーザーエクスペリエンスを組み込むことができるうえに、広告から高収益を獲得できます。

広告主のために、ネイティブ広告では高パフォーマンスの配置が提供されます。広告エクスペリエンスがアプリに密接に統合されることで、ユーザーがこのような種類の広告と対話しやすくなる傾向があるためです。

注意

ネイティブ広告は現在、Windows 10とWindows 11用の XAML ベースの UWP アプリでのみサポートされています。 HTML と JavaScript を使って作成された UWP アプリについては、今後リリースされる Microsoft Advertising SDK でサポートされる予定です。

前提条件

Visual Studio 2015 以降の Visual Studio のリリースと共に Microsoft Advertising SDK をインストールします。インストール手順については、この記事をご覧ください。

ネイティブ広告をアプリに統合する

次の手順に従って、ネイティブ広告をアプリに統合し、ネイティブ広告の実装によってテスト広告が表示されることを確認します。

Visual Studio でプロジェクトを開くか、新しいプロジェクトを作ります。

注意

既存のプロジェクトを使用している場合、プロジェクトの Package.appxmanifest ファイルを開き、インターネット (クライアント) 機能が選択されていることを確認します。アプリでは、テスト広告やライブ広告を受信するためにこの機能が必要になります。
プロジェクトのターゲットが [Any CPU] (任意の CPU) になっている場合は、アーキテクチャ固有のビルド出力 (たとえば、[x86]) を使うようにプロジェクトを更新します。プロジェクトのターゲットが [Any CPU] (任意の CPU) になっていると、次の手順で Microsoft Advertising SDK への参照を正常に追加できません。詳しくは、「プロジェクトのターゲットを "Any CPU" に設定すると参照エラーが発生する」をご覧ください。
プロジェクトで Microsoft Advertising SDK への参照を追加します。
1. [ソリューションエクスプローラー] ウィンドウで、[参照設定] を右クリックし、[参照の追加] を選択します。
2. [参照マネージャー] で、[Universal Windows] を展開し、[拡張] をクリックして、[Microsoft Advertising SDK for XAML] (バージョン 10.0) の横にあるチェックボックスをオンにします。
3. [参照マネージャー] で、[OK] をクリックします。
アプリの適切なコードファイル (たとえば、MainPage.xaml.cs またはその他のページのコードファイル) に、次の名前空間の参照を追加します。
```
using Microsoft.Advertising.WinRT.UI;
using Windows.UI.Xaml.Media.Imaging;
```
アプリ内の適切な場所 (または他のページなど) で MainPage 、 NativeAdsManagerV2 オブジェクトと、ネイティブ広告のアプリケーション ID と広告ユニット ID を表す複数の文字列フィールドを宣言します。次のコード例では、フィールドと myAdUnitId フィールドをmyAppIdネイティブ広告のテスト値に割り当てます。

注意

各 NativeAdsManagerV2 に、対応する広告ユニットがあります。広告ユニットは、ネイティブ広告コントロールに広告を提供するためにサービスで使われます。すべての広告ユニットは、広告ユニット ID とアプリケーション ID で構成されます。ここでは、広告ユニット ID とアプリケーション ID のテスト値をコントロールに割り当てます。これらのテスト値は、テストバージョンのアプリでのみ使用できます。ストアにアプリを公開する前に、これらのテスト値をパートナーセンターから取得した実際の値に置き換える必要があります。
```
NativeAdsManagerV2 myNativeAdsManager = null;
string myAppId = "d25517cb-12d4-4699-8bdc-52040c712cab";
string myAdUnitId = "test";
```
起動時に実行されるコード (たとえば、ページのコンストラクター) 内で、NativeAdsManagerV2 オブジェクトをインスタンス化し、このオブジェクトの AdReady イベントと ErrorOccurred イベント用のイベントハンドラーを関連付けます。
```
myNativeAdsManager = new NativeAdsManagerV2(myAppId, myAdUnitId);
myNativeAdsManager.AdReady += MyNativeAd_AdReady;
myNativeAdsManager.ErrorOccurred += MyNativeAdsManager_ErrorOccurred;
```
ネイティブ広告を表示する準備ができたら、RequestAd メソッドを呼び出して、広告を取得します。
```
myNativeAdsManager.RequestAd();
```

アプリ用にネイティブ広告の準備ができたら、AdReady イベントハンドラーが呼び出され、ネイティブ広告を表す NativeAdV2 オブジェクトが e パラメーターに渡されます。 NativeAdV2 プロパティを使ってネイティブ広告の各要素を取得し、ページ上にそれらの要素を表示します。また、RegisterAdContainer メソッドを呼び出して、ネイティブ広告のコンテナーとして機能する UI 要素を登録してください。広告インプレッションと広告クリックを適切に追跡するために必要です。

注意

ネイティブ広告の一部の要素は必須であり、アプリに常に表示する必要があります。詳しくは、「ネイティブ広告のガイドライン」をご覧ください。

たとえば、次の StackPanel を含む (または他のページ) がアプリに含まれているMainPageとします。この StackPanel には、ネイティブ広告のさまざまな要素 (タイトル、説明、画像、スポンサー テキスト、行動喚起テキストを表示するボタンなど) を表示する一連のコントロールが含まれています。

<StackPanel x:Name="NativeAdContainer" Background="#555555" Width="Auto" Height="Auto"
            Orientation="Vertical">
    <Image x:Name="AdIconImage" HorizontalAlignment="Left" VerticalAlignment="Center"
           Margin="20,20,20,20"/>
    <TextBlock x:Name="TitleTextBlock" HorizontalAlignment="Left" VerticalAlignment="Center"
           Text="The ad title will go here" FontSize="24" Foreground="White" Margin="20,0,0,10"/>
    <TextBlock x:Name="DescriptionTextBlock" HorizontalAlignment="Left" VerticalAlignment="Center"
               Foreground="White" TextWrapping="Wrap" Text="The ad description will go here"
               Margin="20,0,0,0" Visibility="Collapsed"/>
    <Image x:Name="MainImageImage" HorizontalAlignment="Left"
           VerticalAlignment="Center" Margin="20,20,20,20" Visibility="Collapsed"/>
    <Button x:Name="CallToActionButton" Background="Gray" Foreground="White"
            HorizontalAlignment="Left" VerticalAlignment="Center" Width="Auto" Height="Auto"
            Content="The call to action text will go here" Margin="20,20,20,20"
            Visibility="Collapsed"/>
    <StackPanel x:Name="SponsoredByStackPanel" Orientation="Horizontal" Margin="20,20,20,20">
        <TextBlock x:Name="SponsoredByTextBlock" Text="The ad sponsored by text will go here"
                   FontSize="24" Foreground="White" Margin="20,0,0,0" HorizontalAlignment="Left"
                   VerticalAlignment="Center" Visibility="Collapsed"/>
        <Image x:Name="IconImageImage" Margin="40,20,20,20" HorizontalAlignment="Left"
               VerticalAlignment="Center" Visibility="Collapsed"/>
    </StackPanel>
</StackPanel>

次のコード例は、StackPanel のコントロールにネイティブ広告の各要素を表示してから、RegisterAdContainer メソッドを呼び出して StackPanel を登録する AdReady イベントハンドラーを示しています。このコードでは、StackPanel が含まれているページの分離コードファイルから実行されることを想定しています。

void MyNativeAd_AdReady(object sender, NativeAdReadyEventArgs e)
{
    NativeAdV2 nativeAd = e.NativeAd;

    // Show the ad icon.
    if (nativeAd.AdIcon != null)
    {
        AdIconImage.Source = nativeAd.AdIcon.Source;

        // Adjust the Image control to the height and width of the 
        // provided ad icon.
        AdIconImage.Height = nativeAd.AdIcon.Height;
        AdIconImage.Width = nativeAd.AdIcon.Width;
    }

    // Show the ad title.
    TitleTextBlock.Text = nativeAd.Title;

    // Show the ad description.
    if (!string.IsNullOrEmpty(nativeAd.Description))
    {
        DescriptionTextBlock.Text = nativeAd.Description;
        DescriptionTextBlock.Visibility = Visibility.Visible;
    }

    // Display the first main image for the ad. Note that the service
    // might provide multiple main images. 
    if (nativeAd.MainImages.Count > 0)
    {
        NativeImage mainImage = nativeAd.MainImages[0];
        BitmapImage bitmapImage = new BitmapImage();
        bitmapImage.UriSource = new Uri(mainImage.Url);
        MainImageImage.Source = bitmapImage;

        // Adjust the Image control to the height and width of the 
        // main image.
        MainImageImage.Height = mainImage.Height;
        MainImageImage.Width = mainImage.Width;
        MainImageImage.Visibility = Visibility.Visible;
    }

    // Add the call to action string to the button.
    if (!string.IsNullOrEmpty(nativeAd.CallToActionText))
    {
        CallToActionButton.Content = nativeAd.CallToActionText;
        CallToActionButton.Visibility = Visibility.Visible;
    }

    // Show the ad sponsored by value.
    if (!string.IsNullOrEmpty(nativeAd.SponsoredBy))
    {
        SponsoredByTextBlock.Text = nativeAd.SponsoredBy;
        SponsoredByTextBlock.Visibility = Visibility.Visible;
    }

    // Show the icon image for the ad.
    if (nativeAd.IconImage != null)
    {
        BitmapImage bitmapImage = new BitmapImage();
        bitmapImage.UriSource = new Uri(nativeAd.IconImage.Url);
        IconImageImage.Source = bitmapImage;

        // Adjust the Image control to the height and width of the 
        // icon image.
        IconImageImage.Height = nativeAd.IconImage.Height;
        IconImageImage.Width = nativeAd.IconImage.Width;
        IconImageImage.Visibility = Visibility.Visible;
    }

    // Register the container of the controls that display
    // the native ad elements for clicks/impressions.
    nativeAd.RegisterAdContainer(NativeAdContainer);
}

ErrorOccurred イベントのイベントハンドラーを定義して、ネイティブ広告に関連するエラーを処理します。次の例では、テスト中に Visual Studio の [出力]ウィンドウにエラー情報を書き込みます。
```
private void MyNativeAdsManager_ErrorOccurred(object sender, NativeAdErrorEventArgs e)
{
    System.Diagnostics.Debug.WriteLine("NativeAd error " + e.ErrorMessage +
        " ErrorCode: " + e.ErrorCode.ToString());
}
```
アプリをコンパイルして実行し、テスト広告が表示されることを確認します。

ライブ広告を表示するアプリをリリースする

ネイティブ広告の実装によってテスト広告が正常に表示されることを確認したら、次の手順に従って、実際の広告を表示するようにアプリを構成し、更新したアプリをストアに提出します。

ネイティブ広告の実装がネイティブ広告のガイドラインに従っていることを確認してください。
パートナーセンターで [アプリ内広告] に進み、広告ユニットを作成します。広告ユニットの種類として、[ネイティブ] を指定します。広告ユニット ID とアプリケーション ID の両方をメモしておきます。

注意

テスト広告ユニットとライブ UWP 広告ユニットでは、アプリケーション ID の値の形式が異なります。テストアプリケーション ID の値は GUID です。パートナーセンターでライブ UWP 広告ユニットを作成する場合、広告ユニットのアプリケーション ID の値は、アプリのストア ID と常に一致します (9NBLGGH4R315 はストア ID の例です)。
必要に応じて、[アプリ内広告] ページの [仲介設定] セクションで設定を構成することで、ネイティブ広告の広告仲介を有効にできます。広告仲介を利用すると、複数の広告ネットワークから広告を表示することにより、広告収益とアプリプロモーションの機能を最大限に引き出すことができます。
コードで、広告ユニットのテスト値 (NativeAdsManagerV2 コンストラクターの applicationId パラメーターと adUnitId パラメーター) を、パートナーセンターで生成した実際の値に置き換えます。
パートナーセンターを使用してストアにアプリを申請します。
パートナーセンターで広告パフォーマンスレポートを確認します。

アプリで複数のネイティブ広告の広告ユニットを管理する

1 つのアプリで複数のネイティブ広告を使用することができます。このシナリオでは、各ネイティブ広告の配置に異なる広告ユニットを割り当てることをお勧めします。各コントロールに異なるネイティブ広告ユニットを使用することで、別々に仲介の設定を構成して、個別の報告データを取得できます。また、これにより、Microsoft のサービスはアプリに提供する広告を最適化できます。

重要

各広告ユニットは 1 つのアプリのみで使用できます。同じ広告ユニットを複数のアプリで使うと、その広告ユニットには広告が配信されません。

次の方法で共有

ネイティブ広告

前提条件

ネイティブ広告をアプリに統合する

ライブ広告を表示するアプリをリリースする

アプリで複数のネイティブ広告の広告ユニットを管理する

フィードバック

フィードバック

その他のリソース

次の方法で共有

ネイティブ広告

前提条件

ネイティブ広告をアプリに統合する

ライブ広告を表示するアプリをリリースする

アプリで複数のネイティブ広告の広告ユニットを管理する

関連トピック

フィードバック

フィードバック

その他のリソース