İşitsel reklamlar poster resmi

Bu kılavuzda, videonuzla yer paylaşımlı olarak IMA HTML5 SDK'nın nasıl kullanılacağı gösterilmektedir oynatılan bir poster resmiyle gösterilen oynatıcı. Bu özellik, ad_type=audio_video, VAST URL isteğinizde ayarlandı. Bunu yaptığınızda uygun ve eksiksiz olduğundan, reklamdan daha fazla para kazanma sunulması gerekir. Daha fazla bilgi için ad_type belgeler ve Videoda ses içerik inceleyebilirsiniz.

Bu kılavuzdaki adımları uygulayarak temel bir IMA üzerinde değişiklikler yapabilirsiniz. veya video örnek uygulamasında ses 'i kullanabilirsiniz.

Ön koşullar

  • Video reklamlar için IMA HTML5 SDK uygulayan uygulama. Bkz. IMA HTML5 başlangıç kılavuzu konulu videomuzu izleyin.
  • Bir işitsel reklam olduğunda video oynatıcının üzerine yerleştirilen varsayılan poster resmi alakalı bir yer paylaşımlı resim olmadan sunulur. Resmin kâğıda sığması için genişliği videonun genişliğinden az veya ona eşit olmalıdır oynatıcı ve yüksekliği videonunkinden en az 75 piksel az olmalıdır oynatıcıya gitmiş olur.

Poster resmi özelliğini etkinleştir

İşitsel ve video reklam isteğinde bulunmadan önce audioPosterImageEnabled ayarını yapın. özellik bayrağını true olarak, audioPosterImageDefaultUrl özellik bayrağını da varsayılan poster resminizin URL'sini ekleyin. Bu işlemi şununla yapın: ImaSdkSettings.setFeatureFlags() API'yi kullanarak AdDisplayContainer kontrol edin. Bu işaretlendiğinde ve bir işitsel reklam olduğunda oynatıldığında, IMA otomatik olarak reklamla alakalı bir resmi sayfanın üst video oynatıcıya gidin. IMA, mevcut en büyük tamamlayıcı reklam resmini seçer. yüklüdür ve video oynatıcıdan en az 75 piksel daha kısadır. Reklamın VAST'ı IMA'nın yer paylaşımı olarak kullanabileceği bir resim içermiyorsa IMA belirttiğiniz varsayılan resmi bindirme 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);
}