廣告大小

您定義的每個廣告版位都必須指定可在該廣告單元放送。廣告大小的指定方式會因要使用的廣告類型而異以及廣告版位本身的大小和彈性

在某些情況下，系統可能會在以下項目的委刊項層級覆寫廣告大小： Google Ad Manager請造訪說明中心瞭解詳情內容。

固定大小廣告

您可以定義單一固定大小的廣告版位。

googletag
  .defineSlot("/6355419/Travel/Europe/France/Paris", [300, 250], "fixed-size-ad")
  .addService(googletag.pubads());

在本例中，系統只會放送大小為 300x250 的廣告素材。

重點：使用固定大小的廣告時，我們極力建議您定義用於顯示廣告素材的 <div> 元素大小。開始時間通常是非同步顯示，可能會導致。

多重大小廣告

如果廣告支援多種大小，請在定義廣告版位

googletag
  .defineSlot(
    "/6355419/Travel/Europe",
    [[300, 250], [728, 90], [750, 200], "fluid"],
    "multi-size-ad",
  )
  .addService(googletag.pubads());

在本例中，大小為 300x250、728x90 和 750x200 的廣告素材可能是廣告。Ad Manager 只會考慮符合這些大小的廣告素材廣告選擇程序中的進度。

如果未在 CSS 中指定廣告版位 <div> 的尺寸， GPT 會自動將尺寸設為宣告的高度和宣告寬度超過 1 像素。display() 在本例中就是 750x90。不過，此規模調整可能會在也導致內容移位為了避免版面配置位移，請使用 CSS 保留空間，如「盡量減少版面配置位移」指南。

使用多種大小廣告時，請確保版面配置彈性靈活，支援指定大小最大的廣告。這樣就能避免廣告素材就是不小心裁剪

自動調整廣告

自動調整廣告沒有固定的大小，而是會配合廣告素材內容進行調整螢幕。原生廣告是目前唯一的自動調整廣告 Ad Manager 支援的類型

使用自動調整廣告時，系統可能會指定自訂 fluid 大小。

googletag
  .defineSlot("/6355419/Travel", ["fluid"], "native-ad")
  .addService(googletag.pubads());

在這個範例中，廣告版位的寬度為父項容器配合廣告素材內容調整高度GPT 步驟調整廣告版位大小的方式如下：

接收廣告回應。
將廣告素材內容寫入 iframe，初始高度設為 0px 並將寬度設為 100%
iframe 中的所有資源都載入完畢後，系統就會建立廣告素材方法是將 iframe 的高度設為 iframe 的 <body> 元素。

，瞭解如何調查及移除這項存取權。

回應式廣告

回應式廣告可讓您指定系統會根據執行 Google Analytics 4 的請求。這項功能可用於控制已放送的廣告素材不同類型的裝置 (桌機、平板電腦、行動裝置等)。

方法是定義可視區域大小和廣告大小的對應然後將對應結果與廣告版位建立關聯

const responsiveAdSlot = googletag
  .defineSlot(
    "/6355419/Travel/Europe",
    [
      [300, 250],
      [728, 90],
      [750, 200],
    ],
    "responsive-ad",
  )
  .addService(googletag.pubads());

const mapping = googletag
  .sizeMapping()
  .addSize(
    [1024, 768],
    [
      [750, 200],
      [728, 90],
    ],
  )
  .addSize([640, 480], [300, 250])
  .addSize([0, 0], [])
  .build();

responsiveAdSlot.defineSizeMapping(mapping);

在這個範例中，對應關係指定：

如果可視區域 >= 1024x768，就可以放送大小為 750x200 或 728x90 的廣告。
時間 1024x768 >可視區域 >= 640x480，大小為 300x250 的廣告可以放送。
可視區域 <640x480，無法放送任何廣告。

GPT 會偵測瀏覽器並使用符合要求的最大對應。為了決定對應 GPT 時，系統會先考量寬度，再考量高度 (例如[100, 10] >[10, 100])。發生對應錯誤或可視區域時無法決定尺寸，系統將使用 defineSlot() 中指定的大小。

接著，對應會呼叫 Slot.defineSizeMapping() 方法。這個方法可接受以下格式的對應陣列：

[
  [
    [viewport-width-1, viewport-height-1],
    [[ad-width-1, ad-height-1], [ad-width-2, ad-height-2], ...]
  ],
  [
    [viewport-width-2, viewport-height-2],
    [[ad-width-3, ad-height-3], [ad-width-4, ad-height-4], ...]
  ],
  ...
]

此陣列中的可視區域大小順序會界定其優先順序。已用於 SizeMappingBuilder 透過上述範例輕鬆產生這些大小會自動由大到小排列。在這個例子中舉例來說 SizeMappingBuilder.build() 是：

[
  [[1024, 768], [[750, 200], [728, 90]]],
  [[640, 480], [[300, 250]]],
  [[0, 0], []]
]