এই পৃষ্ঠাটি Cloud Translation API অনুবাদ করেছে।

শুরু করুন

IMA SDKগুলি আপনার ওয়েবসাইট এবং অ্যাপগুলিতে মাল্টিমিডিয়া বিজ্ঞাপনগুলিকে একীভূত করা সহজ করে তোলে৷ IMA SDK যেকোন VAST-সঙ্গী বিজ্ঞাপন সার্ভার থেকে বিজ্ঞাপনের অনুরোধ করতে পারে এবং আপনার অ্যাপে বিজ্ঞাপন প্লেব্যাক পরিচালনা করতে পারে। IMA ক্লায়েন্ট-সাইড SDK-এর সাথে, আপনি সামগ্রী ভিডিও প্লেব্যাকের নিয়ন্ত্রণ বজায় রাখেন, যখন SDK বিজ্ঞাপন প্লেব্যাক পরিচালনা করে। বিজ্ঞাপনগুলি অ্যাপের বিষয়বস্তু ভিডিও প্লেয়ারের উপরে অবস্থান করা একটি পৃথক ভিডিও প্লেয়ারে চলে৷

এই নির্দেশিকাটি দেখায় কিভাবে একটি সাধারণ ভিডিও প্লেয়ার অ্যাপে IMA SDK সংহত করা যায়। আপনি যদি একটি সম্পূর্ণ নমুনা ইন্টিগ্রেশন সহ দেখতে বা অনুসরণ করতে চান, GitHub থেকে সাধারণ উদাহরণটি ডাউনলোড করুন। আপনি যদি SDK প্রি-ইন্টিগ্রেটেড একটি HTML5 প্লেয়ারে আগ্রহী হন, তাহলে Video.js-এর জন্য IMA SDK প্লাগইনটি দেখুন।

IMA ক্লায়েন্ট-সাইড ওভারভিউ

IMA ক্লায়েন্ট-সাইড বাস্তবায়নে চারটি প্রধান SDK উপাদান জড়িত, যা এই নির্দেশিকায় প্রদর্শিত হয়েছে:

AdDisplayContainer : একটি কন্টেইনার অবজেক্ট যেখানে বিজ্ঞাপন রেন্ডার করা হয়।
AdsLoader : একটি বস্তু যা বিজ্ঞাপনের অনুরোধ করে এবং বিজ্ঞাপনের অনুরোধের প্রতিক্রিয়া থেকে ইভেন্ট পরিচালনা করে। আপনার শুধুমাত্র একটি বিজ্ঞাপন লোডার ইনস্ট্যান্টিয়েট করা উচিত, যা অ্যাপ্লিকেশনের সারাজীবন জুড়ে পুনরায় ব্যবহার করা যেতে পারে।
AdsRequest : একটি বস্তু যা একটি বিজ্ঞাপন অনুরোধ সংজ্ঞায়িত করে। বিজ্ঞাপনের অনুরোধগুলি VAST বিজ্ঞাপন ট্যাগের জন্য URL উল্লেখ করে, সেইসাথে অতিরিক্ত প্যারামিটার, যেমন বিজ্ঞাপনের মাত্রা।
AdsManager : একটি বস্তু যা বিজ্ঞাপনের অনুরোধের প্রতিক্রিয়া ধারণ করে, বিজ্ঞাপন প্লেব্যাক নিয়ন্ত্রণ করে এবং SDK দ্বারা চালিত বিজ্ঞাপন ইভেন্টগুলি শোনে।

পূর্বশর্ত

আপনি শুরু করার আগে, আপনার নিম্নলিখিতগুলির প্রয়োজন হবে:

তিনটি খালি ফাইল:
- index.html
- style.css
- ads.js
আপনার কম্পিউটারে পাইথন ইনস্টল করা, বা পরীক্ষার জন্য ব্যবহার করার জন্য একটি ওয়েব সার্ভার

