顯示插頁式 H5 遊戲廣告

這個範例會使用 Google 發布商廣告代碼 (GPT) 程式庫顯示插頁式遊戲廣告。插頁式遊戲廣告是由 GPT 管理的全螢幕廣告,必須透過手動觸發,才能在網頁上執行的遊戲中向使用者放送。如要進一步瞭解插頁式遊戲廣告,請參閱「顯示插頁式 H5 遊戲廣告」。

如要顯示插頁式遊戲廣告並與其互動,請使用下列 GPT 事件:

活動 觸發時機
GamingInterstitialSlotReady 插頁式遊戲廣告已可向使用者顯示。

如要顯示插頁式廣告,請對提供的事件物件呼叫 makeGameManualInterstitialVisible()
GamingInterstitialSlotClosed 使用者關閉先前顯示的插頁式遊戲廣告。

使用這個事件,在插頁式遊戲廣告關閉時執行自訂邏輯。

遊戲結構

視遊戲的結構而定,插頁式遊戲廣告可以全螢幕顯示,也可以顯示在遊戲頁框中。詳情請參閱「H5 遊戲結構」。

實作範例假設 H5 遊戲會使用 Fullscreen 結構,直接轉譯至最上層視窗。在這種情況下,插頁式遊戲廣告也會以全螢幕顯示。

不過,如果遊戲是置於子頁框 (採用 iFrame/WebView 結構) 中,也可以使用同一組程式碼。如要限制插頁式遊戲廣告只能在 H5 遊戲畫布內放送,請將遊戲放在 iFrame 中,如以下範例所示:

<!doctype html>
<html>
 
<head>
   
<!-- The Google Publisher Tag here, if any, will only be responsible for serving ads outside of the H5 game. -->
   
<title>Page for this example H5 game</title>
   
<!-- Your <head> content here. -->
 
</head>
 
<body>
   
<span id="example-text">Example H5 game</span>

   
<!-- Sample code is served here. The Google Publisher Tag loaded in this frame will only be used within the H5 game. -->
   
<iframe src="https://www.example.com" title="Example game" allow="autoplay"></iframe>
 
</body>
</html>

使用須知

  • 為確保提供最佳的使用者體驗,GPT 只會在妥善支援插頁式遊戲廣告的網頁中,請求這類格式的廣告。由於這項限制,defineOutOfPageSlot() 可能會傳回空值。請務必檢查是否發生這個情況,確定並未執行不必要的作業。

  • 請只在您想刊登插頁式廣告的網頁或環境中,發出插頁式遊戲廣告請求。插頁式遊戲廣告可在電腦、平板電腦和行動裝置上放送。

  • 插頁式遊戲廣告會產生專屬的廣告版位。與其他廣告類型不同,您不必為插頁式遊戲廣告定義 <div>。廣告放送時,這類廣告將自動建立,並在插入專屬容器後於頁面顯示。

  • 插頁式遊戲廣告只能使用一次。您無法重新整理插頁式遊戲廣告版位。而是必須銷毀並重新建立這個時段,如實作範例所示。

  • 插頁式遊戲廣告設有固定的展示頻率上限,避免 gamingInterstitialSlotReady 事件在 120 秒內觸發多次。

  • 如果您是在擁有多個廣告版位的網頁上使用單一請求架構 (SRA),請勿在建立靜態廣告版位 div 前呼叫 display()廣告最佳做法所述,系統會在您第一次呼叫 display() 時要求在這之前定義的所有廣告版位。雖然插頁式遊戲廣告版位不必預先定義 <div>,但靜態廣告版位必須這麼做。如果在網頁顯示上述元素前呼叫 display(),可能會造成信號品質較低。建議您在定義靜態版位後,再延遲初始呼叫。

實作範例

觀看示範影片