Integrieren von Bannerwerbung

Vungle Banner befindet sich derzeit in der BETA-Phase und es kann sein, dass Sie nur begrenzte Antworten auf Werbebanner-Anfragen erhalten. Bitte wenden Sie sich für den Zugang direkt an Ihren Kundenbetreuer, um einen erfolgreichen Start zu gewährleisten.

Überblick

Ab Vungle SDK v6.5.2 für Windows unterstützt Vungle Banneranzeigen. Sowohl MREC- als auch Banneranzeigen erfordern API-Version 16 oder höher.

Ähnlich wie bei MREC-Anzeigen handelt es sich bei Banner-Videoanzeigen um rechteckige Anzeigen, die an einer beliebigen Stelle innerhalb des Layouts der App platziert werden und in der Regel am oberen oder unteren Rand des Bildschirms angezeigt werden, sodass der Benutzer während der Wiedergabe der Anzeige weiterhin mit der App interagieren kann. Dieses Anzeigenformat erfordert keinen Vollbildschirm. Stattdessen bestimmt der Publisher die Position des Anzeigencontainers innerhalb seiner App. Die Größe des Bannercontainers muss jedoch entweder 320x50, 300x50 oder 728x90 (für Tablets) betragen.

Anforderungen für Bannerwerbung

  • Vungle SDK v6.5.2 für Windows
  • Windows 10 UWP

Unterstützte Bannergrößen

Die Containergröße zum Rendern von Banneranzeigen kann 320 x 50, 300 x 50 oder 728 x 90 (für Tablets) betragen. Sie können Banneranzeigen an beliebiger Stelle auf dem Bildschirm setzen, und der Benutzer kann die App während der Wiedergabe der Anzeige weiter verwenden.

Bannergröße Abmessungen
VungleBannerSizes.Banner_320x50 320x50
VungleBannerSizes.BannerShort_300x50 300x50
VungleBannerSizes.BannerLeaderboard_728x90 728x90

Schritt 1: Vollständige Basisintegration

Um Bannerwerbung in Ihre Windows-App zu integrieren, befolgen Sie zunächst die Anweisungen im Artikel zum Thema Basisintegration. Dieser Artikel enthält ergänzende Informationen und setzt voraus, dass Sie die Basisintegration bereits abgeschlossen haben.

Schritt 2: Bannerwerbung integrieren

Verwenden Sie VungleAdControl, um Bannerwerbung in einem Container zu laden und abzuspielen. Für eine einfachere und leichtere Integration können Sie die Steuerung an VungleAdControl übergeben und nur mit XAML integrieren. Für eine -Integration, die Ihnen eine detailliertere Steuerung ermöglicht, können Sie den Anzeigencontainer in XAML angeben und die Bannerwerbung programmatisch steuern.

Option 1: Einfache Banner-Integration mittels XAML

Sie müssen VungleAdControl mit der Vungle-App-ID und der Platzierungs-ID für die Bannerplatzierung angeben. Geben Sie an, dass diese VungleAdControl für eine Bannerwerbung ist, indem Sie isBannerAd auf „True“ setzen und erlauben, dass automatisch eine Bannerwerbung geladen und abgespielt wird, indem Sie AutoRun auf „True“ setzen.

Beispielcode:

<UI:VungleAdControl x:Name="vungleBannerControl" AutomationProperties.AutomationId="vungleBannerControl"
IsBannerAd="True"
AutoRun="True"
<!-- Specify dimensions: 320x50, 300x50, 728x90 -->
Width="SIZE_OF_WIDTH"
Height="SIZE_OF_HEIGHT"
Margin="10"
HorizontalAlignment="Left"
AppID="<YOUR_VUNGLE_APP_ID>"
Placement="<YOUR_BANNER_PLACEMENT_ID>"
<Border BorderBrush="Black" BorderThickness="1" Margin="10">
<TextBlock Text="Banner Ads will show here..." VerticalAlignment="Center" HorizontalAlignment="Center"/>
</Border>
</UI:VungleAdControl>