1. একটি ডেভেলপমেন্ট সার্ভার শুরু করুন

যেহেতু IMA SDK যে পৃষ্ঠা থেকে এটি লোড করা হয়েছে সেই একই প্রোটোকলের মাধ্যমে নির্ভরতা লোড করে, তাই আপনার অ্যাপটি পরীক্ষা করার জন্য আপনাকে একটি ওয়েব সার্ভার ব্যবহার করতে হবে। একটি স্থানীয় উন্নয়ন সার্ভার শুরু করার সবচেয়ে সহজ উপায় হল পাইথনের অন্তর্নির্মিত সার্ভার ব্যবহার করা।

একটি কমান্ড লাইন ব্যবহার করে, যে ডিরেক্টরিতে আপনার index.html ফাইল রয়েছে তা থেকে রান করুন:
```
  python -m http.server 8000
```
দ্রষ্টব্য: http.server শুধুমাত্র Python 3.x এ উপলব্ধ।
একটি ওয়েব ব্রাউজারে, http://localhost:8000/ এ যান

আপনি অন্য কোনো ওয়েব সার্ভারও ব্যবহার করতে পারেন, যেমন Apache HTTP সার্ভার ।

2. একটি সাধারণ ভিডিও প্লেয়ার তৈরি করুন৷

প্রথমে, একটি সাধারণ HTML5 ভিডিও উপাদান তৈরি করতে index.html সংশোধন করুন, একটি মোড়ানো উপাদানে রয়েছে, এবং প্লেব্যাক ট্রিগার করার জন্য একটি বোতাম৷ এছাড়াও style.css এবং ads.js ফাইল লোড করতে প্রয়োজনীয় ট্যাগ যোগ করুন। তারপর, ভিডিও প্লেয়ারটিকে মোবাইল ডিভাইসের জন্য প্রতিক্রিয়াশীল করতে styles.css পরিবর্তন করুন৷ অবশেষে, ads.js- এ, প্লে বোতামে ক্লিক করলে ভিডিও প্লেব্যাক ট্রিগার করুন।

index.html

<!doctype html>
<html lang="en">
  <head>
    <title>IMA HTML5 Simple Demo</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <link rel="stylesheet" href="style.css">
  </head>
  <body>
    <div id="page-content">
      <div id="video-container">
        <video id="video-element">
          <source src="https://storage.googleapis.com/interactive-media-ads/media/android.mp4">
          <source src="https://storage.googleapis.com/interactive-media-ads/media/android.webm">
        </video>
      </div>
      <button id="play-button">Play</button>
    </div>
    <script src="ads.js"></script>
  </body>
</html>

style.css

#page-content {
  position: relative;
  /* this element's width controls the effective height */
  /* of the video container's padding-bottom */
  max-width: 640px;
  margin: 10px auto;
}

#video-container {
  position: relative;
  /* forces the container to match a 16x9 aspect ratio */
  /* replace with 75% for a 4:3 aspect ratio, if needed */
  padding-bottom: 56.25%;
}

#video-element {
  /* forces the contents to fill the container */
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

ads.js

var videoElement;

// On window load, attach an event to the play button click
// that triggers playback on the video element
window.addEventListener('load', function(event) {
  videoElement = document.getElementById('video-element');
  var playButton = document.getElementById('play-button');
  playButton.addEventListener('click', function(event) {
    videoElement.play();
  });
});

এই ধাপটি সম্পন্ন করার পর, আপনি যখন আপনার ব্রাউজারে index.html খুলবেন (আপনার ডেভেলপমেন্ট সার্ভারের মাধ্যমে) আপনি ভিডিও উপাদান দেখতে সক্ষম হবেন এবং আপনি প্লে বোতামে ক্লিক করলে ভিডিওটি শুরু হবে।

3. IMA SDK আমদানি করুন৷

