İşitsel reklamlar poster resmi

Bu kılavuzda, işitsel reklamlar oynatıldığında video oynatıcınızı poster resmiyle yer paylaşımı yapmak için IMA HTML5 SDK'nın nasıl kullanılacağı gösterilmektedir. Bu, VAST URL isteğinizde ad_type=audio_video ayarlandığında kullanılmalıdır. Bu sayede hem işitsel hem de video reklamlar uygun ve eksiksiz olduğundan, reklamdan daha fazla para kazanabilirsiniz. Daha fazla bilgi için ad_type belgelerine ve Video içeriğinde ses'e göz atın.

Temel IMA entegrasyonlarında değişiklikler yaparak bu kılavuzu takip edebilir veya bu özellikle tam entegrasyon için videoda ses örnek uygulamasını inceleyebilirsiniz.

Ön koşullar

  • Video reklamlar için IMA HTML5 SDK'yı uygulayan bir uygulama. Daha fazla bilgi için IMA HTML5 başlangıç kılavuzuna bakın.
  • Bir işitsel reklam ilgili bir yer paylaşımlı resim olmadan sunulduğunda video oynatıcının yerini değiştiren varsayılan bir poster resmi. Resmin video oynatıcıya sığması için, genişliğinin video oynatıcının genişliğinden az veya buna eşit olması ve yüksekliğinin video oynatıcının yüksekliğinden en az 75 piksel daha az olması gerekir.

Poster resmi özelliğini etkinleştirme

İşitsel ve video reklam isteğinde bulunmadan önce, audioPosterImageEnabled özellik işaretini true ve audioPosterImageDefaultUrl özellik işaretini varsayılan poster resmi URL'niz olarak ayarlayın. Bu işlemi, AdDisplayContainer oluşturmadan önce ImaSdkSettings.setFeatureFlags() API ile yapın. Bu ayarlanıp bir işitsel reklam oynatılırken IMA, reklamla ilişkili bir resmi video oynatıcının üzerine otomatik olarak yerleştirir. IMA, video oynatıcıya sığan ve video oynatıcıdan en az 75 piksel daha kısa olan en büyük tamamlayıcı reklam resmini seçer. Reklamın VAST'ı IMA'nın yer paylaşımı olarak kullanabileceği bir resim içermiyorsa IMA, belirttiğiniz varsayılan resmi yer paylaşımı olarak kullanır.

function initializeIMA() {
  console.log('initializing IMA');
  adContainer = document.getElementById('ad-container');
  google.ima.settings.setFeatureFlags(
    {
      'audioPosterImageEnabled': true,
      'audioPosterImageDefaultUrl':'http://your-ad-overlay/image.png'
    });
  adDisplayContainer = new google.ima.AdDisplayContainer(adContainer, videoElement);
  adsLoader = new google.ima.AdsLoader(adDisplayContainer);

  // Let the AdsLoader know when the video has ended
  videoElement.addEventListener('ended', function() {
    adsLoader.contentComplete();
  });

  var adsRequest = new google.ima.AdsRequest();
  adsRequest.adTagUrl = 'http://your-audio-video-ad-tag';
  ...
  // Pass the request to the adsLoader to request ads
  adsLoader.requestAds(adsRequest);
}