Native Designs angeben

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

Mit den Einstellungen für native Designs kann Google Ad Manager native Anzeigen basierend auf nativen Designs rendern, die Sie im Produkt definieren. Geben Sie zuerst Größe und Targeting 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 Rendering kümmern. Ad Manager wendet automatisch das richtige native Design für das Ziel an. Native Designs werden wie Banneranzeigen mit einem GAMBannerView 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 bestimmt wird.

Vorbereitung

  • Google Mobile Ads SDK Version 7.14.0 oder höher

In diesem Leitfaden werden Grundkenntnisse von Google Mobile Ads SDK vorausgesetzt. Wenn Sie das noch nicht getan haben, empfehlen wir Ihnen, unsere Anleitung Erste Schritte durchzugehen.

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 (Größe) eine der vordefinierten Größen aus.

  2. Legen Sie in Interface Builder die Breite und Höhe von GAMBannerView so fest, dass sie der in Schritt 1 ausgewählten vordefinierten Größe entsprechen. Eine Liste der Größen und der entsprechenden GADAdSize Konstanten finden Sie im BannergrößeAbschnitt.

Die Implementierung nativer Designs mit einer festen Größe ist so einfach wie das Befolgen der Anleitung unter Erste Banneranfrage. Sie haben jedoch die Flexibilität und Kontrolle über HTML, CSS und JavaScript, um Ihrer Banneranzeige ein natives Erscheinungsbild zu verleihen, das in Ihrer App natürlich wirkt.

Flexible Größe

In einigen Fällen ist eine feste Größe möglicherweise nicht sinnvoll. Beispielsweise möchten Sie vielleicht, dass die Breite der Anzeige dem Inhalt Ihrer App entspricht, aber die Höhe muss dynamisch an den Inhalt der Anzeige angepasst werden. In diesem Fall 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 eine spezielle GADAdSize Konstante, kGADAdSizeFluid, für diesen Fall. Die Höhe der flexiblen Anzeigengröße wird dynamisch bestimmt anhand der vom Publisher definierten Breite. So kann GAMBannerView, die Höhe an die des Creatives anpassen.

Flexible Anfrage

Anders als bei anderen Anzeigenformaten hat die Anzeigengröße kGADAdSizeFluid keine vordefinierte Breite. Legen Sie daher die Rahmenbreite des Banners explizit in Ihrem Code oder in Interface Builder fest. Wenn keine Breite angegeben ist, legt das SDK die Höhe des Banners standardmäßig anhand der vollen Breite des Geräts fest.

Wenn Sie eine Anfrage mit mehreren Größen stellen, die kGADAdSizeFluid enthält, wird die zurückgegebene Anzeige immer in einem flexiblen Container platziert und verhält sich wie eine flexible Anzeige. Falls in diesem flexiblen Container ein nicht flexibles Creative zurückgegeben wird, zentriert das SDK die Anzeige im Container. So müssen Sie die Breitenbeschränkung nicht jedes Mal ändern, wenn eine neue Anzeige zurückgegeben wird.

Die Implementierung für eine flexible Anfrage mit einer einzelnen Größe und einer flexiblen Anfrage mit mehreren Größen ist sehr ähnlich. Der einzige Unterschied besteht darin, dass Sie bei einer Anfrage mit mehreren Größen die Property validAdSizes festlegen, um die Anzeigengrößen anzugeben, die für die Anzeigenanfrage gültig sind:

Swift

bannerView.validAdSizes = [nsValue(for: AdSizeFluid), nsValue(for: AdSizeBanner)]

Objective-C

_bannerView.validAdSizes = @[ NSValueFromGADAdSize(kGADAdSizeFluid),
                              NSValueFromGADAdSize(kGADAdSizeBanner) ];

So sieht die vollständige Implementierung im Code aus:

Swift

var bannerView: AdManagerBannerView!

override func viewDidLoad() {
super.viewDidLoad()
  // Create the GAMBannerView and set its width to a width that makes sense for your
  // app. In this example, the width is set to the width of the UIViewController's
  // root view.
  bannerView = AdManagerBannerView(adSize: AdSizeFluid)
  var frameRect = bannerView.frame
  frameRect.size.width = view.bounds.width
  bannerView.frame = frameRect

  // Uncomment this code for a multisize fluid request.
  // bannerView.validAdSizes = [nsValue(for: AdSizeFluid), nsValue(for: AdSizeBanner)]

  bannerView.adUnitID = "YOUR_AD_UNIT_ID"
  bannerView.rootViewController = self

  // Make the ad request.
  bannerView.load(AdManagerRequest())
}

Objective-C

GAMBannerView *_bannerView;

- (void)viewDidLoad {
  [super viewDidLoad];
  // Create the GAMBannerView and set its width to a width that makes sense for your
  // app. In this example, the width is set to the width of the UIViewController's
  // root view.
  _bannerView = [[GAMBannerView alloc] initWithAdSize:kGADAdSizeFluid];
  CGRect frameRect = _bannerView.frame;
  frameRect.size.width = CGRectGetWidth(self.view.bounds);
  _bannerView.frame = frameRect;

  // Uncomment this code for a multisize fluid request.
  // _bannerView.validAdSizes = @[ NSValueFromGADAdSize(kGADAdSizeFluid),
  //                               NSValueFromGADAdSize(kGADAdSizeBanner) ];

  _bannerView.adUnitID = @"YOUR_AD_UNIT_ID";
  _bannerView.rootViewController = self;

  // Make the ad request.
  [_bannerView loadRequest:[GAMRequest request]];
}

Ein Beispiel für die Implementierung der flexiblen Anzeigengröße in Ad Manager finden Sie in der iOS API Demo App in Swift oder Objective-C.

API-Demo herunterladen

GADAdSizeDelegate-Protokoll

Möglicherweise möchten Sie die Höhe eines Banners kennen, bevor sich die Anzeigengröße ändert. Der Callback adView:willChangeAdSizeTo: benachrichtigt den Delegaten, bevor sich die Banneransicht in die neue GADAdSize ändert. Wenn Sie benachrichtigt werden möchten, bevor sich die Banneransicht in die neue Anzeigengröße ändert, muss Ihre Klasse dem GADAdSizeDelegate-Protokoll entsprechen.

Hier ist eine Beispielimplementierung des Callbacks adView:willChangeAdSizeTo:, die zeigt, wie Sie die neue Breite und Höhe des Banners abrufen:

Swift

// To be notified before the banner's ad size changes, your view controller class must
// conform to the GADAdSizeDelegate protocol.
bannerView.adSizeDelegate = self

// MARK: - GADAdSizeDelegate

func adView(_ bannerView: BannerView, willChangeAdSizeTo adSize: AdSize) {
  let height = adSize.size.height
  let width = adSize.size.width
}

Objective-C

// To be notified before the banner's ad size changes, your view controller class must
// conform to the GADAdSizeDelegate protocol.
_bannerView.adSizeDelegate = self;

#pragma mark - GADAdSizeDelegate

- (void)adView:(GADBannerView *)bannerView willChangeAdSizeTo:(GADAdSize)adSize {
  CGFloat height = adSize.size.height;
  CGFloat width = adSize.size.width;
}