फ़ाइल को सीधे कंप्यूटर पर खोलना
IMA की गाइड कहती है कि पेज को वेब सर्वर से चलाएँ, भले ही वह लोकल हो। HTML फ़ाइल सीधे खोलने से टेस्ट फ़ेल हो सकता है।
इम्प्लीमेंटेशन गाइड
Pre-roll video ads
प्लेयर के अंदर चलने वाला वीडियो विज्ञापन, उस वीडियो से पहले जिसे व्यक्ति ने देखना चुना है।
1 मिनट में समझें
जब आप सिनेमा जाते हैं, तो फ़िल्म शुरू होने से पहले कुछ ट्रेलर और विज्ञापन चलते हैं, याद है? प्री-रोल वीडियो ठीक वही है, बस आपकी साइट पर। व्यक्ति वीडियो देखने के लिए प्ले दबाता है और कंटेंट दिखने से पहले उसी प्लेयर में एक विज्ञापन चलता है। प्लेयर वह बॉक्स है जहाँ वीडियो चलता है, प्ले, पॉज़ और वॉल्यूम के बटनों के साथ। विज्ञापन खत्म होते ही चुना हुआ वीडियो शुरू हो जाता है।
इसके काम करने के लिए प्लेयर को विज्ञापन माँगना आना चाहिए। Google कोड का एक पैकेज देता है जिसे IMA SDK कहते हैं, और आप इसे प्लेयर के साथ लगाते हैं। यह विज्ञापन टैग के ज़रिए Ad Manager से अनुरोध करता है। विज्ञापन टैग एक इंटरनेट पता है जिसमें जगह की जानकारी होती है, जैसे विज्ञापन यूनिट और प्लेयर का साइज़। जवाब VAST में आता है, जो एक मानक फ़ॉर्मेट है, एक रेसिपी की तरह जो बताती है कि कौन सा वीडियो चलाना है और व्यूज़ कैसे गिनने हैं। जब साइट वीडियो विज्ञापन के नियम इस्तेमाल करती है, तो जवाब VMAP में आ सकता है, जो टीवी के कार्यक्रम-सारणी जैसा है और बताता है कि हर ब्रेक कब आएगा।
Google वीडियो के अपने आप शुरू होने, यानी ऑटोप्ले, के बारे में भी एक अहम बात बताता है। Chrome और Safari जैसे ब्राउज़रों के अपने नियम हैं, और अक्सर वीडियो तभी अपने आप शुरू हो सकता है जब उसमें आवाज़ न हो। ब्राउज़र इजाज़त देता है या नहीं, यह जानने का कोई सीधा सवाल नहीं है: एकमात्र तरीका चलाकर देखना है। इसीलिए IMA की गाइड कहती है कि मोबाइल पर विज्ञापन का बॉक्स व्यक्ति की किसी क्रिया से चालू होना चाहिए, जैसे प्ले बटन पर टैप। और अगर प्लेयर अपने आप या बिना आवाज़ के शुरू होने वाला है, तो उसे अनुरोध में यह बताना चाहिए, ताकि सिर्फ़ वही विज्ञापन आएँ जो इस तरह चल सकते हैं।
प्री-रोल तब ठीक है जब वीडियो ही आने की वजह हो, जैसे कोई पाठ, कोई रेसिपी या वीडियो खबर। Google की वीडियो नीति में इस स्लॉट को In-stream कहते हैं, यानी उस कंटेंट के अंदर जिसे व्यक्ति ने खुद देखना चुना है, और इसे सही ढंग से घोषित करना ज़रूरी है। हमेशा याद रखें: व्यक्ति वीडियो के लिए आया है, इसलिए विज्ञापन को कंट्रोल में दखल नहीं देना चाहिए और कंटेंट को अटकाना नहीं चाहिए।
चरण-दर-चरण
लागू किया गया उदाहरण
<!-- 1. Carrega o IMA SDK (antes do seu código) -->
<script src="//imasdk.googleapis.com/js/sdkloader/ima3.js"></script>
<!-- 2. O vídeo e, por cima dele, a caixa do anúncio -->
<div style="position:relative;width:640px;height:360px">
<video id="conteudo" width="640" height="360" playsinline controls>
<source src="meu-video.mp4" type="video/mp4">
</video>
<div id="adContainer" style="position:absolute;top:0;left:0"></div>
</div>
<button id="playButton">Assistir</button>
<script>
var video = document.getElementById('conteudo');
var adDisplayContainer = new google.ima.AdDisplayContainer(
document.getElementById('adContainer'), video);
var adsLoader = new google.ima.AdsLoader(adDisplayContainer);
var adsManager;
adsLoader.addEventListener(
google.ima.AdsManagerLoadedEvent.Type.ADS_MANAGER_LOADED,
function (e) {
adsManager = e.getAdsManager(video);
adsManager.addEventListener(
google.ima.AdEvent.Type.CONTENT_PAUSE_REQUESTED,
function () { video.pause(); });
adsManager.addEventListener(
google.ima.AdEvent.Type.CONTENT_RESUME_REQUESTED,
function () { video.play(); });
adsManager.addEventListener(
google.ima.AdErrorEvent.Type.AD_ERROR, onAdError);
});
adsLoader.addEventListener(
google.ima.AdErrorEvent.Type.AD_ERROR, onAdError);
function onAdError(e) {
console.log(e.getError());
if (adsManager) { adsManager.destroy(); }
video.play(); // sem anúncio, o vídeo continua
}
// 3. Pedido do anúncio (IDs de exemplo)
var adsRequest = new google.ima.AdsRequest();
adsRequest.adTagUrl = 'https://pubads.g.doubleclick.net/gampad/ads?' +
'iu=/1234567/exemplo&sz=640x480&env=vp&gdfp_req=1&output=vast' +
'&unviewed_position_start=1&vpa=click&vpmute=0&plcmt=1' +
'&description_url=https%3A%2F%2Fwww.exemplo.com%2Fvideo&correlator=';
adsRequest.linearAdSlotWidth = 640;
adsRequest.linearAdSlotHeight = 400;
adsLoader.requestAds(adsRequest);
// 4. Só começa quando a pessoa clica em Assistir
document.getElementById('playButton').addEventListener('click', function () {
adDisplayContainer.initialize();
try {
adsManager.init(640, 360, google.ima.ViewMode.NORMAL);
adsManager.start();
} catch (err) {
video.play();
}
});
</script>Google क्या सलाह देता है
सुझाव
सावधानी
IMA की गाइड कहती है कि पेज को वेब सर्वर से चलाएँ, भले ही वह लोकल हो। HTML फ़ाइल सीधे खोलने से टेस्ट फ़ेल हो सकता है।
मोबाइल पर विज्ञापन का बॉक्स व्यक्ति की किसी क्रिया से चालू होना चाहिए, जैसे प्ले पर टैप। इसके बिना विज्ञापन नहीं चल सकता।
खराब VAST जवाब से गलती हो सकती है। Google का उदाहरण विज्ञापन मैनेजर को नष्ट करता है और वीडियो चला देता है, ताकि व्यक्ति रुकी हुई स्क्रीन पर न अटके।
जब विंडो का साइज़ बदलता है, तो Google का उदाहरण वीडियो के साइज़ के साथ AdsManager का रीसाइज़ बुलाता है। इसके बिना विज्ञापन का साइज़ गलत हो सकता है।
नहीं। प्लेयर IMA से VAST टैग माँग सकता है। Google कहता है कि विज्ञापन नियम का पैरामीटर (ad_rule) विज्ञापन दिखाने के लिए अनिवार्य नहीं है, सिर्फ़ वीडियो विज्ञापन नियम इस्तेमाल करने के लिए है।
VAST वह जवाब है जो बताता है कि कौन सा विज्ञापन चलाना है। VMAP वह जवाब है जो विज्ञापन नियमों के साथ इस्तेमाल होता है और बताता है कि ब्रेक कब आएँगे। टैग output पैरामीटर से फ़ॉर्मेट चुनता है, जिसके मान vast और vmap जैसे होते हैं।
हाँ, जब ब्राउज़र इजाज़त दे। Chrome और Safari ऑटोप्ले को सीमित करते हैं, खासकर आवाज़ के साथ। प्लेयर को टेस्ट करना चाहिए, अनुरोध में बताना चाहिए कि वह अपने आप और बिना आवाज़ के चलेगा, और मोबाइल पर विज्ञापन व्यक्ति की क्रिया से शुरू करना चाहिए।
Google की गाइड कहती है कि विज्ञापन लोड न होने पर भी वीडियो चलता रहे। उदाहरण में विज्ञापन मैनेजर हटा दिया जाता है और वीडियो बिना विज्ञापन के चलता है।
लाइब्रेरी
इस पेज की हर बात Google के आधिकारिक दस्तावेज़ों पर आधारित है। सीधे स्रोत पर पढ़ें:
ऑडिट साइट को एक विज़िटर की तरह पढ़ता है, बिना कुछ क्लिक किए, और दिखाता है कि क्या ठीक करना है।