এরপর, ads.js এর ট্যাগের আগে, index.html- এ একটি স্ক্রিপ্ট ট্যাগ ব্যবহার করে IMA ফ্রেমওয়ার্ক যোগ করুন।

index.html

...

        </video>
      </div>
      <button id="play-button">Play</button>
    </div>
    <script src="//imasdk.googleapis.com/js/sdkloader/ima3.js"></script>
    <script src="ads.js"></script>
  </body>
</html>

4. পৃষ্ঠা এবং ভিডিও প্লেয়ার হ্যান্ডলার সংযুক্ত করুন

জাভাস্ক্রিপ্টের সাথে ভিডিও প্লেয়ারের আচরণ পরিবর্তন করতে, ইভেন্ট হ্যান্ডলার যোগ করুন যা নিম্নলিখিত ক্রিয়াগুলিকে ট্রিগার করে:

পৃষ্ঠাটি লোড করা শেষ হলে, IMA SDK শুরু করুন৷
ভিডিও প্লে বোতামটি ক্লিক করা হলে, বিজ্ঞাপন লোড করুন (যদি না ইতিমধ্যেই বিজ্ঞাপন লোড হয়)।
ব্রাউজার উইন্ডোর আকার পরিবর্তন করা হলে, মোবাইল ডিভাইসের জন্য পৃষ্ঠাটিকে প্রতিক্রিয়াশীল করতে ভিডিও উপাদান এবং adsManager মাত্রা আপডেট করুন

ads.js

var videoElement;
// Define a variable to track whether there are ads loaded and initially set it to false
var adsLoaded = false;

window.addEventListener('load', function(event) {
  videoElement = document.getElementById('video-element');
  initializeIMA();
  videoElement.addEventListener('play', function(event) {
    loadAds(event);
  });
  var playButton = document.getElementById('play-button');
  playButton.addEventListener('click', function(event) {
    videoElement.play();
  });
});

window.addEventListener('resize', function(event) {
  console.log("window resized");
});

function initializeIMA() {
  console.log("initializing IMA");
}

function loadAds(event) {
  // Prevent this function from running on if there are already ads loaded
  if(adsLoaded) {
    return;
  }
  adsLoaded = true;

  // Prevent triggering immediate playback when ads are loading
  event.preventDefault();

  console.log("loading ads");
}

বেশিরভাগ ব্রাউজারে, IMA SDK বিজ্ঞাপন এবং বিজ্ঞাপন-সম্পর্কিত UI উপাদান উভয়ই প্রদর্শনের জন্য একটি ডেডিকেটেড বিজ্ঞাপন কন্টেইনার উপাদান ব্যবহার করে। উপরের-বাম কোণ থেকে ভিডিও উপাদানটি ওভারলে করার জন্য এই ধারকটিকে অবশ্যই আকার দিতে হবে। এই কন্টেইনারে রাখা বিজ্ঞাপনের উচ্চতা এবং প্রস্থ adsManager অবজেক্ট দ্বারা সেট করা হয়, তাই আপনাকে ম্যানুয়ালি এই মানগুলি সেট করতে হবে না।

এই বিজ্ঞাপন কন্টেইনার উপাদান বাস্তবায়ন করতে, প্রথমে video-container উপাদানের মধ্যে একটি নতুন div তৈরি করুন। তারপরে, video-element উপরের-বাম কোণে উপাদানটিকে অবস্থান করতে CSS আপডেট করুন। অবশেষে, initializeIMA() ফাংশনের মধ্যে কন্টেইনারের জন্য একটি ভেরিয়েবল সংজ্ঞায়িত করুন যা পৃষ্ঠাটি লোড করার সময় চলে।

index.html

...

  <div id="video-container">
    <video id="video-element" controls>
      <source src="https://storage.googleapis.com/interactive-media-ads/media/android.mp4">
      <source src="https://storage.googleapis.com/interactive-media-ads/media/android.webm">
    </video>
    <div id="ad-container"></div>
  </div>

