AMP

amp-gist

描述

建立一個 iframe 並顯示 GitHub Gist。

 

必要腳本

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

支援版面配置

範例

用法

建立一個 iframe 並顯示 GitHub Gist

以下範例示範如何嵌入多個檔案

<amp-gist
  data-gistid="b9bb35bc68df68259af94430f012425f"
  layout="fixed-height"
  height="225"
>
</amp-gist>

以下範例示範如何嵌入單一檔案

<amp-gist
  data-gistid="a19e811dcd7df10c4da0931641538497"
  data-file="hi.c"
  layout="fixed-height"
  height="185"
>
</amp-gist>

屬性

data-gistid

要嵌入的 gist ID。

layout

目前僅支援 fixed-height

height

gist 或 gist 檔案的初始高度,以像素為單位。

您應該透過瀏覽器 (例如 Chrome 開發人員工具) 檢查 gist 的高度來取得。一旦 Gist 載入,包含的 iframe 將會調整大小以符合,使其內容能夠適應。

data-file (選填)

如果指定,則僅顯示 gist 中的一個檔案。

title (選填)

為元件定義 title 屬性,以傳播到基礎的 <iframe> 元素。預設值為 "Github gist"

驗證

請參閱 AMP 驗證器規範中的 amp-gist 規則

需要更多協助?

您可能已經讀過這份文件很多次,但它仍然無法解答您的所有疑問?或許其他人也有相同的感受:請在 Stack Overflow 上與他們交流。

前往 Stack Overflow
發現錯誤或缺少功能?

AMP 專案非常鼓勵您的參與和貢獻!我們希望您能成為我們開源社群的長期參與者,同時也歡迎您針對您特別關注的問題做出一次性的貢獻。

前往 GitHub