Option 2: Banner-Integration mit programmatischer Steuerung

Sie können XAML in Verbindung mit Code verwenden, um programmgesteuert zu steuern, wann Sie LoadBannerAd, PlayBannerAd oder LoadAndPlayBannerAd aufrufen, um Bannerwerbung zu Ihrem bevorzugten Zeitpunkt im Lebenszyklus Ihrer Anwendung zu laden und abzuspielen.

  1. Geben Sie den Anzeigencontainer in XAML an. Sie müssen VungleAdControl in XAML konfigurieren, wobei isBannerAd auf „True“ gesetzt sein muss. Geben Sie die Anzeigencontainergröße passend zur Bannergröße an, die Sie anzeigen möchten, indem Sie die richtigen Werte für Width und Height übergeben.

    Beispiel XAML:
    <UI:VungleAdControl x:Name="vungleBannerControl" AutomationProperties.AutomationId="vungleBannerControl"
        IsBannerAd="True"
        Width="320" Height="50" Margin="10" HorizontalAlignment="Left">
        <Border BorderBrush="Black" BorderThickness="1" Margin="10">
            <TextBlock Text="Banner Ads will show here..." VerticalAlignment="Center" HorizontalAlignment="Center"/>
        </Border>
    </UI:VungleAdControl>
  2. Legen Sie die Anwendungs-ID für VungleAdControl fest. Beginnen Sie mit dem Senden der Anwendungs-ID für VungleAdControl über die API AppID. Beachten Sie, dass das Vungle SDK eine Singleton-Klasse ist und Sie jeweils nur eine Anwendungs-ID verwenden können. Wenn Sie eine Banneranzeige mit Vollbildanzeigen abspielen, geben Sie die identische Anwendungs-ID ein, die Sie in der Funktion GetInstance zur Initialisierung des SDK verwenden.

    Zwischengeschaltete VungleAdControl:

    VungleSDKConfig sdkConfig = new VungleSDKConfig();
    sdkConfig.DisableBannerRefresh = true; // Default: false
    
    sdkInstance = AdFactory.GetInstance(vungleAppID, sdkConfig);
    this.vungleBannerControl.AppID = vungleAppID;

Schritt 3: Laden und Abspielen einer Bannerwerbung

Über die LoadAndPlayBannerAd-API können Sie eine Banneranzeige gleichzeitig laden und wiedergeben. Wenn Sie es vorziehen, eine Banneranzeige vorab zu laden und zu einem späteren Zeitpunkt abzuspielen, können Sie stattdessen LoadBannerAd und PlayBannerAd verwenden, um den Zeitpunkt der Bannerschaltung genauer zu steuern. Sie müssen die Platzierungs-ID für die Banneranzeige und die unterstützte Bannergröße übergeben, wenn Sie diese APIs verwenden, die über einen UI-Thread aufgerufen werden. Sie können StopBannerAd verwenden, um die Anzeige einer Bannerwerbung jederzeit zu beenden.

LoadAndPlayBannerAd:

await vungleBannerControl.Dispatcher.RunAsync(Windows.UI.Core.CoreDispatcherPriority.Normal, () =>
{
    this.vungleBannerControl.LoadAndPlayBannerAd("YOUR_PLACEMENT_ID", VungleBannerSizes.Banner_320x50);
});

LoadBannerAd:

this.vungleBannerControl.LoadBannerAd("YOUR_PLACEMENT_ID", VungleBannerSizes.Banner_320x50);

PlayBannerAd:

this.vungleBannerControl.PlayBannerAd("YOUR_PLACEMENT_ID", VungleBannerSizes.Banner_320x50);

StopBannerAd:

this.vungleBannerControl.StopBannerAd();

Questions?

Need further assistance, feel free to reach out to us, we’re here to help!

War dieser Beitrag hilfreich?