amp-soundcloud
简介
使用 amp-soundcloud
组件,从 AMP HTML 文件中播放 Soundcloud 音轨。
设置
导入 amp-soundcloud
组件。
<script async custom-element="amp-soundcloud" src="https://cdn.ampproject.org/v0/amp-soundcloud-0.1.js"></script>
经典模式
您可以在 Soundcloud 嵌入代码中找到 trackid。唯一支持的布局模式是 fixed-height
。从 Soundcloud 嵌入代码中获取高度。
<amp-soundcloud height="166" layout="fixed-height" data-trackid="89299804"></amp-soundcloud>
带自定义颜色的经典模式
经典模式允许通过 data-color
属性设置自定义颜色。
<amp-soundcloud height="166" layout="fixed-height" data-trackid="89299804" data-color="448AFF"></amp-soundcloud>
视觉模式
视觉模式不允许更改颜色。请确保使用与 Soundcloud 嵌入代码相同的高度。
<amp-soundcloud height="450" layout="fixed-height" data-trackid="89299804" data-visual="true"></amp-soundcloud>
播放列表模式
播放列表模式允许通过其 ID(在 Soundcloud 嵌入代码中找到)嵌入完整的 Soundcloud 播放列表。唯一的更改是用 data-playlistid
替换 data-trackid
<amp-soundcloud height="450" layout="fixed-height" data-playlistid="331919427" data-visual="true"></amp-soundcloud>
支持的属性
还有用于颜色和密钥令牌的属性。要为 RGB 十六进制的播放按钮设置颜色,请使用 data-color
。要嵌入私有音轨和播放列表,请使用 data-secret-token
属性。
<amp-soundcloud height="450" layout="fixed-height" data-playlistid="331919427" data-color="ff0000" data-secret-token="yoursecrettoken" data-visual="true"></amp-soundcloud>
需要进一步解释吗?
如果此页面上的解释未能涵盖您的所有问题,请随时与其他 AMP 用户联系,讨论您的确切用例。
转到 Stack Overflow 未解释的功能?AMP 项目强烈鼓励您的参与和贡献!我们希望您能成为我们开源社区的长期参与者,但也欢迎您为特别感兴趣的问题做出一次性贡献。
在 GitHub 上编辑示例-
作者: @sebastianbenz