重要事項:本文件不適用於您目前選擇的格式 故事!
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" )。 |
width 和 height | amp-soundcloud 的版面配置設定為 fixed-height ,且會填滿所有可用的水平空間。這非常適合「經典」模式,但對於「視覺」模式,建議高度為 300 像素、450 像素或 600 像素,如 Soundcloud 嵌入程式碼所示。這可讓剪輯片段的內部元素在行動裝置上正確調整大小。 |
驗證
請參閱 AMP 驗證器規格中的 amp-soundcloud 規則。
需要更多協助嗎?
您已經讀過這份文件很多次,但它仍然沒有真正涵蓋您的所有問題嗎?也許其他人也有相同的感受:請在 Stack Overflow 上與他們聯繫。
前往 Stack Overflow 發現錯誤或缺少功能?AMP 專案大力鼓勵您的參與和貢獻!我們希望您能成為我們開放原始碼社群的長期參與者,但我們也歡迎針對您特別熱衷的問題提供一次性的貢獻。
前往 GitHub