...

style.css

...

#ad-container {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}

ads.js

var videoElement;
var adsLoaded = false;
var adContainer;

...

function initializeIMA() {
  console.log("initializing IMA");
  adContainer = document.getElementById('ad-container');
}

6. অ্যাডসলোডার শুরু করুন এবং একটি বিজ্ঞাপনের অনুরোধ করুন৷

বিজ্ঞাপনের একটি সেট অনুরোধ করার জন্য, একটি ima.AdsLoader উদাহরণ তৈরি করুন৷ এই উদাহরণটি একটি ইনপুট হিসাবে একটি AdDisplayContainer অবজেক্ট নেয় এবং একটি নির্দিষ্ট বিজ্ঞাপন ট্যাগ URL এর সাথে যুক্ত ima.AdsRequest অবজেক্টগুলি প্রক্রিয়া করতে ব্যবহার করা যেতে পারে৷ এই উদাহরণে ব্যবহৃত বিজ্ঞাপন ট্যাগে একটি 10-সেকেন্ডের প্রি-রোল বিজ্ঞাপন রয়েছে৷ আপনি IMA ভিডিও স্যুট ইন্সপেক্টর ব্যবহার করে এটি বা যেকোনো বিজ্ঞাপন ট্যাগ URL পরীক্ষা করতে পারেন।

একটি সর্বোত্তম অনুশীলন হিসাবে, একটি পৃষ্ঠার সমগ্র জীবনচক্রের জন্য শুধুমাত্র ima.AdsLoader এর একটি উদাহরণ বজায় রাখুন৷ অতিরিক্ত বিজ্ঞাপনের অনুরোধ করতে, একটি নতুন ima.AdsRequest অবজেক্ট তৈরি করুন, কিন্তু একই ima.AdsLoader পুনরায় ব্যবহার করুন। আরও তথ্যের জন্য, IMA SDK FAQ দেখুন।

ads.js

var videoElement;
var adsLoaded = false;
var adContainer;
var adDisplayContainer;
var adsLoader;

...

function initializeIMA() {
  console.log("initializing IMA");
  adContainer = document.getElementById('ad-container');
  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 = 'https://pubads.g.doubleclick.net/gampad/ads?' +
      'iu=/21775744923/external/single_ad_samples&sz=640x480&' +
      'cust_params=sample_ct%3Dlinear&ciu_szs=300x250%2C728x90&' +
      'gdfp_req=1&output=vast&unviewed_position_start=1&env=vp&impl=s&correlator=';

  // Specify the linear and nonlinear slot sizes. This helps the SDK to
  // select the correct creative if multiple are returned.
  adsRequest.linearAdSlotWidth = videoElement.clientWidth;
  adsRequest.linearAdSlotHeight = videoElement.clientHeight;
  adsRequest.nonLinearAdSlotWidth = videoElement.clientWidth;
  adsRequest.nonLinearAdSlotHeight = videoElement.clientHeight / 3;

  // Pass the request to the adsLoader to request ads
  adsLoader.requestAds(adsRequest);
}

7. AdsLoader ইভেন্টের জন্য শুনুন

বিজ্ঞাপনগুলি সফলভাবে লোড হলে, ima.AdsLoader একটি ADS_MANAGER_LOADED ইভেন্ট নির্গত করে৷ AdsManager অবজেক্ট শুরু করতে কলব্যাকে পাস করা ইভেন্ট পার্স করুন। AdsManager বিজ্ঞাপন ট্যাগ URL-এর প্রতিক্রিয়া দ্বারা সংজ্ঞায়িত পৃথক বিজ্ঞাপনগুলিকে লোড করে।

