AMP

重要事項:此文件不適用於您目前選取的格式 電子郵件

amp-soundcloud

 
您現在可以在有效的 AMP 文件之外使用此元件,方法是使用此元件的 Bento 版本。在 Bento 指南中瞭解更多資訊。

說明

顯示 Soundcloud 音訊片段。

 

必要指令碼

<script async custom-element="amp-soundcloud" src="https://cdn.ampproject.org/v0/amp-soundcloud-0.1.js"></script>

範例

使用回應式版面配置時,範例中的 widthheight 應該會為 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,且會填滿所有可用的水平空間。這非常適合「經典」模式,但對於「視覺」模式,建議高度為 300px、450px 或 600px,如同 Soundcloud 嵌入程式碼一樣。這可讓音訊片段的內部元素在行動裝置上正確調整大小。

驗證

請參閱 AMP 驗證工具規格中的 amp-soundcloud 規則

需要更多協助嗎?

您已閱讀此文件十幾次,但它似乎沒有涵蓋您的所有問題?也許其他人也有相同的感受:在 Stack Overflow 上與他們交流。

前往 Stack Overflow
發現錯誤或缺少功能?

AMP 專案強烈鼓勵您的參與和貢獻!我們希望您能成為我們開放原始碼社群的長期參與者,但我們也歡迎您針對您特別熱衷的問題提供一次性的貢獻。

前往 GitHub