amp-instagram
簡介
使用 amp-instagram
元件將 instagram 影片和相片嵌入您的 AMP HTML 檔案中。
設定
在標頭中匯入 amp-instagram 元件
<script async custom-element="amp-instagram" src="https://cdn.ampproject.org/v0/amp-instagram-0.1.js"></script>
基本用法
Instagram 相片透過 instagram data-shortcode 嵌入,該 shortcode 位於每個 instagram 相片 URL 中。許多 instagram 相片是正方形的。當您設定 layout="responsive"
時,任何 width
和 height
相同的值都適用。
<amp-instagram data-shortcode="1totVhIFXl" width="1" height="1" layout="responsive">
</amp-instagram>
非正方形圖片
如果圖片不是正方形,則 width
和 height
應為 instagram 圖片的實際寬度和高度。
<amp-instagram data-shortcode="_hIitKIFcg" width="600" height="450" layout="responsive">
</amp-instagram>
標題
您可以使用 data-captioned
屬性加入標題
<amp-instagram data-shortcode="BMQ8i4lBTlb" data-captioned width="1" height="1" layout="responsive">
</amp-instagram>
需要更多說明嗎?
如果此頁面上的說明未能涵蓋您的所有問題,請隨時與其他 AMP 使用者聯繫,討論您的確切使用案例。
前往 Stack Overflow 未說明的特性?AMP 專案強烈鼓勵您的參與和貢獻!我們希望您能成為我們開放原始碼社群的持續參與者,同時我們也歡迎針對您特別關注的問題提供一次性貢獻。
在 GitHub 上編輯範例-
由 @sebastianbenz 撰寫