Cara Embed Musik Di SoundCloud Agar Valid HTML5 Dan Seo Friendly

Cara Embed Musik Di SoundCloud
Seperti telah kita ketahui bahwa banyak penyanyi-penyanyi sekaliber dunia mengupload lagu-lagunya di SoundCloud. Dan kabar baiknya bagi yang mempunyai web atau blog, kita disediakan kode embed-nya agar lagu-lagu favorite kita bisa ditampilkan di blog atau web kita.

Namun bagi Anda yang peduli akan validasi HTML5 dan skor SEO blog di Chkme ada baiknya lebih memperhatikan kode embed-nya agar tidak menyebabkan error pada validasi HTML5 dan tidak mengurangi skor SEO blog kita. Sekali kita melihat kode embed-nya yang menggunakan iframe maka kita tahu bahwa ini akan menjadi error pada skor SEO di Chkme.

Juga pada kode embednya ada kode yang error pada validasi HTML5 yaitu satuan % pada lebar widgetnya. Untuk mengatasi kode embed dari SoundCloud ini agar SEO friendly dan valid HTML5, kita perlu merubah sedikit kode embed-nya.

Biasanya kode embed-nya akan tampil seperti di bawah ini.

<iframe width="100%" height="450" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/users/20908063"></iframe>

Perhatikan kode-kode yang berwarna merah, itulah kode-kode ang akan dirubah dan dihapus. Untuk kode iframe silahkan ganti dengan object. Kode 100% silahkan ganti dengan angka sesuai dengan lebar yang Anda inginkan tanpa kode %. Hapus kode scrolling="no" frameborder="no" dan ganti kode src dengan data. Sehingga penampakannya akan seperti di bawah ini.

<object width="600" height="450" data="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/users/20908063"></object>

Mudah bukan? Nah sebagai bonusnya silahkan nikmati lagu-lagu di bawah ini.



You Might Also Like:

How to style text in Disqus comments:
  • To write a bold letter please use <strong></strong> or <b></b>.
  • To write a italic letter please use <em></em> or <i></i>.
  • To write a underline letter please use <u></u>.
  • To write a strikethrought letter please use <strike></strike>.
  • To write HTML code, please use <code></code> or <pre></pre> or <pre><code></code></pre>.
    And use parse tool below to easy get the style.
Show Parser Hide Parser
Disqus Comments