Prise en charge des annonces associées

Sélectionnez une plate-forme : HTML5 Android iOS

Ce guide est destiné aux éditeurs qui souhaitent ajouter des annonces associées à leur implémentation IMA Android.

Prérequis

• Application Android avec le SDK IMA intégré. Consultez l'exemple BasicExample si vous n'avez pas encore d'application avec le SDK intégré. Si vous avez besoin d'aide pour implémenter le SDK IMA dans votre application, consultez Configurer le SDK IMA.
• Tag d'emplacement publicitaire configuré pour renvoyer une annonce associée. Si vous avez besoin d'un exemple, consultez nos questions fréquentes.

Ajouter des annonces associées à votre application

Suivez les instructions pour ajouter un emplacement d'annonce associée et afficher des annonces associées dans votre application.

Créer un ViewGroup pour afficher votre application associée

Avant de demander un compagnon, vous devez créer un espace pour celui-ci dans votre mise en page. Dans votre fichier XML de mise en page, ajoutez un élément ViewGroup. Cet exemple utilise un LinearLayout. Dans une étape ultérieure, vous transmettrez une référence à cet élément à votre AdDisplayContainer.

Si vous effectuez l'intégration dans l'application BasicExample, ajoutez ce code au fichier activity_my.xml, sous videoPlayerContainer.

activity_my.xml

<LinearLayout
  android:id="@+id/companionAdSlot"
  android:layout_width="match_parent"
  android:layout_height="250dp"
  android:layout_gravity="center_horizontal"
  android:gravity="center"
  android:orientation="vertical"
  android:textAlignment="center" />

Créer un objet CompanionAdSlot

L'étape suivante consiste à créer un objet CompanionAdSlot, qui est ensuite ajouté à une instance ArrayList<CompanionAdSlot>. L'interface AdDisplayContainer accepte une liste d'emplacements d'annonces associées afin que vous puissiez afficher plusieurs annonces associées à la fois. Vous devez créer une instance de la classe ImaSdkFactory pour créer l'objet CompanionAdSlot.

ImaSdkFactory sdkFactory = ImaSdkFactory.getInstance();
ViewGroup companionViewGroup = (ViewGroup) findViewById(R.id.companionAdSlot);

CompanionAdSlot companionAdSlot = sdkFactory.createCompanionAdSlot();
companionAdSlot.setContainer(companionViewGroup);
companionAdSlot.setSize(300, 250);
ArrayList<CompanionAdSlot> companionAdSlots = new ArrayList<CompanionAdSlot>();
companionAdSlots.add(companionAdSlot);

Créez un emplacement d'annonce associée pour chaque taille d'annonce associée que vous souhaitez afficher dans votre application. Le SDK IMA remplit l'emplacement d'annonce associée avec toutes les annonces associées de la réponse VAST dont les dimensions correspondent à la hauteur et à la largeur de la vue. Le SDK IMA est également compatible avec les créations associées de taille fluide. Une fois que vous avez créé les companionAdSlots, ajoutez-les à AdsLoader. Les exemples suivants montrent comment procéder selon que vous utilisez l'extension Exoplayer-IMA ou d'autres implémentations IMA qui n'utilisent pas l'extension.

Extension Exoplayer-IMA

adsLoader = new ImaAdsLoader.Builder(this).setCompanionAdSlots(companionAdSlots).build();

Autres mises en œuvre

adsLoader.getAdDisplayContainer().setCompanionSlots(companionAdSlots);

Le plus important ! Votre application affiche désormais des annonces associées.

Annonces display associées fluides

IMA est compatible avec les annonces associées fluides. Ces annonces associées peuvent être redimensionnées pour correspondre à la taille de l'emplacement publicitaire. Ils occupent 100 % de la largeur de la vue parente, puis redimensionnent leur hauteur pour s'adapter au contenu de la bannière complémentaire. Elles sont définies à l'aide de la taille de l'annonce associée Fluid dans Ad Manager. Consultez l'image ci-dessous pour savoir où définir cette valeur.

Mettre à jour les applications Android pour une expérience fluide avec les appareils associés

Vous pouvez déclarer un emplacement pour un format companion fluide en mettant à jour la méthode CompanionAdSlot.setSize() pour qu'elle accepte CompanionAdSlot.FLUID_SIZE comme paramètre.

ImaSdkFactory sdkFactory = ImaSdkFactory.getInstance();
ViewGroup companionViewGroup = (ViewGroup) findViewById(R.id.companionAdSlot);

CompanionAdSlot companionAdSlot = sdkFactory.createCompanionAdSlot();
companionAdSlot.setContainer(companionViewGroup);
companionAdSlot.setSize(CompanionAdSlot.FLUID_SIZE, CompanionAdSlot.FLUID_SIZE);
ArrayList<CompanionAdSlot> companionAdSlots = new ArrayList<CompanionAdSlot>();
companionAdSlots.add(companionAdSlot);

Questions fréquentes

J'ai suivi le guide, mais je ne vois pas d'annonces associées. Que dois-je faire ?

Commencez par vérifier que votre tag renvoie bien des annonces associées. Pour ce faire, ouvrez le tag dans un navigateur Web et recherchez un tag <CompanionAds>. Si c'est le cas, vérifiez que la taille de la bannière associée renvoyée correspond à celle des dimensions que vous transmettez à l'objet CompanionAdSlot.

À quoi ressemblera mon emplacement pour les annonces associées si je suis ce guide ?

L'image suivante a été créée à partir de l'exemple BasicExample. Elle montre la vidéo de contenu en haut et l'annonce associée en dessous.