重要事項:此文件不適用於您目前選擇的格式 stories!
amp-instagram
說明
顯示 Instagram 嵌入內容。
必要指令碼
<script async custom-element="amp-instagram" src="https://cdn.ampproject.org/v0/amp-instagram-0.1.js"></script>
支援的版面配置
行為
針對 Instagram 嵌入內容,width
和 height
屬性較為特殊。這些應為 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 上與他們交流。
前往 Stack Overflow 發現錯誤或缺少功能?AMP 專案大力鼓勵您的參與和貢獻!我們希望您能持續參與我們的開放原始碼社群,同時也歡迎您針對您特別關注的問題提供一次性的貢獻。
前往 GitHub