Menambahkan Musik Player Html 5 Dengan Playlist Di Blog

Cara Menambahkan Musik Player HTML 5 dengan Playlist di Blog, aku akan menjelaskan bagaimana menciptakan flash MP3 palyer di Blog Blogger Anda. Semua browser yang kita pakai akan berbeda konfigurasi, dan mungkin sebagian browser tidak mendukung flash tersebut.

Lalau bagaimana cara menambahkan HTML 5 Musik Player dengan Playlist di Blogger? dalam artikel ini aku akan menandakan cara menambahkan Musik palyer HTML 5 dengan playlist diblog.

1. Login Ke Www.Blogger.com <Dashbord>
2. Plihit HTML.
3. Cari Kode </haed>  Copy aba-aba dbawah ini diatas aba-aba Tersebut.

<link href='http://fonts.googleapis.com/css?family=Open+Sans:400' rel='stylesheet' type='text/css'/>
<link href="https://googledrive.com/host/0B0WJjcJEFNziLXFVNjE1Mms2VkU" rel="stylesheet"></link>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
<script src="https://googledrive.com/host/0B0WJjcJEFNziYXRYUFZEVkRNaTA" type="text/javascript"></script>

     4. Klik Save .

Memanbahkan Musik HTML 5 palyet di blog.

Berikutnya untuk menambahkan musik HTML 5 tersebut terserah Anda mau di halaman/postingan tertentu, atau mau disidebar tergantung kebutuhan Ada.

Pergi Ke Blogger
Tata Letak << Tambahkan Gadget>>  <<Tambahkan HTML/JavaScript>
Lalu masukan aba-aba berikut kedalam kotak HTML Text.

<div class="mbl">
 <div class="mbl_player" id="mnplp">
  <div class="mbl_art_bg"></div>
  <img class="mbl_cover" src="" alt=" aku akan menjelaskan bagaimana menciptakan flash MP Menambahkan Musik Player HTML 5 dengan Playlist di Blog"/>
  <span class="mnpl_title"></span>
  <span class="mnpl_author"></span>

  <div class="mnpl_volume_min"></div>
  <div class="mnpl_volume"></div>
  <div class="mbl_volume_max"></div>

  <div class="mnpl_toolbar">
   <div class="mnpl_tlb_prev"></div>
   <div class="mnpl_tlb_stop"></div>
   <div class="mnpl_tlb_next"></div>
   <div class="mnpl_current"></div>
   <div class="mnpl_long"></div>
   <div class="mnpl_all"></div>
  </div>

  <div class="mbl_playlist">
  </div>
 </div>
 </div>
<script type="text/javascript">
$(function(){
$('#mnplp').mnplp({
'volume': 80,
'playlist':[
{"title":"Track-Name", "author":"Author-Name", "cover":"thumb-image.jpg", "background":"cover-image.jpg", "mfile":"music.mp3"},
{"title":"Track-Name", "author":"Author-Name", "cover":"thumb-image.jpg", "background":"cover-image.jpg", "mfile":"music.mp3"},
{"title":"Track-Name", "author":"Author-Name", "cover":"thumb-image.jpg", "background":"cover-image.jpg", "mfile":"music.mp3"},
{"title":"Track-Name", "author":"Author-Name", "cover":"thumb-image.jpg", "background":"cover-image.jpg", "mfile":"music.mp3"},
{"title":"Track-Name", "author":"Author-Name", "cover":"thumb-image.jpg", "background":"cover-image.jpg", "mfile":"music.mp3"}
    ]
   });
  });
 </script>

Costomization

• Judul: Merupakan judul musik atau lagu.
• mfile: Ini merupakan file musik dalam .mp3 ekstensi
• Penulis: Nama orang yang terdiri musik.
• meliputi: Sampul jempol gambar yang muncul ketika lagu diputar.
• background: Gambar yang muncul di latar belakang pemutar musik.
• Selamat: Setelah menyesuaikan, tekan "Simpan" tombol yang terletak di bab bawah jendela. Sekarang, cek blog Anda. 

 Sekian cara menciptakan atau Menambahkan Musik Player HTML 5 dengan Playlist di Blog,, Happy Blogging,,, Wasalam (www.contohblogspotnih.blogspot.com).
Sumber http://contohblogspotnih.blogspot.com/

Related Posts