Compartilhar via

Anúncios nativos

Aviso

A partir de 1º de junho de 2020, a plataforma Microsoft Ad Monetization para aplicativos UWP do Windows será desligada. Saiba mais

Um anúncio nativo é um formato de anúncio baseado em componente em que cada parte do anúncio criativo (como o título, a imagem, a descrição e o texto de chamada à ação) é entregue ao seu aplicativo como um elemento individual. Você pode integrar esses elementos ao seu aplicativo usando suas próprias fontes, cores, animações e outros componentes de interface do usuário para unir uma experiência de usuário discreta que se adapte à aparência do seu aplicativo, ao mesmo tempo em que ganha alto rendimento com os anúncios.

Para os anunciantes, os anúncios nativos fornecem posicionamentos de alto desempenho, pois a experiência de anúncios é fortemente integrada ao aplicativo e, portanto, os usuários tendem a interagir mais com esses tipos de anúncios.

Observação

Atualmente, há suporte para anúncios nativos apenas para aplicativos UWP baseados em XAML para Windows 10 e Windows 11. O suporte para aplicativos UWP escritos usando HTML e JavaScript está planejado para uma versão futura do SDK do Microsoft Advertising.

Pré-requisitos

  • Instale o Microsoft Advertising SDK com o Visual Studio 2015 ou uma versão posterior. Para obter instruções de instalação, consulte este artigo.

Integrar um anúncio nativo ao seu aplicativo

Siga estas instruções para integrar um anúncio nativo ao seu aplicativo e confirmar se sua implementação de anúncio nativo mostra um anúncio de teste.

  1. No Visual Studio, abra seu projeto ou crie um novo projeto.

    Observação

    Se você estiver usando um projeto existente, abra o arquivo Package.appxmanifest em seu projeto e verifique se o recurso Internet (Cliente) está selecionado. Seu aplicativo precisa desse recurso para receber anúncios de teste e anúncios ao vivo.

  2. Se o seu projeto tiver como alvo Any CPU, atualize seu projeto para usar uma saída de build específica da arquitetura (por exemplo, x86). Se o seu projeto for direcionado para Any CPU, não será possível adicionar com sucesso uma referência ao Microsoft Advertising SDK nos passos seguintes. Para mais informações, consulte Erros de referência causados pelo uso de qualquer CPU em seu projeto.

  3. Adicione uma referência ao SDK do Microsoft Advertising em seu projeto:

    1. Na janela do Gerenciador de Soluções, clique com o botão direito do mouse em Referências, e selecione Adicionar Referência...
    2. Em Reference Manager, expanda Universal Windows, clique em Extensõese marque a caixa de seleção ao lado de Microsoft Advertising SDK para XAML (versão 10.0).
    3. No Gerenciador de Referência, clique em OK.

  4. No arquivo de código apropriado em seu aplicativo (por exemplo, em MainPage.xaml.cs ou um arquivo de código para alguma outra página), adicione as referências de namespace a seguir.

    using Microsoft.Advertising.WinRT.UI;
using Windows.UI.Xaml.Media.Imaging;

  5. Em um local apropriado em seu aplicativo (por exemplo, em ou em MainPage alguma outra página), declare um objeto NativeAdsManagerV2 e vários campos de cadeia de caracteres que representam a ID do aplicativo e a ID da unidade de anúncios para seu anúncio nativo. O exemplo de código a seguir atribui os campos myAppId e myAdUnitId aos valores de teste para anúncios nativos.

    Observação

    Cada NativeAdsManagerV2 tem uma unidade de anúncios correspondente que é usada por nossos serviços para fornecer anúncios ao controle de anúncios nativo, e cada unidade de anúncio consiste em uma ID da unidade de anúncios e ID do aplicativo. Nestas etapas, você atribui valores de ID de unidade de anúncio de teste e ID de aplicativo ao seu controle. Esses valores de teste só podem ser usados em uma versão de teste do seu aplicativo. Antes de publicar seu aplicativo na Loja, você deve substituir esses valores de teste por valores reais do Partner Center.

    NativeAdsManagerV2 myNativeAdsManager = null;
string myAppId = "d25517cb-12d4-4699-8bdc-52040c712cab";
string myAdUnitId = "test";

  6. No código executado na inicialização (por exemplo, no construtor da página), crie uma instância do objeto NativeAdsManagerV2 e conecte os manipuladores de eventos AdReady e ErrorOccurred do objeto.

    myNativeAdsManager = new NativeAdsManagerV2(myAppId, myAdUnitId);
