Sergey Lutay's Blog

Read this article in your language IT | EN | DE | ES

Обзор

Собственная реклама - это компонентно-ориентированное объявление, которое позволяет издателям гибко размещать отдельные компоненты текста: название, изображение, логотип, описание, призыв к действию - чтобы обеспечить наилучшее дополнение к внешнему виду остальной части приложения. Это позволяет разработчикам самостоятельно использовать шрифты, цвета и анимации для создания ненавязчивого пользовательского интерфейса в своем приложении, в то же время получая высокую доходность от рекламы. Для рекламодателей это также обеспечивает высокоэффективные места размещения, поскольку реклама встроена в приложение, и пользователи склонны больше взаимодействовать с этим спонсируемым контентом. Согласно отчету Mobile Marketing, собственная реклама в приложении обычно получает в пять раз больше пользовательского охвата, чем традиционные баннерные объявления, и, следовательно, получает больше средств от рекламодателей (в соответствии с eMarketer и другими отчетами).

Начиная с этого момента разработчики могут создавать собственные места для рекламы в своих приложениях или играх, используя последнюю версию Microsoft Advertising SDK (10.0.4 или новее). Платформа Microsoft Monetization предоставляет разработчикам максимальную свободу для создания собственных презентаций и доступна ограниченному набору издателей в закрытом экспериментальном проекте. Для доступа к проекту напишите по адерсу aiacare@microsoft.com.

С чего начать? 

Как и прежде, начните с загрузки Microsoft Advertising SDK. Это предоставит вам библиотеки для включения собственных объявлений в ваше приложение или игру.

Создайте "Собственный" рекламный блок для своего приложения в разделе «Монетизация с рекламой» в DevCenter (dev.windows.com). Этот рекламный блок вы будете использовать в своем приложении, когда вы запрашиваете объявление в коде.

Как добавить  встроенные объявления в свое приложение?

В этом разделе предполагается, что вы знакомы с Microsoft Advertising SDK для вашего  UWP приложения или игры. Если вы еще не работали с этим, ознакомтесь с инстукцией для начала работы. 

Чтобы показать собственные объявления в вашем приложении, следуйте инструкциям по типу проекта:

XAML/.NET

HTML/JavaScript

XAML/.NET

В этом разделе приведены примеры C# для вашего проекта XAML/.NET. Вам следует пройти эти простые шаги, чтобы получить собственные объявления в вашем коде.

Шаг 1: Ссылки на установку

Откройте проект в Visual Studio. В диспетчере ссылок (Reference Manager) разверните раздел Universal Windows, нажмите «Расширения», а затем установите флажок рядом с Microsoft Advertising SDK для XAML.

using Microsoft.Advertising.WinRT.UI;

Шаг 2. Настройка управления для собственных объявлений

В соответствующем месте в вашем приложении (например, в MainPage или на другой странице) укажите объект NativeAdsManager и строковые поля, которые представляют идентификатор приложения и идентификатор рекламного блока для вашего собственного объявления. В следующем примере кода присваиваются поля myAppId и myAdUnitId с тестовыми значениями для собственных объявлений, предоставляемых в значениях тестового режима. Эти значения используются только для тестирования; Вы должны заменить их существующеми значениями из Windows DevCenter, прежде чем публиковать свое приложение.

NativeAdsManager nativeAdsManager = null;
string appId = "d25517cb-12d4-4699-8bdc-52040c712cab";
string adUnitId = "test";

В коде, который запускается при запуске, создайте экземпляр NativeAdsManager.

// Ad Events
 
nativeAdsManager = new NativeAdsManager(appId, adUnitId);

Шаг 3: Запрос объявления

Если вы хотите показывать объявление, необходимо отправить запрос с помощью NativeAdsManager и подключить события.

nativeAdsManager.RequestAd();
nativeAdsManager.AdReady += NativeAd_OnAdReady;
nativeAdsManager.ErrorOccurred += NativeAd_ErrorOccurred;

Шаг 4: Использование компонентов объявления для создания опыта

Предположим, у вас есть страница XAML, в которой есть разные шаблоны для заголовка, описания, спонсирования, призыва к действию объявления и хранилища, который содержит все эти элементы. Пример StackPanel, содержащий все элементы.

<StackPanel x:Name="NativeAdContainer" BorderThickness="2" BorderBrush="Azure">
   <StackPanel x:Name="IconImageContainer" BorderThickness="2" BorderBrush="Azure" Visibility="Collapsed" >
       <Image x:Name="IconImage" />
   </StackPanel> 
   <TextBox x:Name="TitleBox" Text="The title will go here" Margin="78,0,-78,0"/></TextBox>
   <TextBox x:Name="DescriptionBox" Text="The Description will go here" Visibility="Collapsed"></TextBox>
   <TextBox x:Name="SponsoredBy" Text="The SponsoredBy will go here" Visibility="Collapsed"></TextBox>
   <StackPanel x:Name="MainImageContainer" BorderThickness="2" BorderBrush="Azure" Visibility="Collapsed">
        <Image x:Name="MainImage" Margin="0,8,0,4" />
   </StackPanel>
   <Button x:Name="CallToAction" Margin="0,8,0,4" Visibility="Collapsed" />
</StackPanel>

void NativeAd_OnAdReady(object sender, object e)
        {
           NativeAd nativeAd = (NativeAd)e;
           TitleBox.Text = nativeAd.Title;
         
        //if description is not null show description textbox
           var description = nativeAd.Description;
           if (!string.IsNullOrEmpty(description))
           {
               DescriptionBox.Text = nativeAd.Description;
               DescriptionBox.Visibility = Visibility.Visible;
           }
 
           //if sponsoredBy is not null show sponsoredBy textbox
           var sponsoredBy = nativeAd.SponsoredBy;
           if (!string.IsNullOrEmpty(sponsoredBy))
           {
               SponsoredBy.Text = sponsoredBy;
               SponsoredBy.Visibility = Visibility.Visible;
           }
 
           //if CallToAction is not null update Button
           var callToAction = nativeAd.CallToAction;
           if (!string.IsNullOrEmpty(callToAction))
           {
               CallToAction.Content = callToAction;
               CallToAction.Visibility = Visibility.Visible;
           }
 
           // Assets consists further information about Ad
           var assets = nativeAd.AdditionalAssets;
 
           // Loading images
           var icon = nativeAd.IconImage;
           if (icon != null)
           {
               var bitmapImage = new BitmapImage();
               bitmapImage.UriSource = new Uri(nativeAd.IconImage.Url);
               IconImage.Source = bitmapImage;
               // Best view when using the Height and Width of the image given
               IconImage.Height = nativeAd.IconImage.Height;
               IconImage.Width = nativeAd.IconImage.Width;
 
               IconImageContainer.Visibility = Visibility.Visible;
            }
 
            // There might be multiple main images sent by the server
            var mainImages = nativeAd.MainImages;
            if (mainImages.Count > 0)
            {
                var mainImage = mainImages[0];
                var bitmapImage = new BitmapImage();
                bitmapImage.UriSource = new Uri(mainImage.Url);
                MainImage.Source = bitmapImage;
                // Best view when using the Height and Width of the image given
                MainImage.Height = mainImage.Height;
                MainImage.Width = mainImage.Width;
 
                MainImageContainer.Visibility = Visibility.Visible;
            }
 
            // It is required to show the AdIcon in your container
            NativeAdContainer.Children.Add(nativeAd.AdIcon);
 
            // Register any xaml framework element for clicks/impressions
            nativeAd.RegisterAdContainer(NativeAdContainer);