amp-sticky-ad

1.0 0.1

<script async custom-element="amp-sticky-ad" src="https://cdn.ampproject.org/v0/amp-sticky-ad-1.0.js"></script>

用法

提供在頁面底部顯示和黏貼廣告內容的方式。

• 在一個 AMP 文件中只能有一個 <amp-sticky-ad>。<amp-sticky-ad> 應該只有一個直接子項：<amp-ad>。注意：請確保您包含 <amp-ad> 元件的任何必要腳本。
• 黏性廣告會出現在頁面底部。
• 黏性廣告會引入一個全寬的空白容器，然後根據 <amp-ad> 的寬度和高度填滿黏性廣告。
• 黏性廣告的高度取決於其子項所需的內容，最高可達其最大高度。
• 黏性廣告的最大高度為 100 像素，如果高度超過 100 像素，則高度將為 100 像素，且溢出的內容將會被隱藏。
• 黏性廣告的寬度使用 CSS 設定為 100%，且無法覆寫。
• 黏性廣告的不透明度使用 CSS 設定為 1，且無法覆寫。
• 黏性廣告的背景顏色可以自訂以符合頁面樣式。但是，任何半透明或透明的背景將不被允許，並將被更改為非透明顏色。
• 當滾動到頁面底部時，視窗會自動使用黏性廣告的額外高度進行填充，以便永遠不會隱藏任何內容。
• 在橫向模式下，黏性廣告會置中對齊。
• 黏性廣告可以透過關閉按鈕關閉和移除。
• 如果沒有廣告填滿，黏性廣告容器將會摺疊，並且不再可見。

範例

<amp-sticky-ad layout="nodisplay">
  <amp-ad
    width="320"
    height="50"
    type="doubleclick"
    data-slot="/35096353/amptesting/formats/sticky"
  >
  </amp-ad>
</amp-sticky-ad>

屬性

layout (required) (版面配置 (必填))

必須設定為 nodisplay。

樣式設定

amp-sticky-ad 元件可以使用標準 CSS 設定樣式。

• 黏性廣告容器樣式可以透過 amp-sticky-ad CSS 類別設定。
• 關閉按鈕樣式可以透過 amp-sticky-ad-close-button CSS 類別設定。
• 廣告和關閉按鈕之間的填充條樣式可以透過 amp-sticky-ad-top-padding CSS 類別設定。

驗證

請參閱 AMP 驗證器規格中的 amp-sticky-ad 規則。