Os anúncios nativos têm muitos recursos avançados, e com eles você pode criar personalizações e oferecer a melhor experiência possível. Este guia mostra como usar esses recursos.
Pré-requisitos
- Integre o formato de anúncio nativo.
Controles de recursos
Esta seção detalha como personalizar os recursos de criativo nos seus anúncios nativos. Você pode especificar uma proporção preferida para recursos de mídia e como os recursos de imagem são baixados e mostrados.
Controles de proporção preferencial para mídias
Com a API Media Aspect Ratio Controls, você pode especificar uma preferência para a proporção dos criativos de anúncios.
Chame NativeAdRequest.Builder.setMediaAspectRatio()
com um valor
NativeAd.NativeMediaAspectRatio.
Quando essa propriedade não é definida, o anúncio retornado pode ter qualquer proporção.
Mas se ela estiver definida, você pode aprimorar a experiência do usuário especificando o tipo de proporção desejado.
O exemplo a seguir instrui o SDK a escolher uma imagem ou um vídeo com uma proporção específica.
Kotlin
val adRequest = NativeAdRequest.Builder(
"ca-app-pub-3940256099942544/2247696110",
listOf(NativeAd.NativeAdType.NATIVE))
.setMediaAspectRatio(NativeAd.NATIVE_MEDIA_ASPECT_RATIO_LANDSCAPE)
.build()
Java
NativeAdRequest adRequest = new NativeAdRequest.Builder(
"ca-app-pub-3940256099942544/2247696110",
List.of(NativeAd.NativeAdType.NATIVE))
.setMediaAspectRatio(NativeAd.NATIVE_MEDIA_ASPECT_RATIO_LANDSCAPE)
.build();
Controle de download de imagens
Com o controle de download de imagens, você decide se o SDK vai retornar recursos de imagem ou apenas URIs.
Chame NativeAdRequest.Builder.disableImageDownloading().
O controle fica desativado por padrão.
Se o controle estiver desativado, o SDK do GMA de próxima geração vai preencher a imagem e o URI para você.
Mas se ele estiver ativado, o SDK vai preencher apenas o URI, e você poderá baixar as imagens reais a seu critério.
O exemplo a seguir instrui o SDK a retornar apenas o URI.
Kotlin
val adRequest = NativeAdRequest.Builder(
"ca-app-pub-3940256099942544/2247696110",
listOf(NativeAd.NativeAdType.NATIVE))
.setMediaAspectRatio(NativeAd.NATIVE_MEDIA_ASPECT_RATIO_LANDSCAPE)
.disableImageDownloading()
.build()
val adCallback: NativeAdLoaderCallback =
object : NativeAdLoaderCallback {
override fun onNativeAdLoaded(nativeAd: NativeAd) {
// Get the image uri.
val imageUri = nativeAd.image?.uri
}
};
// Load the native ad with the ad request and callback.
NativeAdLoader.load(adRequest, adLoaderCallback);
Java
NativeAdRequest adRequest = new NativeAdRequest.Builder(
"ca-app-pub-3940256099942544/2247696110",
List.of(NativeAd.NativeAdType.NATIVE))
.disableImageDownloading()
.build();
NativeAdLoaderCallback adLoaderCallback =
new NativeAdLoaderCallback() {
@Override
public void onNativeAdLoaded(@NonNull NativeAd nativeAd) {
// Get the image uri.
Uri imageUri = nativeAd.getImage().getUri();
}
};
// Load the native ad with the ad request and callback.
NativeAdLoader.load(adRequest, adLoaderCallback);
Controles de payload de imagens
Alguns anúncios têm uma série de imagens em vez de apenas uma. Use esse recurso para indicar se o app está preparado para mostrar todas as imagens ou apenas uma.
Os controles de payload de imagens ficam desativados por padrão.
Nesse caso, o app instrui o SDK a fornecer apenas a primeira imagem de qualquer recurso que tiver uma série.
Mas quando os controles estão ativados, o app indica que está preparado para mostrar todas as imagens de recursos que têm mais de uma.
O exemplo a seguir instrui o SDK a retornar vários recursos de imagem.
Posições das Opções de anúncios
Esta seção detalha como posicionar a sobreposição das Opções de Anúncios. Você pode colocá-la em um dos quatro cantos da imagem ou renderizar em uma visualização personalizada.
Controles de posições das Opções de Anúncios
Com os controles de posições das Opções de Anúncios, você escolhe em qual canto renderizar o ícone.
Chame NativeAdRequest.Builder.setAdChoicesPlacement()
com um valor
NativeAdRequest.AdChoicesPlacement.
Se isso não for feito, o ícone ficará no canto superior direito.
Se você definir uma posição, o ícone será colocado no local escolhido.
O exemplo a seguir mostra como definir uma posição personalizada das Opções de Anúncios na imagem.
Kotlin
val adRequest = NativeAdRequest.Builder(
"ca-app-pub-3940256099942544/2247696110",
listOf(NativeAd.NativeAdType.NATIVE))
.setAdChoicesPlacement(NativeAdOptions.ADCHOICES_BOTTOM_RIGHT)
.build()
Java
NativeAdRequest adRequest = new NativeAdRequest.Builder(
"ca-app-pub-3940256099942544/2247696110",
List.of(NativeAd.NativeAdType.NATIVE))
.setAdChoicesPlacement(NativeAdOptions.ADCHOICES_BOTTOM_RIGHT)
.build();
Visualização personalizada das Opções de anúncios
O recurso de visualização personalizada das Opções de Anúncios permite colocar esse ícone no local que você escolher. Esse recurso é diferente dos controles de posição das Opções de Anúncios, que permitem especificar apenas um dos quatro cantos da imagem.
Chame NativeAdView.setAdChoicesView()
com um valor AdChoicesView.
O exemplo a seguir demonstra como definir uma visualização personalizada de Opções de Anúncios, com o ícone renderizado dentro do AdChoicesView.
Kotlin
override fun onNativeAdLoaded(nativeAd: NativeAd) {
val nativeAdView = NativeAdView(applicationContext)
val adChoicesView = AdChoicesView(this)
nativeAdView.adChoicesView = adChoicesView
}
Java
public void onNativeAdLoaded(@NonNull NativeAd nativeAd) {
NativeAdView nativeAdView = new NativeAdView(getApplicationContext());
AdChoicesView adChoicesView = new AdChoicesView(this);
nativeAdView.setAdChoicesView(adChoicesView);
}
Controles de vídeo
Esta seção detalha como personalizar a experiência de reprodução dos anúncios em vídeo. Você pode definir o estado inicial como sem som e também implementar controles personalizados.
Comportamento de iniciar sem som
Com esse comportamento, você pode ativar ou desativar o áudio inicial de um vídeo.
Chame VideoOptions.Builder.setStartMuted()
com um valor boolean e chame NativeAdOptions.Builder.setVideoOptions().
O comportamento de iniciar sem som fica ativado por padrão.
Se ele for desativado, o app solicita que o vídeo comece com áudio.
Com o comportamento ativado, o app solicita que o vídeo comece sem áudio.
O exemplo a seguir mostra como iniciar o vídeo com o áudio ativado.
Kotlin
val videoOptions = VideoOptions.Builder()
.setStartMuted(false)
.build()
val adRequest = NativeAdRequest.Builder(
"ca-app-pub-3940256099942544/2247696110",
listOf(NativeAd.NativeAdType.NATIVE))
.setVideoOptions(videoOptions)
.build()
Java
VideoOptions videoOptions = VideoOptions.Builder()
.setStartMuted(false)
.build()
NativeAdRequest adRequest = new NativeAdRequest.Builder(
"ca-app-pub-3940256099942544/2247696110",
List.of(NativeAd.NativeAdType.NATIVE))
.setVideoOptions(videoOptions)
.build()
Controles de mídia personalizados
Esse recurso permite solicitar controles personalizados para reproduzir, pausar ou silenciar o vídeo.
Para definir o estado de silêncio inicial dos anúncios, chame VideoOptions.Builder.setCustomControlsRequested().
Os controles personalizados de mídia ficam desativados por padrão.
Nesses casos, seu vídeo vai mostrar controles de reprodução renderizados pelo SDK.
Se o anúncio tiver conteúdo de vídeo e os controles personalizados estiverem ativados, mostre-os, já que o anúncio não vai exibir nenhum controle por conta própria. Em seguida, os controles podem chamar os métodos relevantes no
VideoOptions.Builder.setCustomControlsRequested().
O exemplo a seguir mostra como solicitar um vídeo com controles de mídia personalizados.
Kotlin
val videoOptions: VideoOptions.Builder()
.setCustomControlsRequested(true)
.build()
val adRequest = new NativeAdRequest.Builder(
"ca-app-pub-3940256099942544/2247696110",
listOf(NativeAd.NativeAdType.NATIVE))
.setVideoOptions(videoOptions)
.build()
Java
VideoOptions VideoOptions = VideoOptions.Builder()
.setCustomControlsRequested(true)
.build()
NativeAdRequest adRequest = new NativeAdRequest.Builder(
"ca-app-pub-3940256099942544/2247696110",
List.of(NativeAd.NativeAdType.NATIVE))
.setVideoOptions(videoOptions)
.build()
Verificar se os controles personalizados estão ativados
Como não se sabe no momento da solicitação se o anúncio retornado vai permitir controles de vídeo personalizados, verifique se eles estão ativados.
Kotlin
val adCallback: NativeAdLoaderCallback =
object : NativeAdLoaderCallback {
override fun onNativeAdLoaded(nativeAd: NativeAd) {
val mediaContent = nativeAd.mediaContent;
if (mediaContent != null) {
val videoController = mediaContent.videoController;
val canShowCustomControls = videoController?.isCustomControlsEnabled();
}
}
};
Java
NativeAdLoaderCallback adCallback =
new NativeAdLoaderCallback() {
@Override
public void onNativeAdLoaded(@NonNull NativeAd nativeAd) {
MediaContent mediaContent = nativeAd.getMediaContent();
if (mediaContent != null) {
VideoController videoController = mediaContent.getVideoController();
if (videoController != null) {
boolean canShowCustomControls = videoController.isCustomControlsEnabled();
}
}
}
};
Renderizar controles de vídeo personalizados
Renderize controles de vídeo personalizados usando estas práticas recomendadas:
- Renderize a visualização de controles personalizados como um elemento filho da visualização de anúncio nativo. Com essa abordagem, os cálculos de visibilidade da medição aberta consideram os controles personalizados como uma obstrução amigável.
- Evite renderizar uma sobreposição invisível por cima de toda a visualização de mídia. As sobreposições bloqueiam os cliques na visualização de mídia, afetando negativamente a performance dos anúncios nativos. Crie uma sobreposição com tamanho suficiente para apenas caber os controles.
Gestos de clique personalizados
Com esse recurso dos anúncios nativos, gestos de deslizar em visualizações de anúncio podem ser registrados como cliques. Ele foi projetado para funcionar com apps que usam esses gestos na navegação. Este guia mostra como ativar gestos de clique personalizados nos seus anúncios nativos.
Chame NativeAdRequest.Builder.enableCustomClickGestureDirection()
com um valor NativeAd.SwipeGestureDirection
e um valor boolean.
O exemplo a seguir implementa um gesto personalizado de deslizar para a direita e preserva o comportamento normal da guia.
Os gestos de clique personalizados ficam desativados por padrão.
Quando desativados, o app vai usar o comportamento normal de cliques.
Quando ativado, o app vai aceitar os gestos de deslizar personalizados.
O exemplo a seguir implementa um gesto personalizado de deslizar para a direita e preserva o comportamento normal da guia.
Kotlin
val adOptions = NativeAdOptions
.Builder()
.enableCustomClickGestureDirection(
/* swipeDirection */ NativeAdOptions.SWIPE_GESTURE_DIRECTION_RIGHT,
/* tapsAllowed= */ true)
.build();
// The following sample ad unit ID has been enabled for custom click gestures
// and can be used for testing.
val adRequest = NativeAdRequest.Builder(
"ca-app-pub-3940256099942544/2247696110",
listOf(NativeAd.NativeAdType.NATIVE))
.withNativeAdOptions(adOptions)
.build();
Java
NativeAdOptions adOptions = new NativeAdOptions
.Builder()
.enableCustomClickGestureDirection(
/* swipeDirection */ NativeAdOptions.SWIPE_GESTURE_DIRECTION_RIGHT,
/* tapsAllowed= */ true)
.build();
// The following sample ad unit ID has been enabled for custom click gestures
// and can be used for testing.
NativeAdRequest adRequest = new NativeAdRequest.Builder(
"ca-app-pub-3940256099942544/2247696110",
List.of(NativeAd.NativeAdType.NATIVE))
.withNativeAdOptions(adOptions)
.build();
Detectar eventos relacionados a gestos de deslizar
Para detectar eventos de gestos de deslizar, chame NativeAd.setAdEventCallback()
com um NativeAdEventCallback e
implemente o método onAdSwipeGestureClicked().
Kotlin
val adCallback: NativeAdLoaderCallback =
object : NativeAdLoaderCallback {
override fun onNativeAdLoaded(nativeAd: NativeAd) {
// Implement the onAdSwipeGestureClicked() method.
val nativeAdCallback: NativeAdEventCallback = object : NativeAdEventCallback {
override fun onAdSwipeGestureClicked() {
// A swipe gesture click has occurred.
}
}
}
}
// Load the native ad with the ad request and callback.
NativeAdLoader.load(adRequest, adCallback)
Java
NativeAdLoaderCallback adCallback =
new NativeAdLoaderCallback() {
@Override
public void onNativeAdLoaded(@NonNull NativeAd nativeAd) {
// Implement the onAdSwipeGestureClicked() method.
NativeAdEventCallback nativeAdCallback = new NativeAdEventCallback() {
@Override
public void onAdSwipeGestureClicked() {
// A swipe gesture click has occurred.
}
};
}
};
// Load the native ad with the ad request and callback.
NativeAdLoader.load(adRequest, adCallback);
Mediação
Gestos de clique personalizados só funcionam em anúncios nativos renderizados pelo SDK dos Anúncios para Dispositivos Móveis do Google. As origens de anúncios que exigem SDKs de terceiros para renderização não respondem a essa configuração.