amp-soundcloud
说明
显示 Soundcloud 剪辑。
必需脚本
<script async custom-element="amp-soundcloud" src="https://cdn.ampproject.org/v0/amp-soundcloud-1.0.js"></script>
<script async custom-element="amp-soundcloud" src="https://cdn.ampproject.org/v0/amp-soundcloud-1.0.js"></script> <link rel="stylesheet" href="https://cdn.ampproject.org/v0/amp-soundcloud-1.0.css">
用法
显示 Soundcloud 剪辑。
在有效的 AMP 文档外部独立使用
Bento 允许你在非 AMP 页面中使用 AMP 组件，而无需完全提交到有效的 AMP。你可以获取这些组件，并将它们放在不支持 AMP 的框架和 CMS 中进行实现。在我们的指南 在非 AMP 页面中使用 AMP 组件 中阅读更多内容。
要查找 amp-soundcloud 的独立版本，请参阅 bento-soundcloud。
示例
通过响应式布局，示例中的 width 和 height 应该为 1:1 纵横比嵌入提供正确的布局
可视化模式
<amp-soundcloud width="480" height="480" layout="responsive" data-trackid="243169232" data-visual="true" ></amp-soundcloud>
经典模式
<amp-soundcloud width="480" height="480" layout="responsive" data-trackid="243169232" data-color="ff5500" ></amp-soundcloud>
属性
| data-trackid | 如果未定义 data-playlistid，则此属性是必需的。此属性的值是音轨的 ID，一个整数。 |
| data-playlistid | 如果未定义 data-trackid，则此属性是必需的。此属性的值是播放列表的 ID，一个整数。 |
| data-secret-token（可选） | 音轨的密钥令牌（如果是私有的）。 |
| data-visual（可选） | 如果设置为 true，则显示全宽“可视化”模式；否则，它将显示为“经典”模式。默认值为 false。 |
| data-color（可选） | 此属性是“经典”模式的自定义颜色覆盖。此属性在“可视化”模式中被忽略。指定十六进制颜色值，不带前导 #（例如，data-color="e540ff"）。 |
| 宽度和高度 | amp-soundcloud 的布局设置为 fixed-height，并且它填充所有可用的水平空间。这非常适合“经典”模式，但对于“可视化”模式，建议高度为 300px、450px 或 600px，根据 Soundcloud 嵌入代码。这将允许剪辑的内部元素在移动设备上正确调整大小。 |
验证
请参阅 AMP 验证器规范中的 amp-soundcloud 规则。
需要更多帮助？
您已经阅读了本文档十几次，但它并没有真正解决您所有的问题？也许其他人也有同样的感觉：在 Stack Overflow 上联系他们。
转到 Stack Overflow 发现了一个错误或缺少某个功能？AMP 项目强烈鼓励您参与和贡献！我们希望您成为我们开源社区的持续参与者，但我们也欢迎针对您特别热衷的问题进行一次性贡献。
转到 GitHub