AMP
  • 网站

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 数据短代码嵌入,该代码在每个 Instagram 照片 URL 中都可以找到。许多 Instagram 照片都是方形的。当您设置 layout="responsive" 时,任何 widthheight 值相同的都可以工作。

<amp-instagram data-shortcode="1totVhIFXl" width="1" height="1" layout="responsive">
</amp-instagram>

非方形图片

如果图片不是方形的,则 widthheight 应为 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 上编辑示例