Native Designs

Plattform auswählen: Android (Beta) Neu Android iOS Flutter

Mit Einstellungen für native Designs können Sie festlegen, dass Google Ad Manager native Anzeigen basierend auf nativen Designs rendert, die Sie im Produkt definieren. Geben Sie zuerst Größe und Ausrichtung an. Fügen Sie dann HTML, CSS und JavaScript hinzu, um responsive Anzeigen zu definieren, die auf allen Bildschirmen in guter Qualität dargestellt werden. Sie müssen sich nicht um das Rendern kümmern. Ad Manager wendet automatisch das richtige native Design für das Ziel an. Native Designs werden wie Banneranzeigen mit einem AdManagerAdView implementiert. Sie können mit einer festen Anzeigengröße, die im Voraus festgelegt wird, oder mit einer flexiblen Anzeigengröße verwendet werden, die zur Laufzeit festgelegt wird.

Vorbereitung

  • Google Mobile Ads Flutter Plugin-Version 0.13.6 oder höher

In diesem Leitfaden werden Grundkenntnisse zu Google Mobile Ads Flutter Plugin vorausgesetzt. Wenn Sie dies noch nicht getan haben, sollten Sie sich unseren Leitfaden für die ersten Schritte ansehen.

Feste Größe

Mit nativen Designs mit einer festen Größe können Sie die Breite und Höhe der nativen Anzeige steuern. So legen Sie eine feste Größe fest:

  1. Erstellen Sie in der Ad Manager-Benutzeroberfläche eine Werbebuchung und wählen Sie im Drop-down-Menü des Felds Size eine der vordefinierten Größen aus.

  2. Laden Sie ein AdManagerBannerAd mit derselben Größe wie in Schritt 1 hoch. Informationen zum Instanziieren und Laden einer Anzeige finden Sie in der Dokumentation zu Banneranzeigen. Eine Liste der Größen und der entsprechenden AdSize-Konstanten finden Sie im Abschnitt Bannergröße.

Hier sehen Sie ein Beispiel dafür, wie Sie eine feste Größe wie die Anzeigengröße MEDIUM_RECTANGLE (300 × 250) angeben:

AdManagerBannerAd ad = AdManagerBannerAd(
  adUnitId: '<your-ad-unit>',
  sizes: <AdSize>[AdSize.mediumRectangle],
  request: AdManagerAdRequest(),
);

Flexible Größe

In einigen Fällen ist eine feste Größe möglicherweise nicht sinnvoll. Beispielsweise soll die Breite der Anzeige möglicherweise dem Inhalt Ihrer App entsprechen, die Höhe muss jedoch dynamisch angepasst werden, damit sie zum Inhalt der Anzeige passt. Um diesen Fall zu berücksichtigen, können Sie Fluid als Anzeigengröße in der Ad Manager-Benutzeroberfläche angeben. Dadurch wird festgelegt, dass die Größe der Anzeige zur Laufzeit in der App bestimmt wird. Das SDK bietet die spezielle AdSize-Konstante FLUID, um diesen Fall zu berücksichtigen. Die Höhe der responsiven Anzeigengröße wird dynamisch anhand der vom Publisher definierten Breite bestimmt. So kann die Anzeigenansicht der Plattform ihre Höhe an die des Creatives anpassen.

Flüssigkeitsanfrage

Verwenden Sie FluidAdManagerBannerAd, um eine flexible Anzeige anzufordern:

final fluidAd = FluidAdManagerBannerAd(
  adUnitId: '<your-ad-unit>',
  request: AdManagerAdRequest(),
  listener: AdManagerBannerAdListener(
    onAdLoaded: (Ad ad) {
      print('$_fluidAd loaded.');
    },
    onAdFailedToLoad: (Ad ad, LoadAdError error) {
      print('$_fluidAd failedToLoad: $error');
      ad.dispose();
    },
  ),

Flexible Anzeige präsentieren

Nachdem Ihre Anzeige geladen wurde, können Sie mit FluidAdWidget flüssige Anzeigen präsentieren. Die Höhe wird an die zugrunde liegende Anzeigenansicht der Plattform angepasst:

FluidAdWidget(
  width: <your-width>,
  ad: fluidAd,
);

Eine Beispielimplementierung der responsiven Anzeigengröße in Ad Manager finden Sie in der Beispiel-App auf GitHub.