Cara Embed Player Musik Spotify di Blog ataupun Website


Embed player Spotify adalah sebuah fitur yang memungkinkan Anda menanamkan atau menyematkan player Spotify ke dalam halaman web atau blog, sehingga pengunjung situs dapat memutar lagu, album, playlist, atau podcast langsung dari halaman tersebut tanpa harus keluar dari situs untuk membuka aplikasi Spotify.

Embed player ini biasanya berupa sebuah iframe yang berisi tampilan Spotify mini, lengkap dengan tombol play, kontrol volume, dan informasi dasar seperti judul lagu dan nama artis. Dengan begitu, konten audio dari Spotify bisa langsung dimainkan di website, menjadikannya cara yang efektif untuk berbagi musik atau podcast dengan pengunjung situs.

Contohnya, setelah Anda menambahkan kode embed, player Spotify akan terlihat seperti kotak audio interaktif yang memungkinkan orang mendengarkan lagu atau playlist yang Anda pilih langsung dari halaman web/blog Anda.


{tocify} $title={Table of Contents}

Untuk menambahkan atau embed player musik Spotify di blog atau website, Anda bisa mengikuti langkah-langkah berikut:

1. Melalui Spotify Web Player atau Aplikasi Desktop:

  1. Buka Spotify: Anda bisa menggunakan Spotify Web Player di browser atau aplikasi Spotify Desktop.
  2. Cari Lagu/Album/Playlist/Podcast: Cari lagu, album, playlist, atau podcast yang ingin Anda sematkan.
  3. Klik Opsi "More" (Tiga Titik): Di samping judul lagu/album/playlist/podcast, klik ikon tiga titik vertikal untuk membuka menu pilihan.
  4. Pilih "Share": Dari menu yang muncul, pilih opsi "Share" (Bagikan).
  5. Pilih "Embed Track": Setelah memilih "Share", akan ada opsi "Copy Embed Code" atau "Embed Track". Klik ini.
  6. Salin Kode Embed: Spotify akan menampilkan kode HTML untuk embed. Salin kode tersebut.



2. Masukkan Kode Embed ke dalam Blog/Website:

  1. Buka Editor Blog/Website: Masuk ke halaman di mana Anda ingin menambahkan player Spotify (misalnya pada post blog atau halaman website).
  2. Tambahkan Kode HTML: Temukan tempat di mana Anda dapat menambahkan kode HTML. Biasanya terdapat opsi seperti "Edit HTML" atau "Custom HTML" dalam editor.
  3. Tempelkan Kode Embed: Paste kode yang telah Anda salin dari Spotify ke dalam bagian HTML editor.
  4. Simpan atau Publish: Setelah selesai, simpan perubahan atau publikasikan posting/halaman tersebut.

3. Kustomisasi Tampilan (Opsional):

Anda bisa menyesuaikan ukuran player dengan mengedit nilai width dan height dalam kode embed. Contoh default biasanya seperti ini:
<iframe style="border-radius:12px" 
        src="https://open.spotify.com/embed/track/6rqhFgbbKwnb9MLmUQDhG6?utm_source=generator" 
        width="300" 
        height="380" 
        frameBorder="0" 
        allowtransparency="true" 
        allow="encrypted-media">
</iframe>

Anda bisa mengganti nilai width dan height sesuai keinginan, misalnya:
width="400" height="480"

Dengan langkah-langkah ini, player Spotify akan muncul di halaman blog atau website Anda, memungkinkan pengunjung untuk mendengarkan langsung tanpa harus meninggalkan situs Anda. 

Perlu diingat bahwa musik yang diembed akan tampil sebagai musik preview saja (durasi reff) apabila pengunjung belum login akun spotify. Namun, jika pengunjung sudah login akun spotify hasil embed player musiknya akan full versi alias berdurasi full.

Dibawah ini adalah contoh hasil embed player musik dari spotify


Bagus Surochman

"Seorang yang selalu berusaha menjadikan setiap tulisan bermakna, penuh manfaat, dan inspirasi bagi banyak orang. Percaya bahwa kata-kata memiliki kekuatan untuk mengubah, menggerakkan, dan memberikan dampak positif dalam kehidupan. Berkomitmen untuk terus belajar, berbagi, dan menebar kebaikan melalui tulisan." facebook instagram twitter blogger

Lebih baru Lebih lama