Native Designs

Mit Einstellungen für native Designs kann Google Ad Manager das Rendern Ihrer nativen Anzeigen basierend auf nativen Designs vornehmen, die Sie im Produkt angeben. 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 optimal dargestellt werden. Sie müssen sich nicht um das Rendern kümmern. In Ad Manager wird automatisch das richtige native Design für das Ziel angewendet. Native Designs werden genau 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-Plug-in: Version 0.13.6 oder höher

In diesem Leitfaden werden Grundkenntnisse des Google Mobile Ads SDK 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 eine Werbebuchung in der Ad Manager-Benutzeroberfläche und wählen Sie eine der vordefinierten Größen aus dem Drop-down-Menü des Felds Size 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 nicht sinnvoll. Beispielsweise soll die Breite der Anzeige mit dem Inhalt Ihrer App übereinstimmen, die Höhe soll jedoch dynamisch an den Inhalt der Anzeige angepasst werden. Um diesen Fall zu berücksichtigen, können Sie in der Ad Manager-Benutzeroberfläche Fluid als Anzeigengröße angeben. Dadurch wird festgelegt, dass die Größe der Anzeige zur Laufzeit in der App bestimmt wird. Das SDK bietet eine 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();
    },
  ),

Auslieferung der responsiven Anzeige

Nachdem die Anzeige geladen wurde, können Sie mit FluidAdWidget responsive 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.