myNativeAdsManager.AdReady += MyNativeAd_AdReady;
myNativeAdsManager.ErrorOccurred += MyNativeAdsManager_ErrorOccurred;

  7. Quando estiver pronto para mostrar um anúncio nativo, chame o método RequestAd para buscar um anúncio.

    myNativeAdsManager.RequestAd();

  8. Quando um anúncio nativo está pronto para seu aplicativo, o manipulador de eventos do AdReady é chamado e um objeto NativeAdV2 que representa o anúncio nativo é passado para o parâmetro e. Use as propriedades NativeAdV2 para obter cada elemento do anúncio nativo e exibir esses elementos em sua página. Certifique-se também de chamar o método RegisterAdContainer para registrar o elemento de interface do usuário que atua como um contêiner para o anúncio nativo; isso é necessário para controlar corretamente as impressões de anúncios e cliques.

    Observação

    Alguns elementos do anúncio nativo são necessários e sempre devem ser mostrados em seu aplicativo. Para mais informações, consulte nossas diretrizes para anúncios nativos.

    Por exemplo, suponha que seu aplicativo contenha um MainPage (ou alguma outra página) com o seguinte StackPanel. Este StackPanel contém uma série de controles que exibem diferentes elementos de um anúncio nativo, incluindo o título, a descrição, as imagens, o texto patrocinado por e um botão que mostrará o texto de chamada à ação.

    <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>

    O exemplo de código a seguir demonstra um manipulador de eventos AdReady que exibe cada elemento do anúncio nativo nos controles dentro do StackPanel e, em seguida, chama o método RegisterAdContainer para registrar o StackPanel. Esse código pressupõe que ele seja executado no arquivo code-behind da página que contém o 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);
}

  9. Defina um manipulador de eventos para o evento ErrorOccurred para lidar com erros relacionados ao anúncio nativo. O exemplo a seguir grava informações de erro na janela Saída do Visual Studio durante o teste.

    private void MyNativeAdsManager_ErrorOccurred(object sender, NativeAdErrorEventArgs e)
{
    System.Diagnostics.Debug.WriteLine("NativeAd error " + e.ErrorMessage +
        " ErrorCode: " + e.ErrorCode.ToString());
}

  10. Compile e execute o aplicativo para vê-lo com um anúncio de teste.

Lance seu aplicativo com anúncios em tempo real

Depois de confirmar que sua implementação de anúncio nativo mostra com êxito um anúncio de teste, siga estas instruções para configurar seu aplicativo para mostrar anúncios reais e enviar seu aplicativo atualizado para a Loja.

  1. Verifique se a implementação dos anúncios nativos segue nossas diretrizes para os anúncios nativos.

  2. No Partner Center, acesse a página de anúncios no aplicativo e crie uma unidade de anúncio . Para o tipo de unidade de anúncio, especifique Native. Anote a ID da unidade de anúncios e a ID do aplicativo.

    Observação

    Os valores de ID do aplicativo para unidades de anúncios de teste e unidades de anúncios UWP dinâmicas têm formatos diferentes. Os valores de ID do aplicativo de teste são GUIDs. Quando você cria uma unidade de anúncio UWP ativa no Partner Center, o ID do aplicativo para a unidade de anúncio sempre corresponde ao ID da Loja do seu aplicativo (um exemplo de ID da Loja seria algo como 9NBLGGH4R315).

  3. Opcionalmente, você pode habilitar a mediação de anúncios para o anúncio nativo configurando as opções na seção Configurações de Mediação na página Anúncios no Aplicativo. A mediação de anúncios permite maximizar a receita de anúncios e os recursos de promoção de aplicativos exibindo anúncios de várias redes de anúncios.

  4. Em seu código, substitua os valores de unidade de anúncios de teste (ou seja, os parâmetros applicationId e adUnitId do construtor NativeAdsManagerV2 ) pelos valores dinâmicos gerados no Partner Center.

  5. Enviar seu aplicativo para a Loja usando o Partner Center.

  6. Examine seus relatórios de desempenho de publicidade no Partner Center.

Gerencie várias unidades de anúncios nativos em seu aplicativo

Você pode usar vários posicionamentos de anúncios nativos em um único aplicativo. Nesse cenário, recomendamos que você atribua uma unidade de anúncios diferente a cada posicionamento de anúncio nativo. O uso de unidades de anúncios diferentes para anúncios nativos permite que você separadamente definir as configurações de mediação e obter dados de relatório discretos para cada controle. Isso também permite que nossos serviços otimizem melhor os anúncios que fornecemos ao seu aplicativo.

Importante

Você pode usar cada unidade de anúncio em apenas um aplicativo. Se você usar uma unidade de anúncios em mais de um aplicativo, os anúncios não serão servidos para essa unidade de anúncios.