উপরন্তু, লোডিং প্রক্রিয়া চলাকালীন ঘটতে পারে এমন কোনো ত্রুটি হ্যান্ডেল করতে ভুলবেন না। বিজ্ঞাপনগুলি লোড না হলে, নিশ্চিত করুন যে মিডিয়া প্লেব্যাক বিজ্ঞাপন ছাড়াই চলতে থাকে, যাতে ব্যবহারকারীর অভিজ্ঞতায় হস্তক্ষেপ না হয়।

ads.js

var videoElement;
var adsLoaded = false;
var adContainer;
var adDisplayContainer;
var adsLoader;
var adsManager;

...

function initializeIMA() {
  console.log("initializing IMA");
  adContainer = document.getElementById('ad-container');
  adDisplayContainer = new google.ima.AdDisplayContainer(adContainer, videoElement);
  adsLoader = new google.ima.AdsLoader(adDisplayContainer);
  adsLoader.addEventListener(
      google.ima.AdsManagerLoadedEvent.Type.ADS_MANAGER_LOADED,
      onAdsManagerLoaded,
      false);
  adsLoader.addEventListener(
      google.ima.AdErrorEvent.Type.AD_ERROR,
      onAdError,
      false);

...

function onAdsManagerLoaded(adsManagerLoadedEvent) {
  // Instantiate the AdsManager from the adsLoader response and pass it the video element
  adsManager = adsManagerLoadedEvent.getAdsManager(
      videoElement);
}

function onAdError(adErrorEvent) {
  // Handle the error logging.
  console.log(adErrorEvent.getError());
  if(adsManager) {
    adsManager.destroy();
  }
}

8. অ্যাডস ম্যানেজার শুরু করুন

বিজ্ঞাপন প্লেব্যাক শুরু করতে, আপনাকে AdsManager শুরু করতে হবে। সম্পূর্ণরূপে মোবাইল ব্রাউজার সমর্থন করার জন্য, এটি একটি ব্যবহারকারীর মিথস্ক্রিয়া দ্বারা ট্রিগার করা উচিত।

ads.js

...

function loadAds(event) {
  // prevent this function from running on every play event
  if(adsLoaded) {
    return;
  }
  adsLoaded = true;

  // prevent triggering immediate playback when ads are loading
  event.preventDefault();

  console.log("loading ads");

  // Initialize the container. Must be done via a user action on mobile devices.
  videoElement.load();
  adDisplayContainer.initialize();

  var width = videoElement.clientWidth;
  var height = videoElement.clientHeight;
  try {
    adsManager.init(width, height, google.ima.ViewMode.NORMAL);
    adsManager.start();
  } catch (adError) {
    // Play the video without ads, if an error occurs
    console.log("AdsManager could not be started");
    videoElement.play();
  }
}

...

9. অ্যাডস ম্যানেজারকে প্রতিক্রিয়াশীল করুন

ভিডিও প্লেয়ারের আকারের সাথে মানানসই বিজ্ঞাপনগুলি গতিশীলভাবে পুনরায় আকার দেয় তা নিশ্চিত করতে, যদি স্ক্রীনের আকার বা অভিযোজন পরিবর্তন হয়, তাহলে উইন্ডোর আকার পরিবর্তন ইভেন্টটিকে adsManager.resize() কল করতে হবে।

ads.js

...

window.addEventListener('resize', function(event) {
  console.log("window resized");
  if(adsManager) {
    var width = videoElement.clientWidth;
    var height = videoElement.clientHeight;
    adsManager.resize(width, height, google.ima.ViewMode.NORMAL);
  }
});

...

10. AdsManager ইভেন্টের জন্য শুনুন

AdsManager বেশ কয়েকটি ইভেন্টও বরখাস্ত করে যা অবশ্যই পরিচালনা করা উচিত। এই ইভেন্টগুলি রাজ্যের পরিবর্তনগুলি ট্র্যাক করতে, কন্টেন্ট ভিডিওতে প্লে এবং পজ ট্রিগার করতে এবং ত্রুটিগুলি নিবন্ধন করতে ব্যবহৃত হয়৷

হ্যান্ডলিং ত্রুটি

AdsLoader এর জন্য তৈরি করা ত্রুটি হ্যান্ডলার একই কলব্যাক ফাংশনের সাথে একটি নতুন ইভেন্ট হ্যান্ডলার যোগ করে AdsManager এর জন্য ত্রুটি হ্যান্ডলার হিসেবে কাজ করতে পারে।

ads.js

...

function onAdsManagerLoaded(adsManagerLoadedEvent) {
  adsManager = adsManagerLoadedEvent.getAdsManager(
      videoElement);

  adsManager.addEventListener(
      google.ima.AdErrorEvent.Type.AD_ERROR,
      onAdError);
}

...

খেলা এবং বিরতি ইভেন্ট ট্রিগার

যখন AdsManager প্রদর্শনের জন্য একটি বিজ্ঞাপন সন্নিবেশ করার জন্য প্রস্তুত হয়, তখন এটি CONTENT_PAUSE_REQUESTED ইভেন্টটি চালু করে। অন্তর্নিহিত ভিডিও প্লেয়ারে একটি বিরতি ট্রিগার করে এই ইভেন্টটি পরিচালনা করুন৷ একইভাবে, যখন একটি বিজ্ঞাপন সম্পূর্ণ হয়, AdsManager CONTENT_RESUME_REQUESTED ইভেন্টটি বরখাস্ত করে। অন্তর্নিহিত বিষয়বস্তু ভিডিওতে প্লেব্যাক পুনরায় চালু করে এই ইভেন্টটি পরিচালনা করুন।

ads.js

...

function onAdsManagerLoaded(adsManagerLoadedEvent) {
  adsManager = adsManagerLoadedEvent.getAdsManager(
      videoElement);

  adsManager.addEventListener(
      google.ima.AdErrorEvent.Type.AD_ERROR,
      onAdError);
  adsManager.addEventListener(
      google.ima.AdEvent.Type.CONTENT_PAUSE_REQUESTED,
      onContentPauseRequested);
  adsManager.addEventListener(
      google.ima.AdEvent.Type.CONTENT_RESUME_REQUESTED,
      onContentResumeRequested);
}

...

function onContentPauseRequested() {
  videoElement.pause();
}

function onContentResumeRequested() {
  videoElement.play();
}

মোবাইল ডিভাইসে ক্লিক-টু-পজ ট্রিগার করছে

যেহেতু AdContainer ভিডিও উপাদানকে ওভারলে করে, ব্যবহারকারীরা অন্তর্নিহিত প্লেয়ারের সাথে সরাসরি যোগাযোগ করতে পারে না। এটি মোবাইল ডিভাইসে ব্যবহারকারীদের বিভ্রান্ত করতে পারে, যারা প্লেব্যাক বিরাম দিতে একটি ভিডিও প্লেয়ারে ট্যাপ করতে সক্ষম হবে বলে আশা করে৷ এই সমস্যাটির সমাধান করার জন্য, IMA SDK বিজ্ঞাপন ওভারলে থেকে IMA দ্বারা পরিচালিত নয় এমন যেকোন ক্লিকগুলিকে AdContainer উপাদানে পাস করে, যেখানে সেগুলি পরিচালনা করা যেতে পারে। এটি নন-মোবাইল ব্রাউজারে রৈখিক বিজ্ঞাপনের ক্ষেত্রে প্রযোজ্য নয়, কারণ বিজ্ঞাপনটিতে ক্লিক করলে ক্লিকথ্রু লিঙ্কটি খোলে।

ক্লিক-টু-পজ বাস্তবায়ন করতে, AdContainer এ একটি ক্লিক হ্যান্ডলার যোগ করুন এবং অন্তর্নিহিত ভিডিওতে ইভেন্ট প্লে বা পজ ট্রিগার করুন।

ads.js

...

function initializeIMA() {
  console.log("initializing IMA");
  adContainer = document.getElementById('ad-container');
  adContainer.addEventListener('click', adContainerClick);
  adDisplayContainer = new google.ima.AdDisplayContainer(adContainer, videoElement);
  adsLoader = new google.ima.AdsLoader(adDisplayContainer);

...

function adContainerClick(event) {
  console.log("ad container clicked");
  if(videoElement.paused) {
    videoElement.play();
  } else {
    videoElement.pause();
  }
}

...

নন-লিনিয়ার বিজ্ঞাপনে প্লে ট্রিগার করছে

যখন একটি বিজ্ঞাপন চালানোর জন্য প্রস্তুত থাকে তখন AdsManager কন্টেন্ট ভিডিওটিকে বিরতি দেয়, কিন্তু এই আচরণটি নন-লিনিয়ার বিজ্ঞাপনের জন্য দায়ী নয়, যেখানে বিজ্ঞাপনটি প্রদর্শিত হওয়ার সময় বিষয়বস্তু চলতে থাকবে। নন-লিনিয়ার বিজ্ঞাপনগুলিকে সমর্থন করতে, LOADED ইভেন্ট নির্গত করার জন্য AdsManager এর কথা শুনুন। তারপরে, বিজ্ঞাপনটি রৈখিক কিনা তা পরীক্ষা করুন এবং যদি না হয়, ভিডিও উপাদানটিতে প্লেব্যাক পুনরায় শুরু করুন৷

ads.js

...

function onAdsManagerLoaded(adsManagerLoadedEvent) {
  adsManager = adsManagerLoadedEvent.getAdsManager(
      videoElement);

  adsManager.addEventListener(
      google.ima.AdErrorEvent.Type.AD_ERROR,
      onAdError);
  adsManager.addEventListener(
      google.ima.AdEvent.Type.CONTENT_PAUSE_REQUESTED,
      onContentPauseRequested);
  adsManager.addEventListener(
      google.ima.AdEvent.Type.CONTENT_RESUME_REQUESTED,
      onContentResumeRequested);
  adsManager.addEventListener(
      google.ima.AdEvent.Type.LOADED,
      onAdLoaded);
}

...

function onAdLoaded(adEvent) {
  var ad = adEvent.getAd();
  if (!ad.isLinear()) {
    videoElement.play();
  }
}

তাই তো! আপনি এখন অনুরোধ করছেন এবং IMA SDK-এর সাথে বিজ্ঞাপন প্রদর্শন করছেন৷ আরও উন্নত SDK বৈশিষ্ট্য সম্পর্কে জানতে, GitHub-এ অন্যান্য গাইড বা নমুনাগুলি দেখুন।

শুরু করুন

IMA ক্লায়েন্ট-সাইড ওভারভিউ

পূর্বশর্ত

1. একটি ডেভেলপমেন্ট সার্ভার শুরু করুন

2. একটি সাধারণ ভিডিও প্লেয়ার তৈরি করুন৷

3. IMA SDK আমদানি করুন৷

4. পৃষ্ঠা এবং ভিডিও প্লেয়ার হ্যান্ডলার সংযুক্ত করুন

5. বিজ্ঞাপন ধারক তৈরি করুন

6. অ্যাডসলোডার শুরু করুন এবং একটি বিজ্ঞাপনের অনুরোধ করুন৷

7. AdsLoader ইভেন্টের জন্য শুনুন

8. অ্যাডস ম্যানেজার শুরু করুন

9. অ্যাডস ম্যানেজারকে প্রতিক্রিয়াশীল করুন

10. AdsManager ইভেন্টের জন্য শুনুন

হ্যান্ডলিং ত্রুটি

খেলা এবং বিরতি ইভেন্ট ট্রিগার

মোবাইল ডিভাইসে ক্লিক-টু-পজ ট্রিগার করছে

নন-লিনিয়ার বিজ্ঞাপনে প্লে ট্রিগার করছে