amp-instagram

您現在可以在有效的 AMP 文件之外使用此元件，方法是使用此元件的 Bento 版本。請參閱 Bento 指南以瞭解詳情。

顯示 Instagram 嵌入內容。

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

行為

`width` 和 `height` 屬性對於 Instagram 嵌入內容而言是特殊的。這些應為 Instagram 圖片的實際寬度和高度。系統會自動為 Instagram 在圖片周圍新增的「外框」新增空間。

許多 Instagram 貼文是正方形的。當您設定 `layout="responsive"` 時，任何 `width` 和 `height` 相同的數值都適用。

範例

<amp-instagram
  data-shortcode="fBwFP"
  data-captioned
  width="400"
  height="400"
  layout="responsive"
>
</amp-instagram>

如果 Instagram 貼文不是正方形，您需要輸入圖片的實際尺寸。

當使用非回應式版面配置時，您需要考量到圖片周圍為「instagram 外框」新增的額外空間。目前圖片上方和下方各有 48 像素，兩側各有 8 像素。

data-shortcode	Instagram data-shortcode 可以在每個 Instagram 相片網址中找到。例如，在 https://instagram.com/p/fBwFP 中，`fBwFP` 是 data-shortcode。
data-captioned	包含 Instagram 貼文說明。`amp-instagram` 會嘗試調整大小以符合正確的高度，包括貼文說明。
通用屬性	此元素包含擴充至 AMP 元件的通用屬性。

請參閱 AMP 驗證工具規格中的amp-instagram 規則。

需要更多協助嗎？

您已閱讀此文件十幾次，但它仍然沒有涵蓋您的所有問題？或許其他人也有相同的感受：請在 Stack Overflow 上與他們聯繫。

發現錯誤或缺少功能？

AMP 專案非常鼓勵您的參與和貢獻！我們希望您能成為我們開放原始碼社群的持續參與者，但我們也歡迎您針對您特別感興趣的問題提供一次性的貢獻。