Menampilkan Sound Cloud Pada Blog Valid Amp HTML

Disini saya akan berbagi sedikit mengenai jejaring sosial Soundcloud yang berbasis music. Soundcloud adalah platform distribusi suara secara online yang memungkinkan kolaborasi, promosi, dan distribusi dari rekaman suara. Kita bisa berbagi suara yang kita share dan dapat dinikmati oleh para pengguna souncloud di seluruh dunia, dan kita bisa mendapatkan respons langsung dari para pendengar, bisa dengan cara men like ataupun langsung berkomentar dan dapat memberikan kepuasan tersendiri kepada para penggunannya.

Kita sudahin saja dulu masalah apa itu Soundcloud, untuk lebih jelasnya sobat bisa cari lagi di mbah Google. jika pada postingan sebelumnya saya pernah membahas Tool Baru Dari Search Console Untuk Cek AMP HTML, maka kali ini kita akan coba memasang Sound Cloud Music Pada Blog Amp kita.

Oke langsung saja kita simak dibawah ini Tutorial Menampilkan atau Mendengarkan Soundcloud Pada Blog Valid Amp HTML.

Langkah Pertama
Salin kode dibawah ini dan letakan sebelum tag </head>

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

Langkah Kedua
Lalu Save Template.
Langkah Ketiga
Kemudian buatlah sebuah postingan dan sisipkan kode di bawah ini kedalam postingan anda tersebut pada HTML mode.

Tampilan Pertama

<amp-soundcloud height="167" 
      layout="fixed-height" 
      data-trackid="19505822"> 
</amp-soundcloud>

Tampilan Kedua

<amp-soundcloud height="450" 
      layout="fixed-height" 
      data-trackid="19505822" 
      data-visual="true"> 
</amp-soundcloud>

Tampilan Ketiga
Terakhir Publikasikan postingan anda dan lihat hasilnya.

Keterangan:
Untuk mendapatkan data-trackid="19505822" anda terlebih dahulu harus mengunjungi, situs Soundcloud di soundcloud.com, lalu pilihlah music kesukaan anda dan pada bagian bawah dari tampilan bar music silahkan klik tombol share, lalu pilih Embed, maka akan di dapat kode seperti dibawah ini.

Contoh kode Embed :

<iframe width="100%" height="450" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/19505822&amp;auto_play=false&amp;hide_related=false&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false&amp;visual=true"></iframe>

Dari contoh kode embed diatas anda cukup mengambil kode angka yang sudah saya higtlight 19505822

Demonya silahkan mainkan music dibawah ini
Tampilan Pertama

Tampilan Kedua
Demikianlah tutorial cara memasang atau embed kode dari Soundcloud pada Halaman blog Amp, selamat mencoba dan semoga bermanfaat.